softkid / happyhouse_project

😃 부동산 반응형 웹사이트 😃

🏡 Happy House

부동산 반응형 웹 사이트

개발 기간 📆

• 2021년 5월 20일 ~ 5월 27일

Tech Stack

Frontend

Vue.js

Backend

Spring Boot&MyBatis Framework, RestAPI

Database

MySQL

화면 설계

1. 메인 화면

- 로그인, 회원가입 기능
- Select box를 이용한 지역 매물 검색 기능
- 검색어를 이용한 매물명 검색 기능

2. 회원정보 조회/수정/탈퇴

- 사용자 정보 조회
- 사용자 정보 수정 및 회원 탈퇴 기능

3. 매물 리스트 화면

- 매물명 및 지역별 리스트
- 매물 리스트 페이징 처리
- column 클릭시 정렬 기능

1) 지역별 리스트

- 관심지역 등록 기능

2) 검색어별 리스트

4. chart dashboard 화면

- 매물명 및 지역별 차트
- 총거래량, 평균 매매가격, 매매 최고가, 매매최저가 표시
- 1억 ~ 20억 사이의 거래가격 분포 차트(전체, 시/군/구, 동)
- 매매타입 Pie Chart(아파트, 연립주택, 오피스텔)
- 주변상권 bar Chart(치킨, 피자, 편의점 카페)
- 월별 거래량 Chart

1) 지역별 리스트

2) 검색어별 리스트

- 검색어와 같은 매물이 가장 많은 지역으로 검색

5. 지도 화면

- kakao map api 사용
- 검색지역으로 지도 이동 및 마커를 이용한 매물 표시
- 마커 클릭시 매물 상세정보 표시(거래가, 층수, 거래일 등)
- 마커 제목 클릭시 구글 이미지 검색

1) 지역별 지도 표시

2) 검색어별 지도 표시

- 검색어와 같은 매물이 가장 많은 지역으로 검색
- 검색어와 같은 매물 모두 마킹

7. 관심지역 목록

- 지역별 리스트 화면에서 버튼 클릭시 관심지역 등록
- 버튼클릭시 관심지역 삭제 기능
- table row 클릭시 지역 검색 기능
- 관심지역 리스트