하루를 마무리 하기 전, 오늘 있었던 일들을 잔잔히 되짚어봅니다.
성공과 실패의 모든 요소에서 '배울 점'을 찾아내어 기록하고,
더 성장하는 내일의 나를 위해 'action plan'을 세웁니다.
오전에 집에서 조금 자고 나갈까 하는 유혹에 잠시 흔들렸지만(ㅋㅋ)
평소의 루틴을 깨고 싶지 않아서 일찍 집에서 나섰다.
금요일에 클러스터를 공부하고 싶었는데... 생각보다 마커 클릭 이벤트가 잘 풀리지 않아 불편한 마음으로 코딩도장에 도착했다.
오전에는 마커 클릭이벤트를 구현하고 오후에는 클러스터를 정말 해봐야지!! 했는데
결론적으론 마커 클릭 이벤트는 실패했다.
선택한 마커의 이미지 바꾸는게 이리도 어려운 일인걸까....흑.
물론 크리티컬한 기능은 아니지만 그래도 기획 안에 들어있는 내용이라 꼭 좀 해보고 싶었는데 상태관리가 아직 안되는 부분도 있고, 아무래도 외부 API를 갖다쓰는거다 보니 그 rule에 맞지 않는 형태의 코드로 만드는게 영 쉽지 않다.
매번 기능 구현과 시간의 투입 그 어딘가에서 밸런스를 고민해야 하는 입장이라..
더 시간을 투입하는 건 무의미하다고 생각해서 바로 클러스터 마커로 넘어갔다.
사실 클러스터 마커를 찍는 게 정-말 시간이 오래 걸릴 것 같아 잔뜩 긴장하고 있었는데.
웬걸? 이래 저래 코드를 뜯어보고 또 오류가 나는 지점들을 찾아가다 보니 생각보다 수월하게 해결되었다.
아마 2주 내도로 지도와 씨름하다 보니 어느정도 카카오맵 API와 코드 흐름이 좀 읽혀서 그런 것 같다.
기본 스타일의 클러스터 마커는 시퍼런 색이라 좀 마음에 안들어서, 예시로 나온 코드를 살짝 변형하여 붉은색의 마커로 변경해보았다.
데이터가 많았으면 장소 밀집도에 따라 크기를 다르게 주거나 색깔을 달리 했을텐데, 지금은 가진 데이터가 없고 임의로 넣은 10개의 장소 데이터밖에 없어서 약간 빈약하게 찍힌다.
그래도 오늘 목표로 했던 기능을 구현해서 사실 정-말 기뻤다.
오전에 코딩도장에 아무도 없다보니 소리지르고 좋아했음ㅋㅋㅋㅋㅋ읔.
마음 한편으론 '다른 동료가 했으면 좀 더 빨리, 금방 구현했을텐데... 내가 해서 2주나 걸린걸까' 하는 생각도 들었지만.
갠적으론 외부API를 갖다 쓰는 것에 대한 거부감이 덜어지는 의미있는 경험이었다.
오후에는 스크래핑을 공부하려다가 필터 기능에서 아직 구현이 덜 된 부분이 있어 그 부분을 잡고... 특히 이번 프로젝트 때 CSS에 대한 숙련도를 높이지 않으면 정말 실무에 가서 큰 코 다치겠단 생각이 들었다.
시간이 좀 들긴 했지만 그래도 보기 싫지는 않을 정도 선에서만 CSS를 적용해두었다.
기존에 하단에 있었던 네비게이션 바는 역시 헤더로 옮기는게 낫다고 판단. 모바일 사이즈를 기반으로 한 웹 환경이기 때문에 굳이 메뉴바를 하단에 놓을 필요가 없을 것 같다.
마커를 클릭했을 때 보이는 장소 요약정보
오랜만에 해서 약간 애먹었던 부분. 원하는 지역이나 카테고리를 클릭했을 때 버튼에 highlight를 주고 싶었는데 좀 헤매다가 막판에 생각나서 적용해보았다.
필터를 적용한 결과값이 있을 때 하단에 결과 bar가 뜨고, 저 버튼을 누르면 장소 list 화면으로 direction. 이어지는 화면들은 로직도 구성해야 하고 CSS 적용도 해야한다. 아직 구현되지 않은 상태.
조건에 맞는 장소가 없을 땐 disabled 된 버튼으로 결과를 알려줌
CSS는 자주 사용하지 않으면 매번 인터넷을 뒤지느라 시간이 많이 소요된다.
오늘 코딩도장에서 3기 동료분의 CSS 관련 책을 빌려 읽어보았는데 약간 원론적인 내용이라 그래서 어떻게 공부할 것인가?에 대한 질문이 마음속에 크게 남았다.
모바일 사이즈를 참고하기 위해 인스타와 페북을 웹 환경에서 띄워봤는데...
클론 코딩이 CSS 숙련도를 높이는데 꽤 도움이 되지 않을까? 하는 생각도 들고.
어쨌든, 지금처럼 계속 인터넷을 뒤지느라 시간이 투머치 소요되어선 안될 것이다.
가장 기본적인 부분들(상위 div에서 양쪽 사이즈를 잡아주기 위해 calc를 활용한다거나.. transform 등등)은 외우다시피 해서 작업속도에 로드가 걸리지 않도록 해야겠다.
내일은 스크래핑 공부, 그리고 지금 화면에서 잘 구현되지 않는 부분들 위주로 코드 리팩터링을 진행해야 겠다.
얼른 다른 기능들도 구현해보자.
