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

 

 

저번 주에 이어서 나는 손흔들기 기능을 이어서 작업했다. 손흔들기 기능을 맡으신 서버분께서 이번주 화요일까지 API를 주신다고 하셨는데, 몸이 아프셨음에도 불구하고 감사하게도 너무 늦지 않게 수요일 쯤에 API를 완성해주셨다. 사실 손흔들기 기능이 우선순위 2순위로 채팅 기능에 비해서 우선순위가 높은 편은 아니라서 이번 스프린트에 손흔들기 기능을 완성하지 않더라도 크게 문제가 없었는데, API 작업도 꽤나 빨랐고 나도 이번 주 내에 잘하면 끝낼 수 있을 것 같다는 생각이 들었다.

놉!

 

 

 

이번 주 동안 손흔들기 기능을 붙잡으면서 카카오맵 API를 연결한 후에 작업한 내용들을 나열해보자면...

• 위치 관련 권한 설정하기 (기존 구버전 권한 관련 코드 → API 30 이상 대응해서 위치 권한관련 로직 수정)
• GPS 관련 권한 설정하기 (GPS가 꺼져있을 경우 자동으로 켜주는 기능 설정, Fragment 생명주기 중 onResume()에서 처리)
• 현재 위치 및 상대방의 위치를 나타내는 마커 커스텀하기
• 사용자의 실기기 기준으로 현재 위치(위도, 경도) 받아오기
• 받아온 현재 위치에 자신의 위치를 나타내는 마커 표시하기
• 현재 자신의 위치 서버에 보내는 API 연동
•  다른 곳으로 포커스가 이동했을 때, 현재 위치로 포커스가 잡히도록 돌아오는 기능 분리하기
• 내 주변 탐색 기능을 껐을 때 상대방과 통신이 끊기도록 처리 (Fragment 생명주기 중 onStop()에서 처리)
• 현재 위치를 중심으로 3km 반경 그리기
• 내 위치 기준 3km 이내의 반경에 위치하는 상대방의 위치에 해당하는 마커 세팅
• 내 위치 기준 3km 이내의 반경에 위치하는 상대방의 위치 가져오는 API 연동
• 상대방 마커를 클릭했을 때, 손흔들기 말풍선 나오도록 세팅
• 손흔들기 말풍선을 클릭했을 때, 푸쉬 전송할 수 있도록 세팅 (아직 푸쉬 기능이 구현되지 않아 일단 Toast로 대체)
• 상대방의 위치 15초마다 갱신되도록, 반경은 현위치 기준으로 0.5초마다 갱신되도록 Handler 세팅

 

 

 

손흔들기 기능을 구현하기 전에, 아무래도 카카오맵 공식 문서가 Java 기반으로 적혀있기도 했고, 구글지도나 네이버지도에 비해서 자료가 현저히 적어서 잘 해낼 수 있을지에 대해 걱정이 컸었는데, 오히려 그 부분들 보다도 권한 관련 로직을 생각하는 것이 골치가 아팠다. 특히나 Fragment의 생명주기를 고려하지 않고 코드를 작성하다보니, GPS가 꺼져있을 때 자동으로 켜주는 기능(LocationRequest)이 기존 위치 권한 체킹하는 것과 겹치는 바람에 dialog들이 제대로 작동하지 않는 이슈가 있었다. 뿐만아니라 LocationRequest 같은 경우에는 자료도 많지 않았고, 엎친데 겹친 격으로 API 대응으로 2022년 10월달에 따끈따끈하게(?) 업데이트가 되면서 deprecated되지 않은 코드를 찾기가 쉽지 않았다. 다행히도 onResume()에서 코드를 실행시키는 방법으로 이슈를 하긴 했다. 이 부분에 대해서는 따로 TroubleShooting을 작성해서 팀원들에게 공유하였다.

 

(사실 이 기능을 추가하지 않고 Toast로 사용자에게 직접 GPS를 켜달라는 메시지만 전달하고 끝내도 됐었는데, 사용자의 편의를 생각했을 때, 자동으로 GPS가 켜졌으면 좋겠다는 생각에서 기능을 추가해보았다. 될지 안될지 몰라서 안되면 빼자 라는 생각으로 시도했었었는데, 성공적으로 구현해내서 정말 다행이다...)

작성한 내용 중 일부

 

 

 

이번 주에는 데모데이 3차가 있어서 또 발표 준비를 했었어야 했다. 데모데이 전날까지 밤 10시까지 남아서 각자 작업한 내용들을 merge하고, 발표 자료도 정리하였다. 그리고 이번 데모데이 때는 새롭게 타이머가 도입되어서 15분 이내에 발표를 딱 끝내야 한다. 가뜩이나 이번 스프린트 때에는 보여줄 기능들이 많아서 오래 걸릴 것 같은데, 시간을 효율적으로 쓰기 위해서 발표자를 위해서 시연 순서를 촘촘하게 작성해서 전달해드렸다.

 

일단 교육장 내에서 해결할 수 있는 것들은 다 했다 라고 생각하고 새벽에 각자 집에 돌아가서 작업하기로 하고 헤어졌는데, 갑자기 지하철 안에서 손흔들기 로직이 좀 잘못되었다는 것을 깨닫게 되었다. 안그래도 왠지 모르게 마음 한 켠이 찜찜했었는데... 알고보니 반경 3km 이내의 사람들의 위치를 기능을 껐을 때 날리는 기능 구현이 안되어 있었던 것이었다. 그래서 집에 돌아가서 바로 Slack으로 서버분께 DM을 드렸는데, 늦은 시간임에도 금방 확인해주셨다. 이 부분에 대해서는 로직 수정이 필요할 것 같다는 얘기를 듣게 되었고, 안타깝게도 이번 데모데이 발표 전에 반영되기는 어려울 것 같다는 답변이 듣게 되어 다음 스프린트 때 서로 얘기를 해보면서 맞춰보면 좋을 것 같다고 하고 마무리가 되었다. 다행히도 손흔들기 기능이 이번 스프린트 때 필수로 구현해내야 하는 기능은 아니었어서 참으로 다행이었다...

휴..🫠

 

 

 

그리고 교육장에서 헤어지기 전에 다른 서버분께서 좋아요/채팅 관련 API를 만들어주셔서 dev 서버에 반영을 해주셨는데, 좀 급하게 처리를 하셔서 그런지 build를 했을 때 앱이 죽는 이슈가 발생하게 되었다. 우리는 서버가 죽으면 아무것도 할 수가 없어서 급하게 서버분들을 Slack에서 다 태그를 해서 제발...살려주세요...🙏 애걸복걸을 하게 되었다. 다행히도 새벽에 깨어있던 서버분께서 Slack을 보시고는 채팅 쪽에서 발생하는 이슈를 해결해주셨다. 이후에는 마이페이지에서 서버가 죽어서 앱에 접속이 안된다는 다른 팀원분의 Slack을 새벽 2-3시 쯤에 받았다.

 

단체방에다가 새벽에 내내 깨어있을 것 같으니 문제가 생기거나, 할 말이 있다면 언제든지 연락 달라고 당당히 말해놨는데... 나는 기억에는 없지만... 그때 이미 책상에서 뻗었다고 한다... 눈을 떠보니 아침이어서 정말 식겁했다. 새벽에 다같이 작업해서 오기로 했는데 한 것이 별로 없어서 큰일났다... 싶었다. 그래서 데모데이 당일에 8시20분쯤에 교육장에 제일 먼저 도착해서 못했던 작업을 했다.(처음으로 1빠로 도착했었다.)

 

교육장에 오는 길에 손흔들기 기능이 잘 작동하는지 확인하기 위해서 우리 앱이 깔려있는 공기계를 들면서 확인해봤는데, 잘 되어있을 거라는 예상과는 다르게 현재 위치 기준으로 표시되는 반경이 15초 delay로 인해서 뒤늦게 따라오는 이슈를 발견하게 되었다. (??? 오마이갓.) 그래서 교육장에 도착하자마자 기존에 구현해놓은 Handler를 분리해서 반경과 상대방의 좌표가 나타나는 시간을 따로따로 지정해주었다. (뭔가 코드 퀄리티는 좋지 않은 것 같지만... 일단 빠르게 처리를 해야 됐어서 나중에 리팩토링을 진행하기로 했다.)

이슈가 여기서 터진다고...?

 

 

 

이번 데모데이는 하필 오전 10시쯤에 시작한다고 해서 아침에 맞춰볼 시간이 많지가 않았던 것 같다. 다행히도 발표순서가 제일 마지막이라서 끝까지 서버가 터지는 이슈를 해결하고, 자잘한 이슈들을 해결하고 발표 순서를 한번 쭉 훑어보면서 준비했었던 것 같다. 했던 기능들을 쭉 시연을 하다보니 15분이 훌쩍 지나가버려서 깜짝 놀라긴했지만, 다행히도 구현한 기능들 대부분은 보여준 것 같았다.

 

손흔들기 기능을 시연하다가 내 핸드폰에서는 상대방의 마커가 잘 찍히는데, 상대방의 핸드폰에서는 마커가 보이지 않는 이슈를 발견하게 되었다. 손흔들기에서 상대방의 좌표가 보여지는 기준이 채팅방이 생성되는 사람들에 한해서 보여지게 되는데, 내가 좋아요를 보내서 채팅방으로 활성화가 되어서 대화가 이루어진 경우에는 내 핸드폰에 상대방의 마커가 잘 보이는데, 좋아요를 받은 사람 입장에서는 마커가 보여지지 않는 것이었다. 이 부분에 대해서는 서버 쪽 로직 문제인 것 같아서 데모데이가 끝나고 말씀드렸고, 이 부분과 상대방의 위치 데이터를 삭제하는 로직까지 생각해서 늦어도 다음주 화요일까지 API를 넘겨주시겠다고 하셨다.

 

이번 스프린트 때 웬만한 기능 구현을 끝내서 APK를 배포하는 것이 목표였는데, 아쉽게도 보완해야 하는 부분들이 많아서 늦어도 다음주 월요일까지 완성해서 배포하기로 했다. 다른 사람들이 우리 앱을 사용해보면서 문제라고 생각되는 부분들을 모아서 피드백을 받는 과정도 상당히 중요하다고 생각되어서, 일단 100% 완성은 못해도 배포하기로 결정하게 되었다.

누군가는 피드백 해주겠지...?

 

 

 

데모데이가 오전 중에 끝나게 되어서 이후에 오후 동안에는 못했던 데일리 미팅과 회고를 진행했고, 다음 스프린트 동안에 어떤 기능들을 나눠서 가지게 될지 결정하게 되었다. 손흔들기 기능을 나름 빨리 끝낼 수 있을 것 같아서 채팅과 푸쉬를 아직 다 못끝낸 팀원분들을 위해서 남은 자잘한 기능들(약관, 1:1문의, 앱정보 등등...)을 내가 맡게 되었다. 그리고 다음 스프린트에는 빨리 기능 구현을 끝내고 자잘한 이슈들을 잡으면서 코드 리펙토링을 하는 것이 목표이다. 할 수 있다...있어...!!

다음 스프린트 때 할일 리스트업

 

 

 

그리고 꽤나 오랫동안 ImageView에 자꾸 서로 다른 이미지가 들어가는 이슈가 있었는데(마이페이지의 사용자 프로필 아이콘 / 채팅 리스트에 상대방 프로필 아이콘 / 채팅방에 들어가는 상대방 프로필 아이콘), 원인을 몰라서 해결을 못하고 있었다. 맨날 이상한 아이콘이 들어가는 이슈 때문에 킹(?)받아서 진짜 꼭 해결하고 집간다 라는 마음으로 해결을 시도해보았다.

 

하지만 몇 번의 build를 시도해보아도 해결이 되지 않았고, 심지어 팀장님께서는 이 문제를 해결하기 위해서 fragment를 dialogFragment로 바꿔보겠다며 코드 리펙토링을 진행하고 계셨다. 그러던 중에 우연히 좋은 블로그 글을 보게 되었고, xml 상에서 android:background를 사용했다면 코드 상에서 setBackground()를 사용해야 하며, xml 상에서 android:src를 사용했다면 코드 상에서 setImageResource()를 사용해야 한다는 것을 보게 되었다. 그래서 다 background 관련된 것으로 바꿔서 build를 해보니 해결이 되었다. 몇주동안 스트레스 받았던 것을 이렇게 간단하게 해결하게 되어서 좀 현타가 오기도 했고, 지금이라도 해결해서 다행이다 라는 생각이 들었다. 그래서 해결한 내용을 바로 develop 브랜치에 merge하고 해산하게 되었다.

새로운 걸 알게 되었으니 좋은 거라고 치자...🥲

 

 

 

이제 마지막 스프린트도 얼마 남지 않았고, APK 배포도 빨리 진행해서 완전한 앱을 보여주는 일만 남게 되었다. 마지막 발표자를 사다리 타기로 뽑았는데... 역시나 또 내가 걸렸다^^ 하하하하.. 이정도면 네이버가 나 사랑하는거 아닌가...? 진짜 운 안좋은거 하나는 기가막힌다고 생각한다. 쉽지 않겠지만...마지막까지 파이텡🔥 (눙물...✨)

역대급 운빨

 

 

 

+ 이번 주에 먹은 음식들 (이번 주는 멘토링 때 먹은게 레전드👍)

 

 

 

---

 

 

 

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

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

 

 

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