220904~220910 6주차 혼자서 프로젝트 완료 🥹

✅ [식물일기] 프로젝트 완료. 게시글 CRUD, 댓글 CRUD, 로그인(JWT), 회원가입, 마이페이지 기능 구현
✅ MUI 활용.
✅ [오설록] 클론 코딩 프로젝트 시작. PostCss Module 활용. 메인 페이지 완료.
✏️ axios intercepter 공부중.. https://axios-http.com/kr/docs/interceptors
✏️ react 테스트 코드 작성 인강 시작
✏️ 반응형 사이트 만드는 법

 

이번 주는 정말 정신이 없었다. 식물일기 프로젝트의 프론트 부분을 혼자 맡아서 했기 때문이다.

다른 조들은 2-3명의 프론트 담당자가 있었지만, 우리 조는 프론트 팀원이 갑자기 입원을 하는 바람에 나 혼자 프론트 전반을 맡게 되었다.

근데 정말 놀랍게도! 나 혼자서 다 할 수 있었다! 🥹 대견한 나..

 

사실 이 것은 MUI 를 활용해 css 에 들이는 시간을 많이 단축해서 가능했던 일이다. MUI 를 5주 차 때 써보고 싶었지만,

새로운 것을 또 익혀야 한다는 것이 부담스러워서 미뤄뒀었다가 이번에 시도한 것인데 잘한 선택이었다.

 

5주차에 함께 진행했던 팀원들의 코드를 분석했던 것이 큰 도움이 됐다.

5주 차에 나는 메인과 검색 등 작은 부분을 맡았었는데, 남는 시간에 다른 팀원들의 코드를 보며 공부했기 때문에 이번 주차에 혼자서 다 할 수 있었던 것 같다.

 

혼자서 프로젝트 세팅부터 백엔드와 합치는 것까지 했다. 정말 많이 배웠다.

게시글, 댓글 crud 는 사실 2일도 걸리지 않았다. 리덕스와 axios 를 사용하는 것이 점점 익숙해져서 속도가 빨라진 상태였고, 화면 그리는 것도 MUI 덕에 쉽게 했다.

 

내가 가장 시간을 많이 들인 부분은 JWT 부분이었다.

저번주 토, 일, 월 동안 계속 이 부분을 공부했다. 세션, 쿠키, 토큰 개념부터 그 값을 어떻게 가져오고 그 값으로 로그인 유지를 어떤 방식으로 해야 하는지. 토큰을 헤더에서 어떻게 받아야 하고 또, 다시 보내줘야 하는지 등등.

개념 자체를 이해하는데 많은 시간이 걸렸지만, 코드를 완성시키고 보니 생각보다 간단했다.

 

신기한 경험도 했다.

분명 처음 봤을 때는 이해하지 못한 게시글이 있었는데, 3일 뒤에 다시 보니 이해가 술술 까지는 아니지만 어느정도 되더라.

이해 안되는 글들을 수십 개 보다 보면, 갑자기 이해가 되는 글들을 만나게 된다. 내가 이해가 되기 시작한 건지, 그 글이 설명을 잘해주는 것인지 모르겠지만, 모르는 개념을 파고들다 보면 그런 순간이 온다는 것을 알게 됐다. 즐거운 경험이었다.

 

프로젝트가 완료하고 같은 조에 있던 현직자였던 팀원이 나보고 정말 잘했다고 칭잔도 해주었다. 그리고 프로젝트 발표할 때도 매니저님이 잘했다고 칭잔 해주었다. ㅠㅠ 감격.. 3일 동안 밖에 안 나가고 열심히 한 보람이 있었다.

(물론 팀원들이 많이 응원해주고 내가 요청하는 것들을 바로 해결해주었기에 가능했다 허허)

나는 가능한 코드를 깔끔하게 짜려고 노력했고 모든 파일이 제 역할에 맞는 코드만 담고 있을 수 있도록 했다.

기능 구현이 전부가 아니라 다른 사람이 볼 때 한눈에 구조를 알 수 있도록 하는 것이 중요하다고 생각했기 때문이다.

 

아무튼 불태웠던 일주일이었다. 재밌었다.

 

오설록 클론 코딩 프로젝트가 시작됐다.

이번에는 styled component 가 아니라 postCSS 쓰기로 했다. 전자가 많이 익숙해진 상태였고 조금 더 가독성 좋은 코드를 위해 postCSS 를 같이 사용해보기로 했다.

또한, 라이브러리 사용을 최소한으로 하고 순수 JS 로 반응형 사이트를 만들고 있는데, 손이 정말 많이 간다..

css 개념과 dom event 개념이 부족하다는 것을 느꼈다.

 

이번 주차의 목표는 반응형 웹사이트 만드는 법! 을 익히는 것이다. 그리고 시간이 되면 test 코드 작성법도 공부하고 싶다.