Dony :)

FE로 성장 중 🌱

TIL 🧐

주절주절 😗

이번 주는 지난 주와 다르게 마지막 플젝이라 그런지 힘빠지는 주였다.
방학하기 전 주에 하기 싫은거 같은 느낌이랄까..?

GitHub OAuth 구현 방식

함께 하시는 백엔드 분이 로그인은 이번 프로젝트 때 처음이라 로그인 페이지에 집중하시느라 지난 주 동안 로그인에 집중하셨다.
처음 백엔드 분이 생각하신 방식은 프론트 단에서는 유저를 깃헙 로그인 페이지로 이동만 시켜주면 백엔드에서 모두 처리한 후 로그인이 됐을 시, 이슈리스트 페이지로 redirect 시키려고 계획 중이셨던 거 같다.
하지만 생각대로 잘 안되셨는지 이번 주에 로그인 방식을 변경하게 되었다. 최대한 백에서 로그인 관련 처리를 해야 안전하다고 생각하셔서 계획하신 것이나 이러다간 3주 내내 로그인만 하게 될거 같아 걱정이 되기 시작했었다.
그래서 위의 방식처럼 프론트에서 Authorization code 로 요청을 하면 백에서 Access token 을 전달해주는 방식으로 하는게 어떻겠냐고 제안을 드렸다. 원하시던 방식과는 좀 다르지만 이렇게 할 경우 백에서 처리해야할 일이 줄어들어 이슈 리스트까지는 구현을 하자던 최소 계획만큼 구현할 수 있을거 같았다.
긴 토론 끝에 해당 방식으로 바꾸어 로그인 페이지를 진행할 수 있었다.
그러나 또 다른 문제가 생겼다..🤦🏻‍♀️

앞의 방식으로 바꾸어 백에서 응답으로 header에 set-cookie를 담아 보내주면 프론트에서 쿠키의 유무를 판단하여 사용자가 로그인한 상태인지를 구분하려고 하였다.
그러나 왜인지.. header에 담아서는 오지만 cookie에는 저장이 되지 않았다.
withCredentials 옵션을 프론트와 백 둘 다 true로 하면 된다고 하여 설정하니 CORS 에러가 발생하였다..
프론트와 백의 port 번호가 다르면 cookie가 저장이 안된다는 CORS 정책이 있다고 한다..
사실 이런 이슈는 백엔드와 함께 이것저것 시도하며 함께 고치는게 맞는데.. 그게 잘 안된거 같아서 아쉽다..
결국 PR에 질문을 하여 리뷰어님께서 알려주신 방식으로도 시도해보았으나 여전히 해결되지 못했다..
결국 body에 Access token을 담아주면 localStorage에 저장하는 방식으로 구현을 해두었다..

아쉬워요 🙁

학습과 실무

이번 주는 사실 좀 힘들지만 느낀게 있는 한 주였다.
프로젝트를 하면 오픈 일정이 정해져있기 때문에 로그인 페이지를 너무 오래 붙잡고 있을 수 없었다.
우리가 정해둔 목표까지 구현하는게 실제 프로젝트 때 오픈 일정에 맞게 작업하는 것이기 때문에 학습의 목적이라면 로그인 페이지를 좀 더 파도 괜찮았겠지만 일정 관리도 해보는 연습을 해야해서 백엔드 분을 기다리다 독촉할 수 밖에 없었다..ㅠ
실무에서는 일정에 맞춰서 일단은 구현해야하기 때문에 코드가 맘에 안들거나 원하는 방식이 아니여도 넘어가야 하는 경우가 생긴다.
생각해보면 예전에 처음으로 제대로 된 페어프로그래밍을 해본 우체통 미션을 할 때 이것저것 시도해보고 싶은 맘에 결국 구현을 다 못하고 미션이 끝났던 기억이 있다.
class 이름, store와 view 분리 등 신경써서 코드를 짠 덕분에 클린 코드라는 칭찬을 들었지만 사실 실무였다면 무조건 완성에 목표를 두어야 한다.
로그인 페이지를 너무 오래끌었다는 생각과 그래도 예전에 비하면 일정에 맞추어 욕심 내지 않았다는 두가지 생각이 든다.

적극적이지 못한 소통

cookie 이슈가 생기면서 백엔드와 함께 이슈를 해결했어야 했는데, 그렇지 못해서 아쉬운거 같다.
서로 소통하며 백엔드 분께서 이거 수정해보세요 하면 우리가 수정한 뒤 확인하여 말씀드리고, 우리도 이런 문제는 아니냐 제시해보고 소통을 더 해볼 수 있는 어쩌면 기회였는데 우리는 이제 완성된 로그인을 적용하고, 백엔드 분은 밀린 CRUD를 구현하느라 바빠 서로 많이 소통을 못한거 같다..
처음부터 로그인 API가 기간에 나오지 않았을 때 바로 방식을 바꾸자고 요청했으면, 바꾼 방식이 나온 뒤에 함께 구현해보고 수정하는 시간을 가질 수 있었을거 같은데 뒤에 이슈 리스트 일정을 맞추느라 그럴 시간이 부족했던게 너무 아쉽다.
재촉이라 생각하지말고 소통이라 생각하고 좀 더 적극적으로 여쭤보고 요청해야할 거 같다. 어찌보면 당연히 요청해야 할 일인데 왜 적극적으로 말하지 못했나 아쉽다.

못하는 것에도 관심을 가지자

그리고 지난 주에 의견을 적극적으로 제시했던 것과 달리 OAuth와 cookie는 거의 햄디에게 의지해서 갔던 것 같다.
내가 잘 모르는 부분이기도 했으나 공부를 비집고 틈틈히 시간을 내어 했어야 했는데.. 햄디에게 질문을 많이 해서 너무 미안했다.
사실.. 관심이 없는 부분은 잘 공부를 못하는 성격이다. 근데 어떻게 관심 있는 부분만 일할 수 있을까.. 언젠가는 한번쯤 구현해야할 일들인데 좋아하는 공부만 하게 되는 습관을 좀 더 고쳐야겠다.

잘했어요 🙂

이번 주..도 아쉬운 점이 많지만 그래도 잘한 점은 어려운 컴포넌트를 내가 맡겠다고 한 것이다.
앞에 말했듯이 좋아하는 부분은 어려워보여도 해보고 싶은 욕심이 마구 생긴다.
form 태그 관련된 이벤트나 css는 생각보다 어려워서 내가 맡고 햄디에게 설명해주겠다고 한건데 사실 리액트랑 styled component로는 처음이라 나도 좀 고민한 부분이 많았다.
그래도 html, css로 했을 때랑 이런 점이 다르구나 비교하면서 공부할 수 있어서 좋은 경험이였다.
못하는 부분도 잘하면 좋지만.. 잘하는(?) 부분을 더 잘하게 하면 안되는가..??!!

왜 회고 쓸 때마다 늘 아쉬운 점만 한가득 쓰는걸까?
아쉬운 점이 있다는 건 발전하고 싶어한다는 좋은 의미기도 하지만 스스로 칭찬도 좀 더 해줬으면 좋겠다.
햄디에게 1일 1칭찬을 듣는 중인데 어디 메모라도 해놔야겠다ㅎ 내 자존감 지키미 햄디~~🐹🧡

참고