TIL 231226 React 심화 프로젝트

두두맨·2023년 12월 26일
1

프로젝트 개요

필수 요구사항

  • redux-toolkit 적용
  • react-query 로 서버 상태 관리하기
  • 외부 API 적용
  • TypeScript




위 4가지를 활용하여 프로젝트 진행.

추가 요구사항

  • React Query의 enabled 옵션과 select 옵션을 이용하여 useQuery를 구현
  • React Query의 mutate + invalidateQueries 조합을 사용하여 데이터 변경에 따른 실시간 갱신을 구현
  • 회원가입/로그인 기능 추가 : 기초적인 수준이라도 로그인한 유저만 특정 기능을 수행하게 하는 등 권한을 제어
  • debounce 또는 throttle(Lodash) 함수를 사용하여 API 요청이나 이벤트 핸들링 성능을 개선




주제는 자유롭게 선정하여 진행하면 된다.

필수 요구사항에 추가 요구사항이 몇가지 더해진 프로젝트를 진행하기로 했다.

우리 조가 선택한 주제는 심화된 Todolist 라고 보면 될 거 같다.

할 일을 관리하고, 다른 사람에게 공유 가능한 프라이빗한 둘만의 Todolist 같은 개념이라 보면 될 것 같다.

카카오톡 로그인을 거치고, 메인페이지에서 일정을 등록한다.

등록된 일정은 나에게 공유를 통해 알림을 줄 수도 있고, 상대를 지정해 알림을 줄 수도 있다.

등록, 수정, 삭제 시 카카오톡 알림이 갈 수도 있게 하고,

마감기한 1시간 전, 30분 전 알림 혹은 달성률 알림이 발송되도록 하면 될 것 같다.

이 기능은 카카오톡 API를 활용하면 될 거 같다.

아무튼 업데이트가 되었을 때 실시간으로 알림이 갈 수 있도록 하는 기능을

카카오톡 API에서 지원하고 있는지 확실하지 않아서,

실시간 데이터 알림 처리를 가능하게 하기 위해

firebase cloud function을 사용해야 하는지 여부는 조금 더 확인이 필요할 것 같다.

사실은 할 일을 구글 캘린더 API 활용해서 관리하고 알림처리 되도록 하는 기능을 사용하려고 했는데,

튜터님께 조언을 구했더니 굳이 구글 캘린더를 쓸 필요가 없을 것 같고,

이 때까지 배운 Todolist 개념에 이메일 API + 파이어베이스 실시간 데이터처리를 추가해서 사용하면 되지 않을까

말씀을 주셨는데, 팀원들끼리 이야기를 나누다 보니 알림 처리를 이메일로 주는 것 보다는

카카오톡으로 알림을 주는게 조금 더 현실성이 있지 않나 하는 결론에 도달해서 그렇게 진행하게 되었다.



프로젝트 명은

자기 내가 부탁한 건 다했어?

신선한 제목 만큼 모두에게 신선함을 줄 수 있는 프로젝트가 되면 좋겠다.

타입스크립트와 리액트 쿼리, 리덕스 툴킷을 한 번 더 익히고 넘어갈 수 있는 좋은 기회라고 생각한다.

profile
병아리 개발준비생 🐥

0개의 댓글