Todo App은 BDD(행위 주도 개발)기법을 활용하여 개발한 프로젝트입니다.
사용자는 할 일을 추가하고 수정하며, 완료한 할 일을 체크할 수 있습니다.
이 프로젝트를 통해 테스트 주도 개발 및 테스트 코드 작성에 대한 이해를 높일 수 있었습니다.

Features

• 할 일 추가: 사용자는 할 일을 추가하고 저장할 수 있습니다.
• 할 일 수정: 추가한 할 일을 수정하거나 삭제할 수 있습니다.
• 할 일 완료: 완료한 할 일을 체크하여 구분할 수 있습니다.
• 테스트 코드: Jest와 Playwright를 사용하여 테스트 코드를 작성하고 실행할 수 있습니다.

Tech Stack

• Frontend: Next.js, React Query, Recoil, TypeScript
• Backend: Firebase
• Testing: Jest, Playwright
• Deployment: Vercel

구현 세부 사항

Frontend

• Next.js를 사용하여 SSR(Server Side Rendering)을 구현하고 사용자 경험을 향상시킵니다.
• React Query를 활용하여 데이터를 관리하고 서버와의 통신을 최적화합니다.
• Recoil을 사용하여 전역 상태를 관리하고 컴포넌트 간 데이터 공유를 간편하게 합니다.
• TypeScript를 도입하여 타입 에러를 사전에 방지하고 코드의 안정성을 높입니다.

Backend

• Firebase를 사용하여 데이터베이스와 인증 시스템을 구축하고 서버리스 아키텍처를 적용합니다.

Testing

• Jest를 사용하여 유닛 테스트와 통합 테스트를 작성하고 코드의 신뢰성을 검증합니다.
• Playwright를 활용하여 End-to-End 테스트를 수행하고 사용자 시나리오를 검증합니다.

해결한 과제

• SSR 구현: Next.js를 사용하여 SSR을 구현하고 초기 로딩 속도를 최적화합니다.
• 상태 관리: Recoil을 활용하여 전역 상태를 관리하고 컴포넌트 간 데이터 공유를 효율적으로 합니다.
• 테스트 코드 작성: Jest와 Playwright를 사용하여 테스트 코드를 작성하고 실행하여 코드의 신뢰성을 높입니다.
• 서버리스 아키텍처: Firebase를 사용하여 서버리스 아키텍처를 구축하고 데이터베이스와 인증 시스템을 관리합니다.