그동안 학원다니면서 바쁜 나머지 포스팅을 쓸 엄두가 안나서 내버려두다가 거진 3개월만에 글을 쓰게 되었다.
그동안 무엇을 했는지 하나씩 글을 올려보도록 한다
🚶서울 한바퀴
앱 인벤터 이후로 HTML과 Javascript를 이용한 프로젝트를 진행하였다.
React를 배우고나서는 한번도 건드려볼 일이 없던 HTML을 다루게 되어 감개무량했던 시간이었다.
개요
 |  |
|---|
바야흐로 코로나 시기... 였나 그 이전이었나
아무튼 지인의 권유로 JTBC 서울 트레일에 신청하게 되어 서울 둘레길을 완주했던 경험이 있었다.
힘들긴 했지만 북한산 코스를 돌던 중 그 경치에 푹 빠져서 코로나 걸리기 전까지는 산에 미쳐서 살았던 시기가 있었다.
그래서 HTML로 많은 것은 할 생각이 없었고 많은 분들이 서울 둘레길에 대해 알아줬으면 하는 마음으로 정보 전달을 위한 페이지를 만들자는 계획을 세웠다.
💾 데이터
우선 소개 할 정보가 있어야 페이지에 내용을 채울 수 있지 않겠나.
서울 둘레길 코스를 안내해주는 사이트가 있는데 여길 참고했다.
안타깝게도 서울 둘레길은 코스 정보를 따로 API를 제공... 하긴 하는데 저 사이트에 있는 정보를 제공하는건 아니라서 영 못써먹겠어서 일일이 Ctrl+C Ctrl+V 했다
📝 구성
💻 PC
📱 모바일
⚙️ 기능
초급, 중급, 고급별로 코스 카테고리 버튼을 다르게 해놓았다.
카카오맵에서 코스 경로를 볼 수 있는 정적 이미지 버튼을 만들었다.
당초에는 서울 둘레길 사이트처럼 지도 API에 경로를 나타내고 싶었으나, 코스 경로 좌표가 없었기 때문에 일일이 계산해서 찍을 수도 없는 노릇이고 그만두었다.
네이버 지도에 스탬프 위치를 제공하기 때문에 버튼으로 만들었다.
난감했던 점
HTML은 React와는 다르게 일일이 페이지를 생성해줘야한다.
즉, 코스가 21개이면 페이지가 21개가 있어야한다는 것이다.
이 얼마나 비효율적인지 역체감을 느끼는 시간이었다.
결과
지금은 React로 마이그레이션 하여 배포하였으므로 관심 있으면 들어가보셨으면 한다.
github : https://github.com/HYK-Nov/seoul-round
배포 : https://seoul-round.vercel.app/
