WIL: 8월 1주차 회고

🌱 회고.

 

벌써 실전 프로젝트 2주차를 달리고 있다. 시간 너무 빨라...!

이번 프로젝트에서는 새로운 스택을 픽했다. 타입스크립트, Recoil, react-query ···

아직 RTK와 Axios도 어려운데 괜찮을까 싶다가도 새로운 건 못참지.

 

타입스크립트는 이틀 공부했는데, deep하게 사용하지 않는 전제에서는 의외로 간단했고,

역시나 RTK와 Axios는 여전히 어려운 와중에, Recoil, react-query까지 더해진 상황😵

프로젝트를 진행하면서, 끝난 후에도 상태관리와 서버와의 데이터 통신 부분을 공부해야겠다.

 

미니 프로젝트, 클론 코딩 프로젝트에 이어 또다시 메인 페이지를 맡았다.

( UX/UI 디자인 전공이라 그런지 메인페이지 욕심 좀 있습니다..?! )

클론 때 구현 못한 무한스크롤.. 이번엔 꼭 성공하자...

아직 서버쪽 무한스크롤 구현이 안된 관계로 Mock 서버를 이용해야 했는데,

MSW(Mock Service Worker)라는 좋은 도구를 알게 되었다.

그리고는 어제 하루종일 삽질을 엄청나게 해댔다. 결국 만드는 것은 성공... 했지만 제대로 활용하지는 못했다.

 

끝으로, 이번 프로젝트에서의 나의 최종 목표는

최고의 사용감. 바로 UX다 👌🏻

 

 

 

☁️ 지난주 목표 체크

 

☑️ 팀 프로젝트 이번주 할 일 마치기

카카오 지도 API를 붙히는 부분은 조금 어려웠지만 성공했다. 그런데 클릭이벤트를 넣는 순간 에러가 너무 많이 난 상황... 아직 수정하지 못했다.

 

 

 

✔️ 새롭게 알게 된 점

 

1. MSW(Mock Service Worker)를 이용한 모킹 API를 구축

카카오엔터프라이즈에 작성된 글을 보다가 MSW를 알게되었다.

낯선 개념이기 때문에 일단 작동하는지 테스트부터 했는데, 여기서부터 막혔다.

localhost환경에서 실행되어야하는데, 계속 setupServer()로 서버를 실행했던 것..

공식문서를 확인해보니 브라우저에서의 mocking은 setupWorker()를 이용해야한다는 것이다.

*공식문서를 잘 확인하자.

 

공식문서 : 

https://mswjs.io/docs/api/setup-server

setupServer() - Api

 

2. 타입스크립트 + 네이버 Map API

지난주에 React + Express로 만드는 로그인 기능구현은 세팅밖에 못했는데,

비슷한 stack인 MERN stack(MongoDB+Express+React+Node.js)과 네이버 Map API를 활용한 좋은 강의가 있어서 따라서 만들어 보았다.

당장 새로운 기술을 익혀 프로젝트에 들어가야 하기 때문에 많은 도움이 될 것 같았는데, 역시나 활용하기 좋은 팁이 있었다.

https://github.com/soolovepat/MERN-stack-map-project

GitHub - soolovepat/MERN-stack-map-project: MERN stack map project_인프런 강의 따라하기

 

 

 

☁️ 이번주 목표

 

🟦 팀 프로젝트 이번주 할 일 마치기