아파트 실거래가 정보를 카카오맵 API와 제공하고 내가 찜한 아파트를 비교 분석해주는 사이트

서울 아파트의 실거래가 정보를 지도와 함께 알아보고 맘에 드는 매물을 찜해보자!

• 시,군구,동을 선택하거나 아파트 이름을 검색하여 해당하는 아파트 정보를 지도와 함께 제공하기
• 자유게시판에서 자유로운 의견 나누기
• 맘에 드는 매물을 찜하고 비교 분석하기

FrontEnd: Vue.js, BootstrapVue

BackEnd: Spring

DB: mySql

비회원: 홈에서 지도 검색 가능, 상세 보기 가능(찜하기 불가능)

회원: 홈에서 지도 오버레이(상세보기)의 찜 기능 사용 가능, 자유게시판, 찜목록 사용 가능

관리자: 회원 관리(회원 삭제) 가능

• '로그인하기'를 눌러 로그인 창으로 이동
• '비회원으로 시작'을 눌러 홈으로 이동

• 지도가 보이는 메인화면
• 상단 네비게이션바는 선택하는 메뉴마다 검정색으로 표시

• 서울시, 군/구, 동을 셀렉트 박스로 선택

• 아파트이름 검색 (포함 단어 검색)

• 시군구동/아파트이름 검색 시 지도에서 해당하는 모든 아파트의 마커가 표시되며 상세 오버레이는 뜨지 않음 (마커를 직접 선택 해야 오버레이가 뜸)

• 지도 좌측 리스트를 누를 경우 모든 마커가 사라지고 해당 아파트 마커와 오버레이가 바로 표시됨

• ✖를 눌러 오버레이 닫기

• ❤를 눌러 찜하기(회원만 가능)

• 하트를 눌러 찜한 아파트가 리스트로 뜸
• 가격/건축년도 우측 화살표를 눌러 정렬 가능

• 찜 리스트에서 아파트를 누르면 하단에 비교 카드가 뜸
• 두개의 아파트를 선택할 경우 카드뷰에 두 아파트를 비교한 내용이 빨간글씨로 생성

• 비회원은 글 리스트만 볼 수 있음
• 회원은 글 보기, 작성, 수정, 삭제 가능
• 회원은 댓글 작성, 삭제 가능

npm install
npm i bootstrap-vue
npm i bootstrap
npm i axios
npm install --save jwt-decode
npm i vuex-persistedstate

npm run serve

npm run build

npm run lint