TIL - 2022.07.29 금요일

오늘 배운 것

1. 입문용 CSS 강의 촬영 완료

강의 촬영을 전부 마치고 수업 자료 제작에 들어갔다. 강의용 자료와 레퍼런스 코드를 제작하는 단계, 실제 촬영을 진행하는 단계, 수업과 함께 실제 수강생들이 보게 될 수업 자료를 제작하는 단계에서 각각 고려해야 할 것이 너무도 달라 내 마인드셋을 변경하는데에 시간이 좀 걸리는 중.

 

2. Apollo-client의 fromPromise와 flatMap

회사 개발팀 쪽에서 로그인 인증 관련하여 치명적인 오류가 발생했다는 소식을 들었다. 자세한 사항은 보안상 설명할 수 없지만, 해당 이슈에 대한 리포트를 들으며 Apollo-client에서 fromPromise와 flatMap이라는 메서드를 제공한다는 사실을 알게 되었다.

그리고 이 부분에 대해 공부를 충분히 한 뒤 이해한 내용을 TIL에 적고 싶었는데, 아직 이해 못했다. (알쏭달쏭 코딩세상!!) 공부하다가 머리에서 김이 난 부분은 크게 세 군데였다.

• 여러번의 토큰 재요청이 중첩되어 프로미스 체인으로 인한 에러가 발생할 때, Apollo-client는 해당 구문의 출력값을 zen-observable이라는 라이브러리에서 제공하는 Observable 객체로 바꿔준다. (이해가 안되는 부분: 그래서 Observable이 대체 뭔데?)
• fromPromise는 Observable 객체를 Promise로 바꾸어 뱉어준다.
• 그 다음에 flatMap을 이용하여 forward를 실행할 수 있도록 만들어준다.

더 심각하게 머리의 스팀을 유발한 부분도 있다.

동일한 로그인 인증 코드를 Context-API를 이용하여 전역관리하는 프로젝트와, Recoil을 이용하여 전역관리하는 프로젝트 두 개에서 실행해봤는데,  Context-API를 이용할 때에는 fromPromise를 쓰지 않아도 로그인 인증&인가가 무사히 진행되었다(!). 그런데 Recoil을 사용한 경우에는 에러가 발생했다. fromPromise와 flatMap을 이용해야지만 문제 없이 통신이 작동했다.

 

마침 개인 프로젝트에서 로그인, 회원가입을 구현해야하는 단계이기에, 궁금한 부분들을 다 실험해보려고 한다.

실제로 브라우저에 어떻게 찍히는지 확인하지 않고 머리만 굴려서는 애꿎은 내 머리만 찐만두될 것 같음.

 

작업하면서 참고하려고 찾아 놓은 블로그를 함께 링크해둔다.

https://chanyeong.com/blog/post/47

Apollo Client 토큰 재발급 :: chanyeong

 

다음에 할 것

• 패스트캠퍼스 The Red 마크업 강의 마저 듣기
• 개인 프로젝트에 스토리북 적용해보기
• 개인 프로젝트 로그인&회원가입 페이지 UI와 로그인 인증&인가 구현하기