StageLog

내한 공연 예매를 담당하는 여러 사이트에서 내한 공연의 정보를 수집하여 웹으로 제공하는 웹페이지

기획한 이유

평소에 내한 공연을 좋아해서 관심있는 주제로 선정하게 되었습니다
내한 공연 정보를 찾기 위해서 SNS나 티켓 예매 사이트에 방문하여 공연 정보를 확인하는데 공연 마다 예매처가 다르거나 독점 판매 등이 있기 때문에 모든 사이트를 방문해서 관심 있는 공연을 찾아야 하기 때문에
이런한 불편한 점을 개선하기 위해 공연 예매 사이트에서 제공하는 내한 공연 정보만 수집하여 웹에서 통합해서 제공하여 사용자가 한곳에서 정보를 쉽게 확인할 수 있도록 편의성을 제공하고 싶어 이런한 웹 사이트를 기말과제로 선정했습니다

개발 인원: 1명

주요 기능

• 내한 공연 목록 전체 조회 및 상세 정보 확인
• 공연 포스터, 공연 장소, 일자, 예매처 및 예매 링크 제공
• 공연 장소 구글 지도에 표시하여 시각화
• 즐겨찾기(찜) 기능으로 관심 공연 관리
• 기대평(댓글) 작성 및 조회 기능
• S3 이미지 업로드 및 조회 기능
• JWT 인증 기반 사용자 로그인/회원가입

개발환경

프론트엔드

• Vite + React + TypeScript 기반 SPA
• 기술 스택: Vite,React,TypeScript,HTML,CSS
• 개발 툴: Visual Studio Code

라이브러리

• react-router-dom 7.5.3
• react-icons 5.5.0
• react-dom 19.1.0
• axios 1.9.0

백엔드

• 기술 스택: Java,Spring Boot,Spring Security,JPA
• 기능 구현: CRUD API 구현,JWT 기반 토큰 인증,회원가입 및 로그인
• 개발 툴: IntelliJ IDEA Ultimate

데이터베이스

• RDBMS: MySQL
• 툴: MySQL Workbench

인프라 (AWS)

• EC2: 백엔드 서버 호스팅 (Docker 기반 배포)
• RDS: MySQL 데이터베이스 운영
• S3: 공연 포스터 이미지 파일 저장 및 불러오기

기타

• 버전 관리: Git,GitHub
• 테스트: PostMan,Swagger

커밋 컨벤션

• feat: 새로운 기능 추가
• fix: 버그 수정
• refactor: 코드 리팩토링
• style: 코드 스타일 변경 (기능 영향 없음)
• docs: 문서 수정
• test: 테스트 코드 추가
• chore: 빌드/설정 등 잡일

실행 방법

1. npm 라이브러리 설치 npm install
2. vite 웹서버 실행 npm run dev