위치 기반 카페 정보 플랫폼 (부각콩)

프로젝트 개요

부각콩(Boogakcong)은 사용자의 위치를 기준으로 주변 카페를 탐색하고, 카페별 정보와 예상 도보 시간을 한눈에 확인할 수 있도록 만든 위치 기반 웹 플랫폼입니다. 지도에서 카페 위치를 확인하는 기능에 리뷰와 커뮤니티를 결합하고, 일반 사용자·카페 점주·커뮤니티 관리자·운영 관리자에게 서로 다른 기능을 제공하도록 구성했습니다.

2024년 2학기 부산대학교 데이터베이스 수업에서 진행한 팀 프로젝트입니다. 단순히 카페 데이터를 조회하는 데 그치지 않고, 회원과 카페, 리뷰, 게시글, 점주 등록 및 삭제 요청을 관계형 데이터로 설계하고 실제 웹 서비스의 사용자 흐름과 연결하는 것을 목표로 했습니다.

카카오 지도와 카페 목록을 함께 제공하고, 현재 위치를 기준으로 각 카페까지의 예상 도보 시간을 표시한 모바일 화면.

주요 기능

위치 기반 카페 탐색: 카카오 지도에 카페 위치를 표시하고, 선택한 카페의 주소와 상세 정보를 조회합니다.
주변 카페 데이터 수집: 카카오 로컬 API의 카페 카테고리 검색 결과를 서비스 데이터로 가져옵니다.
카페 상세 정보: 연락처와 주소뿐 아니라 Wi-Fi, 콘센트 수, 테이블당 최대 인원, 공지와 간단 후기를 제공합니다.
리뷰와 커뮤니티: 로그인한 사용자가 간단 후기를 작성하고, 이미지가 포함된 게시글을 등록·조회·수정·삭제할 수 있습니다.
마이페이지: 회원 정보와 자신이 작성한 후기·게시글을 모아 보고 바로 수정하거나 삭제할 수 있습니다.
점주 및 관리자 기능: 카페 점주는 매장 정보 변경과 등록·삭제를 요청하고, 관리자는 요청 승인과 회원·후기·게시글 모니터링, 서비스 통계를 수행합니다.

시스템 구조와 데이터 흐름

Next.js 클라이언트 → REST API → Spring Boot 서비스 → PostgreSQL

현재 위치·카페 좌표 → Kakao Maps / Local / Mobility API → 지도·주변 카페·예상 이동 시간

게시글 이미지 → Multipart 요청 → AWS S3 → 이미지 URL 저장

프론트엔드는 Next.js와 TypeScript로 화면과 API 호출을 구성하고, MUI를 이용해 모바일 중심의 인터페이스를 구현했습니다. 로그인 상태와 접근 토큰은 Jotai 및 브라우저 저장소와 연결했습니다. 백엔드는 Spring Boot와 Spring Data JPA로 도메인별 REST API를 제공하며, JWT 인증과 역할 기반 접근 제어를 적용했습니다. 회원·카페·리뷰·게시글·점주 요청 데이터는 PostgreSQL에 저장하고 게시글 이미지는 AWS S3에서 관리합니다.

담당 역할

공개 저장소의 커밋 기록을 기준으로 다음 프론트엔드 기능을 구현하고 백엔드 API와 연결했습니다.

로그인·회원가입 화면 및 인증 API 연동
회원 정보, 작성 후기, 작성 게시글을 관리하는 마이페이지 구현
간단 후기 조회·수정·삭제 인터페이스 구현
카페 등록·삭제 요청과 관리자 승인 화면 구현
회원·후기·게시글을 모니터링하는 커뮤니티 관리자 콘솔 구현
카페·게시글 통계를 시각화하는 운영 관리자 콘솔 구현
사용자 역할에 따른 버튼 및 관리 기능 노출 제어

사용자용 화면과 관리자용 화면이 같은 API를 공유하면서도 권한별로 다른 작업을 제공해야 했기 때문에, 인증 토큰과 사용자 역할에 따라 화면 상태와 요청 흐름이 일관되게 유지되도록 구성하는 데 집중했습니다.

구현 결과와 배운 점

카페 탐색부터 리뷰·게시글 작성, 점주의 매장 관리 요청, 관리자의 승인과 모니터링까지 하나의 데이터 흐름으로 연결했습니다. 이를 통해 관계형 데이터 모델이 실제 화면과 API의 조회·생성·수정·삭제 작업으로 이어지는 과정을 경험했고, 여러 사용자 역할이 존재하는 서비스에서 인증 상태와 권한에 따라 UI와 API 동작을 설계하는 방법을 익혔습니다.

또한 프론트엔드와 백엔드 저장소를 분리해 개발하면서 API 응답 형식과 도메인 타입을 맞추고, 지도·길찾기·스토리지처럼 성격이 다른 외부 서비스를 하나의 사용자 경험으로 통합했습니다.

기술 스택