Typescript ToDo List

배포사이트

ver. Level5

• 이번 과제는 1-5 level까지 있었지만 level5에 집중해서 구현 해봤습니다.

구현한 기능

• Typescript 사용
• Toggle Theme button
  • 새로고침 해도 번쩍거리지 않고 유지되는 theme 구현
• 첫 랜더링 시 title input에 focus
• form data입력시 적절한 length 까지만 입력 가능
  • 기준 length가 넘어가면 자동으로 length까지 자르고 custom Alert 표시
• createdAt을 기준으로 DESC 정렬
• CustomModal 구현
  • modal이 open 되면 키보드 이벤트를 사용하여 esc = 닫기 또는 취소, enter 확인 또는 닫기
  • isLoading 또는 isPending이 true일 때 Loading modal 출력
• vercel 배포 및 glitch json-server 배포 및 연결
• 유저 피드백 충실히 반영

시연

기능 시연

theme 시연 (theme 버튼 기능 및 새로고침)