👉 🔗 Storybook

• Client: React, TypeScript, StyleX, Tanstack-query, Jotai
• Database: Supabase
• Deployment: Vercel

1. React 렌더링 과정과 상태 관리에 대한 이해

2. Tanstack-query 사용법 학습

   비동기 상태 관리와 데이터 캐싱을 효율적으로 처리하는 방법을 이해하고, 실시간 데이터 요청 및 서버 상태 관리의 best practice를 고민했습니다.

3. 실시간 통신 원리 학습

   Supabase Realtime을 활용한 실시간 데이터 처리 방법을 익히고, 이를 바탕으로 실시간 채팅 기능을 구현했습니다.

4. Jotai 상태 관리 학습

   Jotai를 사용해 애플리케이션 상태를 atom 단위로 관리하고, 해당 라이브러리에 대한 깊은 이해를 목표로 삼았습니다.

5. Meta의 StyleX 학습

   Meta에서 개발한 새로운 스타일 라이브러리인 StyleX를 이해하고, 이를 효율적으로 프로젝트에 적용하고자 했습니다.

• 회원가입/로그인
• 프로필 설정
• 1:1 채팅
• 친구 추가
• 비밀번호 변경
• 로그아웃

Installation

  npm install

Running the Project

  npm run dev

• feat: 새로운 기능 추가
• fix: 버그 수정
• docs: 문서 수정
• style: 코드 스타일 변경 (코드 포매팅, 세미콜론 누락 등)
• design: 사용자 UI 디자인 변경 (CSS 등)
• test: 테스트 코드, 리팩토링 (Test Code)
• refactor: 리팩토링 (Production Code)
• build: 빌드 파일 수정
• ci: CI 설정 파일 수정
• perf: 성능 개선
• chore: 자잘한 수정이나 빌드 업데이트
• rename: 파일 혹은 폴더명을 수정만 한 경우
• remove: 파일을 삭제만 한 경우