2주 프로젝트 - Sprint2~3

Project Implementation

11/16

• 백엔드와 프론트엔드간 커뮤케이션이 원활해서 좋다. 지난 주, 회의와 코드리뷰시간이 정규시간의 반절이상을 잡아먹어서 개인 코딩은 본의아니게 야근을 하는 웃픈 상황이 많았다. 개인적으로는 그래도 다양한 에러핸들링에 대해 팀원들과 공유할 수 있는 시간이 많아서 좋았다.

• 서버가 꺼졌는데, 클라이언트가 서버와 상호작용하는 황당한 일이 벌어져서 크게 당황했다. ㅋㅋㅋㅋ 분명 pm2도 꺼져있는데 어째서 상호작용이 된걸까? 재부팅하기 전에 pm2도 껐다 켜보면서 수시로 확인해봤지만 알 수 없는 문제였다. 결국 인스턴스를 재부팅하고서야 해결되었다. 해킹당한거 아니냐며 엄청 조마조마했는데 큰 문제는 아니어서 다행이었다.

• 전체적으로 오늘은 걱정했던 인증 및 CORS 부분 등에 대한 에러가 무난하게 넘어가서 기뻤다. Sprint2에서 3으로 넘어갈 수는 있을지 걱정되어 프로젝트 규모를 축소해야하지 않나 큰 고민이 있었는데 많은 부분이 조금씩 해결되어서 속이 시원했다.

11/17

• 잘 이해하고 있다고 생각했던 setState에서 많이 당황했다. 비동기에 대한 공부가 더 필요한 것을 느꼈다.

• S3 CLI를 깔아두고 멀티 파일에 대한 업데이트를 진행하지 못해서 애물단지였는데 오늘 커맨드를 찾을 수 있었다. 아직 시도해보지 못했는데 배포할 때 꼭 써봐야겠다. 커맨드-공식문서

• 벌써 첫 프로젝트가 하루 남았다. 마무리까지 힘내야지!

11/18

• 막바지 스퍼트로 구현하지 못했던 슬라이드 CSS를 메인페이지에 적용해서 성공했다. 다만 반응형웹을 적용했을 때, nav 컴포넌트가 영향을 받아서 같이 늘어나는 현상을 발견했다. 숙제로 남았다.

  • window.onload 는 compentDidmount로 해결하기 :: 참고사이트

• 적용해보고 싶던 CSS 가 있어서 적용했는데 성공했다. j쿼리를 사용하는 부분이었는데 react에서 적용하는 법을 배웠다.

  • SVG를 적용하는 법도 배웠다.

• document.location 으로 이동 시, 토큰을 잃어버리는 것을 발견했다. 토큰은 브라우저내에 사라있지만, 로그인이 해제된다. react 자체에서 이동할 때는 상관없는데 해당 이동은 무슨 차이인 건지 알아봐야겠다.

  • 차이는 아직 알 수 없지만, 해결법은 '중첩 라우터'인 거 같다. 시간이 늦어서 리팩토링 할 수가 없어서 일단 추후 해봐야겠다. 공식문서

• 전역으로 token 설정을 했는데 하단 컴포넌트까지 header가 전달되지 않는 현상은 의아했다. 인터셉트도 시도해봤지만 성공하지 않아서 결국 수동으로 짤라서 보내줬다. 파이널 프로젝트에서 axios에 대한 별도 config 를 만들어서 시도해볼 예정이다.

• S3 CLI를 써봤는데 정말 편했다 ㅠㅠ aws s3 sync . s3://버켓명

11/19

• 중첩라우터 문제라고 생각했었던 문제는 바로 samesite 이슈였다. 초기 가장 기본이 되는 기능 구현시에 해결했다고 생각하고 넘어갔었는데 마지막에 터졌다! 빌드할 때마다 같이 체크해봤어야하는데...ㅠㅠ 이미 완성된 상태에서 터져서.. 결국 새로고침 시 분실되는 부분은 클라이언트가 페이지마다 쿠키 세팅을 추가하는 것으로 해결해두었다 ㅠㅠ.. 쿠키수정/삭제/얻기 참조

• SVG 색상 시도했다. 확실히 아이콘이 들어가서 더 UI가 돋보인다.

• input focus 시도로 인해 gif 촬영을 다시해야한다.ㅠ..ㅠ.ㅋ...

Project Finishing

• 2주라는 시간이 엄청 빠르게 지나갔다. 팀원들과 함께 발표자료 재점검을 진행한 후, 첫 프로젝트를 마무리했다. 첫 시도에 배포까지 했으니 이번 첫 프로젝트는 만족한다.

• 영상 녹화에서 7분 안에 표현해야하는 부분이 처음이라 2시간 이상 넘게 진행한 것 같다. 그래도 마지막에 발표진행을 성공적으로 마무리해서 굉장히 뿌듯했다.