68일차 - project 지도 검색기능 구현

·2024년 3월 19일

Spring

지도 검색기능 넣기

문제직면

  • 아무리 지도에서 키워드로 검색을 해도 검색이 안된다..

해결 방법

  1. 일단 뭐가 문제인지 확인하기 위해 f12를 눌러서 콘솔에 에러가 뜨는게 있는지 확인했다.
  2. 보니까 var ps = new kakao.maps.services.Places(); 이부분에서 Places()를 읽을 수 없다 뭐 어쩌구 저쩌구 하길래 이게 뭐지 뭐가 문제지 했다.
  3. 그래서 구글링 해보니까 카카오맵 라이브러리를 추가했냐 안했냐 해서 난 분명 처음 시작할때 추가를 했었는데 뭐가 더 있나? 해서 봤다.
  4. 보니까 service 라이브러리가 따로 있어서 추가를 해봤다.
  5. 그래도 안되고 Places()부분에서 여전히 에러가 떴다.
  6. 그래서 구글링하다가 찾은 정보를 봤는데 라이브러리 가져올때 스크립트부분을 여러개 다 가져오지말고 하나만 쓰라고 해서 하나만 쓰니까 해결 완료..
<!-- 기존에 쓰던 코드 -->
	<script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=9f610802a768fc42d433742c899be05d"></script>
	<!-- services 라이브러리 불러오기 -->
	<script type="text/javascript"
		src="//dapi.kakao.com/v2/maps/sdk.js?appkey=9f610802a768fc42d433742c899be05d&libraries=services"></script>

<!-- 수정 후 코드 -->
	<!-- services 라이브러리 불러오기 -->
	<script type="text/javascript"
		src="//dapi.kakao.com/v2/maps/sdk.js?appkey=9f610802a768fc42d433742c899be05d&libraries=services"></script>

재료공구 기능 구현을 위한 내 생각 정리.

  1. 인원 수 제한을 둘 수 있는 채팅방이 있어야 할 것 같다.
  2. 재료공구를 하기 위해선 내 위치 설정부터 해야 할 것 같다.
  • 내가 선택한 위치 정보 3가지를 통해서 게시글을 작성할때 위치를 셀렉트 할 수 있게 해야 할 것 같다.
  1. 지도 페이지도 키워드로 검색해서 목록화 하는 페이지(1), 카테고리별로 검색하는 페이지(2) 이렇게 두개로 나눠서 해야한다.
  2. 페이지(1)은 게시글을 보는 사용자들이 검색해서 위치 정보를 정확하게 검색할 수 있게 하기 위함.
  3. 페이지(2)는 추후에 공구를 진행했을때 어떤 마트에서 공구하는지에 대한 정보를 위함.

재료공구 기능 구현을 위한 내가 지금 해야할 일.

  • 채팅방 기능 구현을 위한 구글링.
  • 내 위치 설정을 할 수 있는 페이지 구현
  • 지도 페이지(1), 페이지(2) 만들기
  • 내 위치 정보 3가지에 따른 위치별 게시글 리스트.

참고해야할 사항

  • 게시글을 눌렀을때 내가 사려고 했던 재료라면 참가 버튼을 눌러서 채팅방 참여.
  • 채팅방 참여자들의 모든 매너날씨 보기 가능.
  • 오늘 같은 반에서 수업듣는 수강생분이 한 프로젝트를 봤는데 주소찾기 API를 가져와서 주소를 입력해서 저장하는걸 봤다! 나도 이걸 가져와서 사용자의 위치정보를 저장해야겠다.

지도 페이지(1) 구현중

TODO

  • 주소API가져와서 적용하기.
  • DB 테이블 구조 수정
  • 재료공구게시글 작성페이지 피그마 퍼블리싱
  • 채팅방 기능 구글링

느낀점

  • 나 할게 산더미다.. 일해라 굴러라!!
  • 내가 좋아하는 가수가 거즘 3년만에 완전체로 컴백했는데.. 음악 듣다가 눈물이 났다.. 너무 기뻐서.. 후후..
profile
우당탕탕 연이의 개발일기

0개의 댓글