유데미 STARTERS 취업 부트캠프 2기 - 프론트엔드 8주차 학습 일지

 

 

프로젝트가 시작하면서 블로그 쓰는 것에 시간 할애를 많이 할 수 없어서 앞으로는 이전에 쓰던 것보다 요약해서 쓸 생각이다. (내용을 줄인댔지 짤을 줄인다는 말은 하지 않았습니다😁)

 

이번 주는 대망의 데모데이 1차가 있는 주간이기 때문에 Sprint 1 동안 계획해놨던 것들을 끝내야만 했다. 저번 주에는 프로젝트 시작하면서 팀원들과 맞춰볼 것들이 많았고, 부족한 점들이 많아 공부하는 시간에 투자를 많이 했다면, 이제는 본격적으로 작업에 집중해야 했다. 공부에 시간 투자를 많이 하는 것도 좋지만 당장 해야할 일들이 많기에 평소에 듣던 Shoppi를 일단 중단하게 되었다. 그래도 서버 통신하는 부분까지는 들어놔서 다행이었다. 모르는 부분이 나중에 생기면 따로 찾아서 보는 방향으로 일단 정하게 되었다.

 

 

 

내가 맡은 파트는 로그인/회원가입 파트, 사용자 프로필 설정 파트, 마이페이지 파트 이렇게 맡아서 작업했다.

로그인/회원가입 파트와 관련해서 많은 우여곡절을 겪었던 것 같다. 저번 주에 이어서 서버 쪽에 access token 보내서 Response로 message를 받는 것 까지 잘 되는 것을 확인했다. 이후에 서버 분께서 로그인/회원가입 로직에 대해서 설명을 해주셨는데... 나는

카카오 access token을 서버쪽에 보내면 → 서버 쪽에서 사용자의 email을 조회해서 DB에 정보가 있는지 없는지 확인을 한 뒤 → 있으면 로그인, 없으면 JWT가 발급 → 이후 회원가입에 필요한 추가 정보 입력

하는 것으로 이해했었다. 그래서 서버 쪽에서 아직 전달받은 JWT가 없어서, 마이페이지 쪽 UI 작업을 진행했었다.

 

마이페이지 UI 작업이 끝나갈 때 쯤, 서버 분께 다시 한 번 로직을 물어봤더니 회원가입을 하려면 회원정보+반려견정보+access token 모두 다 받아야 JWT가 발급이 된다고 하셨다. (너무 다른데...🫢) 생각했던 로직과 달라서 다시 한 번 로그인/회원가입 로직에 대해서 얘기를 나누게 되었고, 일단은 로그인/회원가입 버튼 누르면 Response로 message를 받은 뒤 message에 "LOGIN"이라고 뜨게되면 JWT와 refresh JWT가 발급받고 다음 화면으로 넘어가는 것까지만 확인해보았다.

 

프론트 쪽에서는 왜 다시 access token을 보내는지 이해가 되지 않았고, 나갔다 들어왔을 경우 로그인/회원가입 로직을 처음부터 다시 타야하는 점에 대해서 비효율적이라고 생각되었다. 그래서 정규 안드로이드 멘토링 시간에 질문을 해보니, 예시로 글램을 살펴보면서 해당 유저가 회원인지 아닌지 Response로 받아서 각 페이지 별로 회원가입 정보를 보내서 중간에 나갔다 들어와도 어떤 페이지에서 작성 중이었는지 보여줄 수 있도록 처리하는 방법에 대해서 권유를 받게 되었다. 이 부분에 대해서 서버 분께 말씀드리니, 거의 하루종일 붙잡으면서 다시 API 수정 작업을 하셨다.

 

하지만 새로 바뀐 API를 받아봤을 때, 프론트 단에서 어떻게 처리를 하는 것이 좋을지 감이 잡히지 않았다. 새로 API를 받았을 시점이 데모데이가 하루 남은 시점이라서 급하게 안드로이드 멘토님께 도움을 요청했다. 이번에는 로그인/회원가입 API를 담당하신 서버분도 같이 멘토링에 참여하셔서 모르는 부분, 헷갈리는 부분 등에 대해서 자세히 물어보는 시간을 갖게 되었다. 확실히 같이 멘토링에 참여하니까 궁금한 점들을 바로바로 물어볼 수 있었고, 소통의 오류도 줄어들게 된 것 같다.

 

최종적으로 로그인/회원가입 로직은

카카오 access token을 서버쪽에 보내고 → 서버 쪽에서 사용자의 email을 가지고 DB에 정보가 있는지 없는지 확인을 한 뒤 → 있으면 로그인, 없으면 회원가입 필요 메시지를 보내고 → 사용자가 회원가입 시에 작성한 내용들은 SharedPreference를 활용하여 기기에 저장한 뒤 → SharedPreference에 데이터가 있는지 없는지 여부에 따라 확인을 하고, 최종적으로 다 작성하면 email과 함께 서버에 보내면 → 서버 쪽에서 JWT와 refresh JWT를 발급

해주는 방향으로 결정되었다.

 

 

 

사용자 프로필 설정 파트의 경우, 이미 팀장님께서 UI를 그리주셨는데, Recyclerview 내부의 아이콘을 클릭하면 그 전의 fragment의 ImageView에 이미지(아이콘)을 띄우는 작업 처리는 하지 않으셔서 내가 맡아서 하게 되었다. Recyclerview의 adapter와 관련해서 많이 까먹어서 구글링을 해보았다. 검색해보니 대부분 adapter관련 설명을 하면서 ClickListener를 interface로 선언해 사용하는 방법에 대해서 많이 소개되어 있었다.

 

처음에 나도 위와 같은 방식으로 진행해서, SharedPreference를 통해서 값을 가져오는 방식을 선택했는데... 너무 코드의 가독성이 떨어지는 부분들이 많았다. 이 부분에 대해서 수정을 하고 싶은데 마땅이 좋은 방법이 떠오르지 않아 골머리를 앓고 있는 와중에, 팀장님께서 굳이 위와 같은 방식으로 하지 않고도 쉽게 구현할 수 있는 방법을 알려주셔서 코드량을 많이 줄일 수 있게 되었다. 생각보다 쉬운 방법인데 괜히 어렵게 돌아간 것 같아서, adapter 공부를 더 해야겠다는 생각과 함께 반성을 하게 되었다...🫠

 

 

 

마이페이지 파트의 경우, UI 작업이 대부분이여서 생각보다 오래 걸리지는 않았던 것 같다. 다만, 디자이너님께서 모든 화면을 그려주신 것이 아니다보니 화면 설계서를 바탕으로 UI를 그리게 되는데, 화면 설계서는 대강 그린 것들이라 디자인적으로 예쁘지 않아서 고민이 많았던 것 같다. 이 부분에 대해서 고민을 하다가 디자이너님께 조언을 듣는 것이 훨씬 빠를 것 같다고 생각되어서, 슬랙으로 도움을 요청하여 빠르게 해결할 수 있었다.

 

그리고 로그아웃, 회원탈퇴를 눌렀을 때 custom dialog로 알려주는 부분도 구현을 하게 되었는데, dialogFragment로 코드를 작성하고 build를 해보니 dialog 창이 너무 작아서 눌러야할 버튼들이 보이지 않는 이슈가 발생하게 되었다. 처음에는 xml 상에서 수정을 해보았지만, xml로 해결되는 문제가 아님을 알게 되었다. 구글링을 통해서 해결 방법을 찾아보니, 코드 상으로 dialog 창을 기기의 사이즈에 대해 비율로 지정을 해주는 함수를 작성해줘야 한다고 한다. dialog의 크기를 키우기 위해서 꽤나 많은 시간을 투자하긴 했지만, 결론적으로는 구현에 성공하게 되었다.

 

 

 

데모데이 아침까지 우리 팀은 지금까지 작업한 것들을 확인하면서 수정할 부분들을 수정하는 작업을 하였다. 정신없이 작업하다보니 아침 10시까지 데모데이 발표자료 준비를 해야한다는 것을 모르고, 점심시간에 부랴부랴 노션으로 자료 만들어서 제출하게 되었다. 데모데이 발표는 프론트 1명, 백엔드 1명이서 하는 것 같았다. 백엔드 발표자는 정해졌다고 해서, 프론트 발표자를 결정하기 위해서 이번에도 국룰인 사다리 타기를 했다. 사실 사다리타기 시작하기도 전에 느낌이 좋지 않았는데, 역시나... 내가 걸렸다...^^ STARTERS를 하면서 내 운은 똥이라는 것을 절실히 느끼는 것 같다...^^

99% 운으로 다 걸린다...

 

 

로그인/회원가입 로직이 바뀌면서 구현이 완전하지는 않았으나, 예전에 연동시켜놓은 API가 아직 남아있어서 일단 발표 때 보여주려고 했었다. 그러던 중 카카오 소셜로그인이 비정상적으로 작동하는 이슈를 발견하게 되었다. 다행히도 발표 순서가 3번째여서 시간은 좀 있었지만.. 해당 이슈를 그 시간 안에 수정할 자신이 없었고, 어디서 오류가 발생한지 파악도 되지도 않았다. 발표 전에 멘붕을 쎄게 먹어서 식은땀이 났다. 카카오 소셜로그인 이슈를 해결하려고 눈알을 빠르게 굴리다보니 발표 자료를 살펴보지도 못하고 발표를 하게 되었다... (홀리몰리😱)

발표 직전 내 모습

 

 

 

처음에는 긴장을 했지만 발표를 하다보니 긴장이 풀리게 되었고, 무사히 발표를 마칠 수 있었다. 추가 질문 3개 정도 받은 것 같은데 예상한 질문들이 나와서 나름 답변은 선빵한 것 같다. 사실 카카오톡 소셜로그인 파트가 내가 맡은 파트다보니... 이렇게 이슈를 발표 직전에 발견한 것에 대해서 팀원들에게 너무 미안했다. 이번 발표마저 말아먹으면 내가 분리수거도 안되는 쓰레기가 되는 것만 같아서.. 평소 같았으면 못했을 발표를 온 힘을 다해서 불태웠다.

 

이후에는 현업에서 일하시는 개발자 2분이 오셔서 한시간 동안 멘토링(?)을 진행해주셨고, 궁금한 점들에 대해서 답변해주시는 형식으로 진행되었다. 현업은 어떻게 돌아가는지 직접적으로 들을 수 있는 기회였어서 매우 유익했다! 이렇게 데모데이를 마치고나니 진이 빠져서 6시 땡하자마자 집으로 Dive 했다. 다음 Sprint 2에는 1 때보다 더 분발해야겠다!!🔥🔥🔥

 

 

 

+ 바쁘더라도 밥은 맛있는 것을 먹자가 내 신조인데... 밥을 안먹을 때도 많았고, 간단하게 편의점에서 때운 적이 많았던 것 같다. 반성하고 다음 주는 무슨 일이 있더라도 거르지 말고 맛있는거 먹어야지...!!

 

 

---

 

 

 

* 유데미 바로가기 : https://bit.ly/3SFlXDy 

* 유데미 STARTERS 취업 부트캠프 공식 블로그 보러가기 : https://blog.naver.com/udemy-wjtb 

 

 

본 후기는 유데미-웅진씽크빅 취업 부트캠프 2기 - 프론트엔드&백엔드 과정 학습 일지 리뷰로 작성되었습니다.