Skip to content

ZipGongLyag/home-frontend

Repository files navigation

🏠 집공략 [ 주택 매물 검색 서비스 ]

집공략

🗃️ 프로젝트 소개

집공략은 공공데이터 포털의 국토교통부_아파트매매 실거래 상세 자료Kakao Map API를 활용한 주택 매물 검색 서비스입니다.

멤버

Role Front-End Back-End
Member 김상현 이강산

🛠️ 기술 스택

🔧 프론트엔드

⚡️ SKILLS

Html Css JavaScript JavaScript

📄 라이브러리

{
  "axios": "^1.6.8",
  "bootstrap": "^5.3.3",
  "dotenv": "^16.4.5",
  "js-base64": "^3.7.7",
  "pinia": "^2.1.7",
  "vue": "^3.4.21",
  "vue-router": "^4.3.2"
}

🔧 백엔드

⚡️ SKILLS

JavaScript JavaScript JavaScript JavaScript JavaScript

📄 라이브러리

{
  "spring-boot-starter-web": "@latest",
  "mybatis-spring-boot-starter": "3.0.3",
  "spring-boot-devtools": "@latest",
  "mysql-connector-j": "@latest",
  "lombok": "@latest",
  "spring-boot-starter-tomcat": "@latest",
  "spring-boot-starter-test": "@latest",
  "mybatis-spring-boot-starter-test": "3.0.3",
  "springdoc-openapi-starter-webmvc-ui": "2.5.0",
  "jjwt-api": "0.11.5",
  "jjwt-impl": "0.11.5",
  "jjwt-jackson": "0.11.5",
}

🔧 인프라

JavaScript JavaScript JavaScript

🖥️ 화면구성

메인 페이지
image
- 카카오 지도 API를 기반으로 사이드 네비게이션을 통해 주변 실거래가 정보 내역을 조회할 수 있습니다.

검색 페이지
캡처
- 검색 키워드지도의 중앙 위.경도값을 기준으로 주변 실거래가 정보 내역을 조회할 수 있습니다.

로그인 페이지
image
- IDPassword 기반의 로그인 기능을 구현하였습니다.
- 로그인 성공 시, JWT를 발급하여 사용자의 Role에 따라 API 사용을 제한하였습니다.

회원가입 페이지
image
- 사용자로부터 아이디, 비밀번호, 이름, 이메일을 제공받아 회원가입 기능을 구현하였습니다.

Q&A 페이지
캡처
- 사용자와 관리자가 소통할 수 있는 창구인 Q&A 게시판 기능을 구현하였습니다.

부동산 뉴스 API
캡처
- 네이버 API를 통해 네이버 검색의 뉴스 검색 결과를 제공하는 기능을 구현하였습니다.

📄 Diagram

ERD

image

Usecase Diagram

1. 거래정보 조회 유스케이스

image

2. 회원관리 유스케이스

image

3. QnA 게시판 유스케이스

image

About

집공략 - 주택 매물 검색 서비스

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published