넷플릭스, 디즈니+, 왓챠, 웨이브. OTT 구독료를 함께 나눌 "팟"을 만들고, 신뢰도 기반으로 팟원을 모아 계정과 계좌를 안전하게 공유하는 OTT 팟 구하기 서비스입니다.
- 서비스명: genie
- 개발 기간: 2023.04.11 ~ 2023.06.23
- 개발 인원: 4명 (Backend / Frontend)
- 분반: 소프트웨어 시스템 개발 01분반
OTT 구독료가 매년 오르면서 한 사람이 여러 서비스를 모두 결제하기엔 부담이 큽니다. 그래서 많은 사람들이 계정을 함께 쓰며 구독료를 나누지만, 정작 믿을 수 있는 동행을 찾는 일이 가장 어렵습니다.
- 신뢰의 부재: 비공식 오픈채팅이나 중고 거래로 팟원을 구하다 보면 잠수, 미입금, 탈주 같은 피해가 잦습니다.
- 정보의 분산: 계정 아이디와 비밀번호, 입금 계좌, 정산 안내가 여기저기 흩어져 관리가 번거롭습니다.
- 소통의 단절: 팟원끼리 연락할 창구가 없어 문제가 생겨도 대응이 늦습니다.
genie는 이 문제를 한곳에서 해결합니다. OTT별로 "팟"을 만들어 모집하고, 신뢰도 점수로 상대를 가늠하며, 팟장이 계정과 계좌를 등록하면 승인된 멤버에게만 안전하게 공유되고, 팟별 그룹 채팅으로 바로 소통할 수 있습니다.
- 메인 화면에서 OTT별 모집 중인 팟 목록을 한눈에 보고, 상단 내비에서 넷플릭스/디즈니+/왓챠/웨이브로 필터링할 수 있습니다.
- 팟 이름, 남은 인원, 기간으로 검색할 수 있습니다.
- 마음에 드는 팟은 하트로 찜해두고, 마이페이지의 찜 목록에서 다시 확인합니다.
- 모집 중인 팟이 없을 때는 빈 상태 안내로 팟 생성을 유도합니다.
| 로그인 | 회원가입 |
|---|---|
![]() |
![]() |
- 아이디와 비밀번호 기반의 세션 로그인을 제공하며, 비밀번호는 BCrypt로 암호화해 저장합니다.
- 회원가입 시 입력값을 검증하고, 가입과 동시에 초기 신뢰도 점수를 부여합니다.
| 팟 만들기 | 팟 상세 | 팟 시작 (계정/계좌 등록) |
|---|---|---|
![]() |
![]() |
![]() |
- 팟 만들기: OTT 종류, 모집 인원, 사용 기간을 선택해 팟을 개설합니다.
- 팟 상세: 팟 정보와 모집 현황을 확인하고, 다른 사용자는 가입을 신청합니다.
- 팟 시작: 정원이 차면 팟장이 OTT 아이디/비밀번호와 은행/계좌번호, 이용 기간을 입력해 팟을 시작합니다. 이 정보는 진행 중 팟의 메인 화면에서 승인된 멤버에게만 노출됩니다.
| 신청자 관리 (팟장) | 팟 그룹 채팅 |
|---|---|
![]() |
![]() |
- 신청자 관리: 팟장은 신청자의 닉네임과 신뢰도를 보고 승인 또는 거절하며, 현재 멤버 현황을 확인합니다.
- 그룹 채팅: 시작된 팟의 멤버끼리 실시간으로 대화합니다. WebSocket으로 팟별로 채팅방이 분리되어 다른 팟의 대화가 섞이지 않습니다.
| 마이페이지 | 회원 신고 |
|---|---|
![]() |
![]() |
- 마이페이지: 내 신뢰도 점수와 기본 정보를 확인하고, 내가 만든 팟 / 가입한 팟 / 찜 목록으로 이동합니다.
- 회원 신고: 탈주, 욕설, 잠수 등 문제가 된 회원을 사유와 증거 이미지로 신고합니다.
| 회원 관리 | 신고 관리 |
|---|---|
![]() |
![]() |
- 관리자는 전체 회원 목록과 접수된 신고를 확인합니다.
- 신고를 승인하면 신고 유형(탈주/욕설/잠수)에 따라 대상 회원의 신뢰도가 차감되고, 변동 내역이 신뢰도 원장에 기록됩니다.
- SockJS 기반 WebSocket으로 실시간 채팅을 구현하고,
potId별로 세션을 분리해 팟마다 독립된 채팅방을 제공합니다. - 채팅 입장 시 팟장 또는 승인된 멤버인지 멤버십을 검증하여 권한 없는 접근을 차단합니다.
- 팟 이름, 남은 인원, 기간, OTT 종류 등 선택적 조건을
BooleanBuilder로 조합해 동적 쿼리를 구성합니다. - 모집 중(
RECRUITING) 상태의 팟만 노출하고, 카운트 쿼리를 분리해 정확한 페이징을 제공합니다.
- 세션 기반 폼 로그인과 CSRF 보호를 적용하고, URL과 도메인 로직 양쪽에서 권한을 검증합니다.
- 팟장 / 승인 멤버 / 관리자 권한을 구분하여, 팟 삭제와 시작, 신청 승인은 팟장 본인만, 회원/신고 관리는 관리자만 수행할 수 있습니다.
- OTT 계정과 계좌 정보는 팟장과 승인된 멤버에게만 응답 DTO에 담겨 비멤버에게 노출되지 않습니다.
- 회원가입 시 기본 점수를 부여하고, 신고가 승인되면 유형별 가중치만큼 점수를 차감합니다.
- 점수 변동은 원장 형태로 기록되어 마이페이지에서 이력을 확인할 수 있습니다.
- 여러 신청을 동시에 승인할 때 정원이 초과되지 않도록, 팟 조회에 비관적 락을 걸어
remain(남은 자리) 갱신을 직렬화합니다.
genie는 Spring MVC와 Thymeleaf 기반의 서버사이드 렌더링(SSR) 모놀리식 구조입니다. 하나의 Spring Boot 애플리케이션이 화면 렌더링과 API, 실시간 채팅을 모두 담당합니다.
Browser
└─ Spring Boot (Embedded Tomcat :8080)
├─ Spring MVC + Thymeleaf # 서버사이드 렌더링 (모든 화면)
├─ Spring Security # 세션/폼 로그인, CSRF, 권한 분리
├─ WebSocket (SockJS) # 팟별 그룹 채팅
├─ Spring Data JPA + QueryDSL # 도메인 영속성, 동적 검색
└─ MySQL # 영구 데이터 저장
도메인별로 패키지를 나눈 package-by-feature 구조입니다.
genie/
├── src/main/java/com/example/genie/
│ ├── common/ # 공통 (Security/WebSocket 설정, 예외, 유틸, BaseEntity)
│ └── domain/
│ ├── pot/ # 팟 생성/검색/시작 (핵심 도메인, QueryDSL 검색)
│ ├── apply/ # 가입 신청 및 승인/거절
│ ├── auth/ # 인증 (회원가입, 로그인, UserDetails)
│ ├── user/ # 회원 정보, 마이페이지
│ ├── chat/ # 팟 그룹 채팅
│ ├── interest/ # 찜
│ ├── reliability/ # 신뢰도 점수와 변동 이력
│ └── report/ # 회원 신고, 증거 파일 업로드
├── src/main/resources/
│ ├── templates/ # Thymeleaf 화면
│ └── static/
│ ├── css/ # clay.css (디자인 시스템)
│ └── image/ # 로고, 히어로 일러스트
├── docs/screenshots/ # 주요 화면 캡쳐
└── build.gradle
JDK 17 권장, MySQL 필요. 설정 파일(
application.yml)은 보안을 위해 저장소에 포함되지 않습니다.
# 1. 데이터베이스 생성
mysql -u root -e "CREATE DATABASE genie;"
# 2. src/main/resources/application.yml 작성 (datasource, jpa, server.port 등)
# 3. 실행
./gradlew bootRun
# → http://localhost:8080| 이름 | 역할 | GitHub |
|---|---|---|
| 손다현 | Backend / Frontend | @sondahyun |
| (팀원) | (역할) | (GitHub) |
| (팀원) | (역할) | (GitHub) |
소프트웨어 시스템 개발 01분반 - genie 🧞











