이번 WIL의 키워드 :
첫 협업을 진행하며 느낀 아쉬운 점, 뿌듯한 점
짧지만 전혀 짧지 않았던 1주일 간 많은 생각과 경험을 준 미니프로젝트 주간이였다.
협업을 진행하며 느낀 아쉬운 점은..
처음 기획부터 중간 중간에 많은 대화를 나눴다고 생각했지만
정작 개발 과정에 필요한 의사소통을 제대로 하지 못 했던 부분들이 아쉬웠다.
우선 우리 팀에서 백엔드 분들은 많은 기능들을 준비해주셨지만
프론트에서 제대로 기능 구현이 되지 못해 백엔드의 많은 기능들이 사용되지 못한 점
그리고 모든 뷰와 기능들이 동작이 되고 통신을 연결하려고 하다보니
뒤늦게 통신 오류들을 잡아가는 부분에서 시간을 많이 소비해서 아쉬웠다.
프론트 끼리도 대화가 없이 각자의 기능에만 집중하고 있어
서로 어떻게 진행되가는지를 파악할 수 가 없었다.
협업을 진행하며 느낀 뿌듯한 점은..
협업을 통해 모두가 뿌듯함을 느끼면 좋았겠지만,
내가 백엔드 분들에게 뿌듯한 경험을 주었는지에 대해선 잘 모르겠다.
우선 나라는 개인이 많은 부분을 배울 수 있었다.
비록 제대로 된 의사소통을 하진 못 했지만 가벼운 스몰 토크를 통해서 많이 친해질 수 있었고
api가 어떻게 요청을 받고 db에 저장되는 과정에 대해서 디버깅을 찍어가면서 보여주셔서
조금이나마 백엔드 코드가 어떻게 동작하는지 눈으로 확인할 수 있었다.
그리고 백엔드셨던 팀장님이 깃 브랜치 전략을 도입하자고 말씀해주셨다.
각자의 기능 브랜치에서 commit, push 한 내용들을 pr 하고 코드리뷰까지 하는 모습들을
백엔드 repo 에서 간접적으로 나마 보고 배울 수 있었다.
프론트 팀은.. 리뷰까지는 없었고 기능별로 브랜치를 나누고 각 브랜치에서 dev 브랜치로 pr
그리고 최종 main 으로 merge 하는 과정만 밟아봤다.
지금부터는 주절주절 긴 소감글이 될 예정..
지금까지 학습했던 내용들을 바탕으로 백엔드와 처음으로 협업을 하는 주간이였는데,
서버와의 통신이 이렇게 어려운 것이며 서로 같은 한국인이면서 다른 언어로 말하는 느낌이였다.
이번 미니프로젝트에서 기획한 주제로는 개발을 공부하는 사람들을 대상으로 하는 사이트를 기획했다.
TIL, WIL 등 각자 학습한 공부 내용들을 카테고리 별로 나누고 기록하는 글들을 게시하며
서로 공감을 하며 성장할 수 있었으면 한다는 생각에서 시작했다.
위와 같은 주제를 기획하면서 지금까지 해왔던 CRUD가 아닌 새로운 부분을 해보고 싶다는 생각을 했다.
컴퓨터를 처음 사용하고 인터넷이라는 것을 사용하기 시작한지 22년간 웹사이트들을 이용하면서
당연하게 사용해왔던 로그인 회원가입이 이렇게 어려울 것 이라는 생각을 하지 못한 채..
둘 뿐인 프론트 팀원에게 로그인 회원가입을 하고 싶다고 말씀을 드리고 담당하게 됐다.
처음에 내가 생각했던 로그인 회원가입을 간단했다.
회원가입을 하기 위해 입력한 아이디와, 비밀번호가 웹사이트를 통해 서버로 저장이 되고
로그인 할 때 내가 저장했던 아이디와 비밀번호가 같으면 서버에서 로그인을 허락해준다.
하지만 그 사이에 권한이라는 친구가 깜짝 방문한다.
로그인을 한 유저만 이용할 수 있어야 하고, 내가 작성한 글과 댓글은 나만 수정 삭제가 가능해야 한다.
그 권한을 사용하기 위해서 사용했던게 JWT 토큰이였고 이 친구는 Access, Refresh-Token을 발행한다.
그래서 로그인을 하면 백엔드에서 토큰을 발행해주고 그걸 프론트에서 잘 받아서 보관해야 한다.
내가 어렵게 느꼈던 부분은 토큰을 어떻게 담고, 어디에 저장을 해야하며,
어디로 보내야 하는지가 어렵게 느껴졌다.
백엔드에서 Response Header 토큰을 담아서 보내주면
프론트는 토큰을 local, session, cookie 셋 중에 골라서 저장을 한다.
우선 보내준 토큰을 저장하는 과정에서 어떻게 저장을 하라는거지? 에서 처음으로 막히고,
토큰을 저장하는 3곳이 어디에 있다는 건지 이해를 할 수 없었다.
우리가 부라우저(크롬, 엣지 등)에 내부 저장 공간이 있다.
F12로 개발자 도구(?)로 들어가면 Application 탭에 Storage 라는 공간이 있더라 ㅎㅎ
크롬 브라우저를 08-09년에 처음 사용해보고 가끔 우측 클릭으로 복사 저장이 안되는 이미지를
저장해보려고 element로 들어가본 걸 제외한다면.. 지금까지 몰랐던 공간이다.
어찌저찌 저장까지는 성공했지만 이젠 토큰이라는 친구를 Header 라는 곳에 잘 담아서 보내줘야 한다.
자.. 저장하는 공간 존재에 대해서도 처음 알았는데 갑자기 Header 를?
그렇게 검색하고 얄팍하게 얻은 지식으론 http의 구조 자체가 { HEADER, BODY, SSL, TCP ,IP }
요렇게 나뉘고 우리는 header 또는 body 에 필요한 내용들을 담아 통신을 한다고 한다.
와~ 3~4일을 머리가 아프게 만들었던 친구였는데 적다보니 얼마 안되는 내용들인 것 같네..
그래도 어제보다 하나 더 알게 됐고 사용할 수 있게 됐으니 나름 발전했다고 할 수 있을 것 같다. 끝!
( 더 적고 싶은 글이 많았지만.. 노트에 적혀있는 글이 뭔지를 알아 볼 수가 없네 🥲 )
