전체 글 (125) 썸네일형 리스트형 DML DML (Data Manupulation Language)UPDATE 명령어 (INSERT / UPDATE / DELETE)INSERT : 테이블에 데이터를 넣을 수 있게 해줌 (행 추가)INSERT INTO users VALUES-- 데이터를 삽입할 테이블명 입력INSERT INTO users VALUES ( 'hayoung', 'hayoung@abc.com', 'abc123123!', 'hi');-- (이 방법은 항상 열의 순서와 모든 값을 기억해야 하기 때문에 좋지 않음) 추가할 데이터의 열 이름을 괄호안에 명시하여 값을 넣을 수 있음 (그외의 값은 null)INSERT INTO users (name, email) VALUES ( 'gamja', 'gamja@gmail.com'); UPD.. DDL DDL (Data Definition Language)데이터베이스 구조를 정의하고 수정하는 언어 SQL 명령어 작성 시 - 대문자로 쓰는 이유? SQL 은 대문자, 소문자인지 신경쓰지 않음- 다만 대문자 작성 시 가독성이 좋다는 사람, 그냥 소문자가 좋다는 사람들이 있음- SQL 키워드는 대문자로, 테이블명과 열 이름은 소문자로 쓰는 컨벤션도 있음- 쿼리를 끝낼 때 항상 끝에 세미콜론을 붙일 것 (여러개의 쿼리가 있을때 각 쿼리의 시작과 끝을 알 수 있음) 테이블- 엑셀 시트 처럼 여러 종류의 테이블을 가질 수 있고 행과 열이 있음 SQLite 로 연습테이블 생성 -- 테이블 이름 (괄호 안 : 열 이름)CREATE TABLE users ( name, email, password, nickna.. SQL SQL (Structured Query Language)데이터베이스와 대화하기 위해 디자인된 언어.(데이터베이스와 통신하는데 가장 많이 사용됨)데이터가 데이터베이스에 있고, 데이터베이스는 SQL 을 사용함, 그리고 SQL 을 사용해서 데이터를 다룰 수 있음1970년대에 만들어졌고, "SQUARE" → "SEQUEL" (Structured English Query Language) → "SQL" 로 바뀜엑셀 문서랑 똑같이 생김, 행(row), 열(column) 이 있음(엑셀) 문서 - sheet(SQL) 데이터 베이스 - 테이블 SQL의 특징선언형 언어실행 방법을 말하지 않고, 원하는 결과를 명시(실행 방법은 데이터베이스 시스템이 결정)이식성SQL은 표준이 있어 기본적인 이식성을 제공하지만데이터베이스 시스.. Next.js 미들웨어(Middleware) 미들웨어(Middleware)요청이 처리되기 전에 실행되는 서버 측 함수요청을 가로채어 인증, 리다이렉션, 또는 사용자에 맞는 페이지를 제공하는 등의 작업을 수행할 수 있음 미들웨어의 역할사용자 인증 및 권한 검증 : 특정 페이지에 접근하기 전에 사용자가 인증되었는지 확인페이지 리다이렉션 : 권한이 없는 사용자를 로그인 페이지로 리다이렉션하거나, 다른 적절한 페이지로 안내할 수 있음요청 정보 변경 : 요청 객체의 내용을 동적으로 수정하고 추가 작업을 수행할 수 있음 Next.js 미들웨어의 주요 기능1. NextResponse 의 주요 API redirect()// 인증되지 않은 사용자를 로그인 페이지로 리다이렉트if (!isAuthenticated) { return NextResponse.redire.. React Hook Form React Hook FormReact 애플리케이션에서 폼을 효율적으로 관리할 수 있게 해주는 라이브러리성능이 좋고, 유연하며, 적은 코드로 복잡한 폼을 구현할 수 있음 주요 특징성능 최적화불필요한 리렌더링 방지 (Uncontrolled components를 사용하여 입력값 변경 시 전체 폼이 리렌더링되지 않음)의존성 없음, 매우 가벼운 용량쉬운 폼 검증내장된 유효성 검사 기능을 제공Yup, Zod 등의 외부 검증 라이브러리와 통합이 가능적은 코드량보일러플레이트 코드를 줄여줌직관적인 API를 제공 주요 Hook과 메서드, 옵션import { useForm } from "react-hook-form";const { register, handleSubmit, formState: { errors }, .. Zod ZodTypeScript 기반의 스키마 선언 및 유효성 검사 라이브러리TypeScript 의 타입 시스템과 완벽하게 통합되어 런타임에서 데이터 유효성을 검사할 수 있음타입 안정성, 간결한 구문, 비동기 유효성 검사, 확장성, 유연한 검증 로직 구성을 제공 GitHub - colinhacks/zod: TypeScript-first schema validation with static type inferenceTypeScript-first schema validation with static type inference - colinhacks/zodgithub.com * 스키마 선언이란?import { z } from 'zod';// 사용자 데이터 구조 정의const UserSchema = z.object(.. 프론트엔드 에러 모니터링 ❔ 프론트엔드 에러 모니터링웹 애플리케이션의 클라이언트 측 구성 요소의 성능, 사용성 및 기능을 추적하는 과정 에러 모니터링의 필요성1. 사용자 경험 향상사용자보다 먼저 문제를 감지하고 해결실시간 에러 감지로 신속한 대응 가능서비스 안정성 향상2. 비즈니스 영향프론트엔드 성능 저하는 이탈률 증가, 사용자 만족도 하락, 매출 손실로 이어질 수 있음3. 개발 효율성버그 조기 발견 및 빠른 대응에러 패턴 분석 가능 및 코드 품질 향상성능 최적화 및 유지보수 주요 모니터링 대상페이지 로드 시간첫 번째 바이트에 걸리는 시간(TTFB)사용자 인터랙션 관련 지표오류 발생 및 유형 모니터링 방법실제 사용자 모니터링(RUM): 실제 사용자의 상호작용을 기반으로 성능 추적합성 모니터링: 다양한 조건에서 사용자 상호작용을 .. Unit Test(with Jest) ❔ 유닛 테스트(Unit Test)소프트웨어의 가장 작은 단위인 "Unit(단위)" 를 격리시켜 테스트하는 방법Unit(단위) : 함수, 메서드, 클래스, 모듈 등소프트웨어 개발에서 사용되는 기본적인 테스트 방법개발 초기 단계부터 적용하여 코드의 신뢰성을 높이는 데 중요한 역할목적 및 특징각 단위가 의도한 대로 정확히 작동하는지 검증코드 변경 시 기존 기능이 올바르게 동작하는지 확인빠르게 실행과 자동화 가능다른 코드나 외부 의존성과 독립적으로 실행테스트 유형1. 상태 테스트함수의 반환값 검증객체의 상태 변화 검증2. 동작 테스트함수 호출 여부 검증이벤트 발생 검증3. 예외 테스트 에러 처리 검증경계값 테스트 ❔유닛 테스트가 필요한 이유1. 버그 조기 발견코드 변경 시 즉시 문제 발견이 가능하다.디버깅 시.. 이전 1 2 3 4 ··· 16 다음
