간단한 회고
나의 역할
로그인 및 회원가입 기능 구현
카카오맵 API 사용하여 게시물 위치에 표치
실종 & 목격 게시물 CRUD
실시간 알림 기능을 위한 단방향 통신 SSE 기능 구현
유저 120명을 받고 피드백 20건 반영
성능 최적화 작업을 진행하여 Lighthouse 점수를 26.36% 향상
스피너 제작
framer-motion 활용한 알림창 제작 및 활용
잘했던 부분
- ThemeProvider로 공통 스타일 속성 관리
- 처음 사용해 보는 라이브러리를 빠르게 배우고 적용시킨점
- 문제해결을 위해 끊임없이 붙잡고 해결한점
못했던 부분
- 클린코드를 지향하지 못했던 것
- 불필요한 리렌더링이 너무 많은 것
- 라이브러리에 대한 공부하지 않고 코드 복붙한점
기술적 선택
framer-motion
1. 보다 더 나은 사용자경험을 주기위해 alert가 아닌 framer-motion 모달 제작을 위해 채택
event-source-polyfill
1. Event-source를 지원하지 않는 브라우저에서도 SSE 연결이 가능하게 하기 위해 채택
crypto.js
1. 현재 유저위치를 암호화하여 로컬스토리지에 저장하기 위해 사용
트러블슈팅
- SSE 라이브러리
-> useEffect를 사용해 연결이 끊기면 다시 연결하는 로직을 연결을 했고
heartbeatTimeout , withCredentials를
사용하여 SSE 연결을 해서 해결했다 - 현재 위치를 불러올 때마다 geolocation을 호출해 로딩이 길어지는 문제
로컬 스토리지에 저장 후 해결 → 유저 위치를 암호화하여 로컬 스토리지에 저장 후 사용해, 로딩 시간을 3s에서 0.2s로 속도를 개선
마무리
항해99 실전프로젝트가 끝이 났다.
많이 힘들기도 힘들었지만 진짜 열심히 해서 후회는 없다 눈뜨자마자 눈감을때 까지 프로젝트 끝날때 까지
기획부터 배포 UT 까지 받으면 정말 많은것들을 배운거 같아서 만족한다.
앞으로 남은 지원주차까지 최선을 다하고 항해가 끝나더라도 항해에서 배운것들을 토대로
취업하기 전까지 열심히 공부할 것이다..
'항해99' 카테고리의 다른 글
"구해줘 펫츠! 카카오맵에 현재위치를 사용할떄 로딩이 오래걸리는 문제" (0) | 2023.04.29 |
---|---|
구해줘! 펫츠 유저 피드백 (0) | 2023.04.24 |
항해99 1주차 풀스택미니 프로젝트 회고 (0) | 2023.01.18 |
항해99 웹개발 종합반 토이프로젝트 (0) | 2023.01.06 |
항해99 웹개발 종합반 4W 🧑🏻💻 (0) | 2023.01.04 |