HappyHouse

삼성 청년 SW 아카데미에서 진행한 프로젝트 입니다.

프로젝트 목적

새로운 집을 찾기위해 지도를 열면 고려해야 할 것이 생각보다 많습니다!

• 대충 저기쯤이 회사인데...
• 내가 다니는 치과는?
• 헬스장은 10개월이나 남았구나
• 자주 가는 쇼핑몰이 저기고
• 동물 병원은 여기고
• 부모님 집까지는 얼마나 멀지
• ...

매번 찾을 때 마다 이것 저것 따져보자니 너무 번거롭습니다.
나의 생활 영역을 기반으로 알맞은 매물 정보를 한 눈에 볼 수 있었으면 좋겠다는 생각에 이 웹 어플리케이션을 만들게 되었습니다.

사용 기술 스택

프로젝트 구조

저장소는 SpringBoot 구조이며, /vue/happyhouse에 프론트엔드 프로젝트(Vue)가 위치하고 있습니다.

프로젝트 진행과 역할 분담

프로젝트 팀원 : 김제관(팀장), 김영진(팀원)
프로젝트 진행 기간 : 2022-05-19(목) ~ 2022-05-26(목) 총 7일

프로젝트 진행에 앞서 구현해야 할 기능을 기본 기능과 심화 기능으로 나누었습니다.

기본 기능	심화 기능
로그인/회원가입/수정/탈퇴	유저 생활 영역 관리
공지사항	생활 영역기반 정보 제공
기본 검색	심화 검색
카카오 맵 연동	카카오 맵 활용

그리고 기본 기능에 3일, 심화 기능에 4일을 투자하도록 결정하였습니다.

백엔드와 프론트엔드의 공통 기반을 먼저 함께 완성하고
이후에 각각의 기능별로 Backend부터 Frontend까지 관통하는 방식으로 개발을 진행하였습니다.
팀원 별 기능 구분은 아래와 같습니다.

김제관	김영진
공지 사항 기능	유저 관련 기능
카카오 맵 연동 및 활용	유저 생활 영역 관리 기능
생활 영역 과 카카오 맵 활용	생활 영역 과 카카오 맵 활용
기본 검색 및 심화 검색 기능	어드민 관련 기능

프로젝트 결과

핵심 기능에 대한 결과물입니다.

메인 화면

HappyHouse는 SPA 방식의 지도앱입니다.

생활 영역 추가하기

지도를 클릭하면 마커가 생성되며 해당 장소를 나의 생활 영역에 등록할 수 있습니다.

생활 영역으로부터 거리 보기

좌측 상단의 자모양 버튼을 활성화하면 선택한 지점으로 부터 나의 생활 영역까지의 거리를 알 수 있습니다.

맵 위에 영역을 그려 매물 검색하기

좌측 상단의 도형 그리기버튼을 활성화 하면 지도에 영역을 그릴 수 있고, 영역 내의 매물 내역도 검색할 수 있습니다.