02-28 학습&숙제

한강섭·2025년 3월 2일
0

학습 & 숙제

목록 보기
34/103
post-thumbnail

02-28 학습! 🟥🟧🟨🟩🟦🟪🟫⬜⬛🫢🔔😎😊🤔😭⭐

프론트엔드 프로젝트

결과

Enjoy Trip

🌐 지역, 시군구, 컨텐츠를 선택하면 지도를 통해 보여지는 관광지 정보 프로젝트

📚 프로젝트 개요

"Enjoy Trip"은 API를 활용하여 관광지 정보를 검색하고, 목록에서 검색 결과를 확인하며 지도를 통해 위치를 시각적으로 탐색할 수 있는 개인 프로젝트입니다.

📐 주요 기능

  • 다양한 이미지의 마커: 컨텐츠 별로 다른 이미지 마커를 지도에 표현하여 가독성을 확보합니다.
  • 편리한 위치 탐색: 지도에 표시된 리스트를 누르면 해당 위치로 이동하여 편의성을 증대시킵니다.
  • 장소 정보 제공: 지도에 표시된 마커를 누르면 해당 장소에 대한 사진과 설명을 볼 수 있습니다.
  • 검색 결과 목록: 검색 결과를 목록에 표시하며, 목록이 많을 경우 스크롤을 지원합니다.

🛠 사용 방법

  1. 홈 페이지에서 지역, 시군구, 컨텐츠 타입을 선택합니다.
  2. "검색" 버튼을 누르면 결과가 목록에 표시됩니다.
  3. 목록에서 관광지 이름을 클릭하면, 지도가 해당 위치로 이동합니다.
  4. 지도에서 마커를 클릭하면 해당 장소의 사진과 설명이 표시됩니다.

💻 사용한 기술

  • UI 구성: HTML, CSS, Bootstrap
  • 지도 기능 구현: JavaScript (ES6+), Leaflet.js
  • API 연결: data.go.kr, SGIS API (관광지 정보 검색 및 활용)

💡 향후 개선 방향

  • 지도 최적화 (거리 계산, 경로 탐색 기능 추가)
  • 즐겨찾기 기능 추가
  • 검색 필터 확장 (사용자 리뷰 기반 정렬 기능 추가)

👀 Enjoy Trip을 통해 원하는 관광지를 쉽게 찾아보세요! 🚀

디자인

  1. 메인페이지
    image
  2. 로그인 페이지
    image
  3. 회원가입 페이지
    image
  4. 관광지 검색 페이지
    image
profile
기록하고 공유하는 개발자

0개의 댓글