2025-08-18 React 공식 문서 - UI 표현하기
·
TIL
1. 오늘 한 것 (What I Did)React 공식 문서 'UI 표현하기' 파트 읽고 실습하기첫 React 컴포넌트를 작성하는 방법다중 컴포넌트 파일을 만드는 경우와 방법JSX로 JavaScript에 마크업을 추가하는 방법컴포넌트에서 JavaScript 기능을 이용하기 위해 JSX에 중괄호를 사용하는 방법Props를 사용하여 컴포넌트를 구성하는 방법조건부 렌더링을 하는 방법여러 개의 컴포넌트를 한 번에 렌더링하는 방법컴포넌트를 순수하게 유지하여 혼란스러운 버그를 피하는 방법트리로서 UI를 이해하는 것이 유용한 이유2. 새로 이해한 것 (What I Learned)2-1. React의 핵심 아이디어컴포넌트 = 재사용 가능한 UI 블록기존: HTML/CSS/JS 따로따로 관리React: 관련된 것들을 하..
2025-08-12 NestJS 구글 소셜 로그인 & JWT 인증 시스템 구현
·
TIL
1. 오늘 한 것 (What I Did)구글 OAuth2 소셜 로그인 구현JWT 토큰 발급 시스템 구현 (AccessToken + RefreshToken)JWT 기반 API 보호 시스템 구현구현한 파일들src/├── 00.auth/│ ├── auth.service.ts # JWT 토큰 발급│ ├── auth.controller.ts # 구글 로그인 API│ ├── auth.module.ts # 인증 모듈│ ├── google.strategy.ts # 구글 OAuth 전략│ ├── google-auth.guard.ts # 구글 인증 가드│ └── jwt.strategy.ts # JWT 검증 전략├── 01.user/│ ├── user...
2025-08-11 NestJS API 테스트 및 문제 해결
·
TIL
1. 오늘 한 것 (What I Did)NestJS CRUD API HTTP 요청 테스트500 Internal Server Error 문제 해결실제 진행한 작업들1단계: HTTP 요청 테스트 환경 설정VS Code REST Client 확장 프로그램 사용.vscode/settings.json에 환경변수 설정user.http 파일 생성2단계: API 테스트 시도 및 에러 발생POST {{domain}}/usersContent-Type: application/json{ "providerId": "kakao123", "email": "test@test.com", "name": "홍길동"}결과: HTTP 500 Internal Server Error 발생3단계: 에러 원인 분석 및 해결터미널 로그 확인:..
2025-08-10 NestJS UsersService CRUD 구현 및 DTO 작성
·
TIL
1. 오늘 한 것 (What I Did)UsersService에 CRUD 기능 만들기DTO 파일 작성하기TypeORM 사용법 배우기2. 새로 이해한 것 (What I Learned)2-1. Service vs Repository 차이Service - 비즈니스 로직async create(createUserDto: CreateUserDto) { // "고객이 성인인지 확인하고, 재고 체크하고, 할인 적용해서 판매해" const user = await this.repository.save({ ...createUserDto }); return user;}Repository - 데이터 접근// "그냥 데이터 가져오고, 저장하고, 삭제만 해"repository.save() // 저장repository.f..
2025-08-09 NestJS + TypeORM DB 연동
·
TIL
1. 오늘 한 것 (What I Did)NestJS와 TypeORM을 사용해서 MySQL 데이터베이스 연동User Entity 생성 및 기본 CRUD 준비1-1. 실제 진행한 작업들1단계: 환경 설정npm install typeorm @nestjs/typeorm mysql2npm install typeorm-naming-strategies2단계: DB 연결 설정 파일 생성typeorm.config.ts 파일 생성MySQL 연결 정보 설정 (host, port, username, password, database)3단계: User Entity 생성nest g res users 명령어로 기본 구조 자동 생성src/users/entities/user.entity.ts에 User Entity 구현데코레이터 사용..
2025-08-06
·
TIL
1. 오늘 한 일 (What I Did)1-1. Docker로 MySQL 설치하고 실행하기1-1-1. 명령어로 MySQL 실행docker run --name mysql -e MYSQL_ROOT_PASSWORD=1234 -d -p 3306:3306 mysql:latest이 명령어 하나로 MySQL이 내 컴퓨터에 설치되고 실행됐다!--name mysql: 컨테이너 이름을 'mysql'로 지정-e MYSQL_ROOT_PASSWORD=1234: 관리자 비밀번호를 1234로 설정-p 3306:3306: MySQL 기본 포트 연결-d: 백그라운드에서 실행1-1-2. Docker Desktop GUI와 터미널 이름이 달라서 헷갈렸던 문제Docker Desktop에서는: practice-hanbi로 보임터미널에서는: ..