6주차 간략 후기

클론 코딩 (FE, BE 두번째 협업) 마무리

빠르게 결론부터 이야기 하자면
저번주 미니 프로젝트 (FE, BE 첫 협업) 에서 햇던 것과 크게 다르게 한 것이 없다.
(조금 다른 점이라면 미니프로젝트에선 게시글 CRUD를 했고 이번엔 JWT 로그인을 했다는 점?)

로그인이라도 해봐서 살짝은 만족스럽긴 한데 일주일이라는 시간 속에서 기능을 확인한게 로그인 뿐이라서 아쉽다.

원래는 이것 저것 해볼려고 했는데 FE에서 게시글 CRUD 도 버거워하셔서 같이 BE 하시는 분이 우리끼리 기능을 짜도 확인이 힘들 것 같아서 그냥 개별로 공부 하는게 좋을 것 같다고 하셔서 나도 그렇게 하자고 했다. (이것 저것 해봐야지 라고 생각하다가 갑자기 맥이 빠져서 그런가 다 귀찮아졌다 .. 🙄 근데 사실 혼자서도 할려면 할 수 있었다. 그냥 안해놓고 변명을 하고 있다.)

이번 주차를 진행하며 내가 가장 신경 쓴 부분/기술에 대한 정리

클론 코딩을 진행할 때는 무조건 로그인을 해봐야 겠다 라고 저번주에 생각을 했었다. 그리고 JWT는 정말 많이 쓴다고 알고 있었기 때문에 JWT에 대해서는 어느정도 공부를 해서 갔다. (어떤 자료를 볼지 ? 어떤 코드를 참고 할지 ? 등등)

나름 준비를 잘 했다고 생각하고 코드를 짰고 FE에서 잘못한거지 내 문제는 없어 라고 생각한 부분들이 많이 있었는데 막상 까보니 내가 부족한 부분이 많았다. 그리고 아직도 이런 부분들에 대해서는 FE분들에게 죄송하다. 크게 고집을 부린건 아니었지만 FE에서 제대로 안준게 아닌가요 ? 라는 식으로 이야기를 주도했던 것 같다. 다시 한번 죄송합니다. 이번 경험으로 다시 한번 겸손해야 하고 절대적인 한쪽의 문제는 없다는 것을 다시 한번 배웠다. (JWT 와 CORS를 같이 사용할때 주의할점들에 대해서는 내가 많이 부족했다.)

내가 잘못한 부분들에 대해서는 조금 정리를 해보려고 한다.
(JWT 와 CORS 에 관한 기본적인 자료는 인터넷에 정말 많기 때문에 내가 막히고 헤맸던 부분들에 대해서만 조금 정리를 해보겠다.)

1. 서버에서 JWT를 헤더에 추가하여 클라이언트로 보내줬지만 FE에서 해당 헤더를 읽지 못하는 문제 (null 값으로 반환됨) [개발자도구 - 네트워크 Tab 에서는 헤더를 확인할 수 있음]

   • CORS의 경우 기본적으로 화면에서 response header 값을 읽지 못한다고 한다. (JavaScript 코드에서 읽을 수 없음)
     addCorsMappings에서 .exposedHeaders("Authorization") 을 추가하면 화면에서 지정된 header 값("Authorization")을 읽을 수 있게 됨

2. Spring에 CORS 설정을 했지만 CORS 설정에서 자꾸 거절되는 문제

   • Spring Security를 사용하고 있는 경우 Spring에서 CORS 설정을 해주더라도 Spring Security에서 다시 한번 설정을 해줘야한다.

3. JWT를 사용하여 SecurityContextHolder에 유저정보를 분명 저장했는데 @AuthorizationPrincipal UserDetails userDetails 을 Controller 메서드의 매개변수로 사용할 경우 유저 정보를 제대로 가져오지 못하는 문제

   • SecurityContextHolder에 저장한 유저정보 와 @AuthorizationPrincipal UserDetails userDetails 는 다른 객체 이므로 @AuthorizationPrincipal UserDetail userDetail 를 통해서 유저정보를 가져올 수 없다.
     SecurityContextHolder.getContext().getAuthentication() 메서드를 사용해서 유저정보를 가져옴.

실전 프로젝트 시작!

항해99를 시작하려고 마음 먹은 이유기도 하고 항해99에서 제일 큰 메인 프로젝트이다. 처음에는 어떻게 팀이 되든 별 생각이 없었는데 미니 프로젝트에서부터 클론코딩 까지 FE 와 BE 의 협업을 계속 해오면서 팀의 구성이 정말 중요하단 것을 절실하게 깨달았다.
(그래서 약 2주간 매일 매일 하늘에 기도를 드렸다. "제발 좋은 팀원 만나게 해주세요 🙏🙏🙏" )

하늘에 내 기도가 통했는지 좋은 팀원들을 만나게 된 것 같아서 엄청 기쁘다 !
(실전프로젝트때는 디자이너분들도 2분 정도 참여하시는데 , 이번에 배정된 우리 조의 디자이너 분들도 정말 열심히 참여해주셔서 우리 팀 자체가 의기투합이 잘되고 있다.)

새벽까지 기획 아이디어를 해도 다들 별말없이 잘 따라와주시고 의견도 잘 이야기 해주시고 연락도 빠르게 잘 되서 프로젝트 진행은 아주 부드럽게 잘 되고 있다. (사실 처음에 기획을 한 아이디어가 관련 데이터를 모으는데 문제가 많아서 5시간 가까이 기획한거를 접기로 하고 새로운 아이디어를 찾자고 했었는데 이때는 정말 아찔했다. 새로운 아이디어 찾는다고 다시 아이디어 회의를 1시간 넘게 하다가 결국엔 원래 아이디어를 다시 해보기로 했다. 다른사람이 보기엔 사소해보여도 그 당시의 우리 조원들에게는 정말 큰 사건이었는데 다행히도 이때 이후로 아직까지는 별다른 큰 사건은 없다. 우리 조가 조금 험난하게 진행되고 있다고 생각했는데 지금까지 진행된 상황과 주변 조들의 이야기를 들어보면 우리 조 정도면 진행이 매우 매우 잘되고 있는 축에 속했다.😂)

그리고 기획으로 금, 토 를 다 보내다 보니까 기획이 얼마나 힘든 것인지도 새삼 깨달았다... (기획보단 코딩 하는게 훨씬 더 재밌다)

조원 다 같이 머리 싸매가며 기획을 하니 이 프로젝트의 방향성 과 목적성이 무엇이고 어떻게 진행을 해야하는지가 잘 공유되는 것 같아서 지금 하는 프로젝트를 잘 마무리 지을 수 있을 것 같은 느낌이 든다. (사실 아직 앞으로 헤쳐나가야 할 일들이 너무 너무 너무나도 많이 있지만 일단은 우리 조원들을 믿고 진행하다보면 잘될것이라고 생각하기로 했다.)