release
This commit is contained in:
parent
5c02dc9ac2
commit
5c12b1b5a0
350
README.md
350
README.md
@ -1,73 +1,303 @@
|
||||
# 마이구독 - 생활 구독 관리 서비스
|
||||
# 마이구독 서비스 (LifeSub)
|
||||
|
||||
## 프로젝트 소개
|
||||
마이구독은 여러 구독 서비스를 한눈에 관리할 수 있는 서비스입니다.
|
||||
총 구독료 확인, 구독 서비스 관리, 맞춤형 구독 추천 등의 기능을 제공합니다.
|
||||
## 1. 소개
|
||||
마이구독은 다양한, 증가하는 생활 구독 서비스를 한 곳에서 편리하게 관리할 수 있는 애플리케이션입니다. 사용자가 구독 중인 서비스를 한눈에 확인하고, 월별 구독료를 관리하며, 새로운 구독 서비스를 추천받을 수 있습니다.
|
||||
|
||||
## 시작하기
|
||||
### 1.1 핵심 기능
|
||||
- **구독 관리**: 다양한 구독 서비스를 한 곳에서 관리
|
||||
- **비용 분석**: 월별 구독료 총액 및 수준 확인 (Liker, Collector, Addict)
|
||||
- **맞춤형 추천**: 사용자의 지출 패턴 기반 새로운 구독 서비스 추천
|
||||
|
||||
### 환경 설정
|
||||
1. 환경변수 설정
|
||||
```bash
|
||||
# .env 파일을 생성하고 아래 환경변수를 설정합니다
|
||||
REACT_APP_MEMBER_URL=http://localhost:8081
|
||||
REACT_APP_MYSUB_URL=http://localhost:8082
|
||||
REACT_APP_RECOMMEND_URL=http://localhost:8083
|
||||
```
|
||||
## 2. 시스템 아키텍처
|
||||
|
||||
2. 이미지 파일 준비
|
||||
public/images 폴더에 필요한 이미지 파일들을 위치시킵니다
|
||||
이미지 파일명은 서비스ID.png 형식이어야 합니다 (예: netflix.png)
|
||||
이미지는 PNG 포맷, 투명 배경, 200x200px ~ 400x400px 크기여야 합니다
|
||||
### 2.1 전체 구조
|
||||
프론트엔드와 마이크로서비스 백엔드로 구성된 웹 애플리케이션
|
||||
|
||||
### 설치 및 실행
|
||||
```
|
||||
# 의존성 설치
|
||||
npm install
|
||||
### 2.2 마이크로서비스 구성
|
||||
- **회원 서비스 (Member)**: 사용자 인증 및 토큰 관리
|
||||
- **구독 서비스 (MySub)**: 구독 정보 관리 및 카테고리 관리
|
||||
- **추천 서비스 (Recommend)**: 사용자 맞춤형 구독 서비스 추천
|
||||
|
||||
# 개발 서버 실행
|
||||
npm start
|
||||
```
|
||||
### 2.3 기술 스택
|
||||
- **프론트엔드**: React, Material UI, React Router
|
||||
- **백엔드**: Spring Boot, Java
|
||||
- **인프라**: Azure Kubernetes Service (AKS), Azure Container Registry
|
||||
- **CI/CD**: Jenkins, Podman (컨테이너 빌드)
|
||||
- **코드 품질**: SonarQube
|
||||
|
||||
### 테스트 계정
|
||||
```
|
||||
ID: user01
|
||||
Password: Passw0rd
|
||||
```
|
||||
## 3. 프론트엔드 (lifesub-web)
|
||||
|
||||
## 주요 기능
|
||||
로그인/로그아웃
|
||||
총 구독료 조회
|
||||
구독 등급별 이미지 표시
|
||||
나의 구독 서비스 목록
|
||||
지출 패턴 기반 구독 추천
|
||||
카테고리별 구독 서비스 조회
|
||||
구독 서비스 상세 정보
|
||||
구독 신청/취소
|
||||
### 3.1 주요 화면
|
||||
- **로그인 화면**: 사용자 인증
|
||||
- **메인 대시보드**: 월별 구독료 및 구독 서비스 목록, 추천 카테고리 표시
|
||||
- **구독 서비스 목록**: 카테고리별 구독 서비스 브라우징
|
||||
- **구독 상세**: 구독 서비스 상세 정보 및 구독/취소 기능
|
||||
|
||||
## 기술 스택
|
||||
React 18
|
||||
React Router DOM 6
|
||||
Material UI 5
|
||||
Axios
|
||||
Context API
|
||||
### 3.2 API 연동
|
||||
애플리케이션은 다음 백엔드 서비스와 API를 통해 통신합니다:
|
||||
- `MEMBER_URL`: 인증 관련 API
|
||||
- `MYSUB_URL`: 구독 관리 관련 API
|
||||
- `RECOMMEND_URL`: 추천 관련 API
|
||||
|
||||
## 폴더 구조
|
||||
```
|
||||
src/
|
||||
├── components/ # 재사용 가능한 컴포넌트
|
||||
│ ├── auth/ # 인증 관련
|
||||
│ ├── common/ # 공통 컴포넌트
|
||||
│ ├── main/ # 메인 화면
|
||||
│ └── subscriptions/ # 구독 서비스 관련
|
||||
├── contexts/ # Context API
|
||||
├── pages/ # 페이지 컴포넌트
|
||||
├── services/ # API 통신
|
||||
└── utils/ # 유틸리티 함수
|
||||
```
|
||||
## 4. 백엔드 서비스
|
||||
|
||||
## 환경 요구사항
|
||||
Node.js 18 이상
|
||||
npm 9 이상
|
||||
### 4.1 인증 서비스 (Member)
|
||||
회원 로그인 및 로그아웃, JWT 토큰 관리를 담당합니다.
|
||||
|
||||
#### 4.1.1 주요 API
|
||||
- `POST /login`: 로그인
|
||||
- `POST /logout`: 로그아웃
|
||||
|
||||
### 4.2 구독 서비스 (MySub)
|
||||
사용자의 구독 정보 관리 및 카테고리 관리를 담당합니다.
|
||||
|
||||
#### 4.2.1 주요 API
|
||||
- `GET /total-fee`: 총 구독료 조회
|
||||
- `GET /list`: 사용자 구독 목록 조회
|
||||
- `GET /services/{id}`: 구독 서비스 상세 조회
|
||||
- `POST /services/{id}/subscribe`: 구독 신청
|
||||
- `DELETE /services/{id}`: 구독 취소
|
||||
- `GET /categories`: 카테고리 목록 조회
|
||||
- `GET /services`: 카테고리별 서비스 조회
|
||||
|
||||
### 4.3 추천 서비스 (Recommend)
|
||||
사용자의 지출 패턴 기반 구독 서비스를 추천합니다.
|
||||
|
||||
#### 4.3.1 주요 API
|
||||
- `GET /categories`: 추천 카테고리 조회
|
||||
|
||||
## 5. 개발 환경 설정
|
||||
|
||||
### 5.1 필수 요구사항
|
||||
- Java 21 (백엔드)
|
||||
- Node.js 20.x (프론트엔드)
|
||||
- Docker 또는 Podman
|
||||
- kubectl (Kubernetes CLI)
|
||||
- Gradle (백엔드 빌드)
|
||||
|
||||
### 5.2 프론트엔드 개발 환경 설정
|
||||
1. 저장소 클론
|
||||
```bash
|
||||
git clone https://github.com/your-org/lifesub-web.git
|
||||
cd lifesub-web
|
||||
```
|
||||
|
||||
2. 의존성 설치
|
||||
```bash
|
||||
npm install
|
||||
```
|
||||
|
||||
3. 개발 서버 실행
|
||||
```bash
|
||||
npm start
|
||||
```
|
||||
|
||||
4. 환경 설정
|
||||
프로젝트에서는 `public/runtime-env.js` 파일을 통해 런타임 환경 설정을 관리합니다:
|
||||
```javascript
|
||||
window.__runtime_config__ = {
|
||||
MEMBER_URL: 'http://localhost:8081/api/auth',
|
||||
MYSUB_URL: 'http://localhost:8082/api/mysub',
|
||||
RECOMMEND_URL: 'http://localhost:8083/api/recommend'
|
||||
}
|
||||
```
|
||||
|
||||
### 5.3 필요한 백킹 서비스 설치
|
||||
|
||||
#### 5.3.1 PostgreSQL 데이터베이스 설치
|
||||
각 마이크로서비스는 별도의 PostgreSQL 데이터베이스를 사용합니다.
|
||||
|
||||
1. Docker로 설치
|
||||
```bash
|
||||
# Member 서비스용 DB
|
||||
docker run -d --name member-postgres \
|
||||
-e POSTGRES_DB=member \
|
||||
-e POSTGRES_USER=admin \
|
||||
-e POSTGRES_PASSWORD=Passw0rd \
|
||||
-p 5432:5432 \
|
||||
postgres:13.2-alpine
|
||||
|
||||
# MySub 서비스용 DB
|
||||
docker run -d --name mysub-postgres \
|
||||
-e POSTGRES_DB=mysub \
|
||||
-e POSTGRES_USER=admin \
|
||||
-e POSTGRES_PASSWORD=Passw0rd \
|
||||
-p 5433:5432 \
|
||||
postgres:13.2-alpine
|
||||
|
||||
# Recommend 서비스용 DB
|
||||
docker run -d --name recommend-postgres \
|
||||
-e POSTGRES_DB=recommend \
|
||||
-e POSTGRES_USER=admin \
|
||||
-e POSTGRES_PASSWORD=Passw0rd \
|
||||
-p 5434:5432 \
|
||||
postgres:13.2-alpine
|
||||
```
|
||||
|
||||
2. Kubernetes Helm Chart로 설치
|
||||
```bash
|
||||
# Helm 저장소 추가
|
||||
helm repo add bitnami https://charts.bitnami.com/bitnami
|
||||
helm repo update
|
||||
|
||||
# Member 서비스용 DB
|
||||
helm install member bitnami/postgresql \
|
||||
--set global.postgresql.auth.postgresPassword=Passw0rd \
|
||||
--set global.postgresql.auth.username=admin \
|
||||
--set global.postgresql.auth.password=Passw0rd \
|
||||
--set global.postgresql.auth.database=member
|
||||
|
||||
# MySub 서비스용 DB
|
||||
helm install mysub bitnami/postgresql \
|
||||
--set global.postgresql.auth.postgresPassword=Passw0rd \
|
||||
--set global.postgresql.auth.username=admin \
|
||||
--set global.postgresql.auth.password=Passw0rd \
|
||||
--set global.postgresql.auth.database=mysub
|
||||
|
||||
# Recommend 서비스용 DB
|
||||
helm install recommend bitnami/postgresql \
|
||||
--set global.postgresql.auth.postgresPassword=Passw0rd \
|
||||
--set global.postgresql.auth.username=admin \
|
||||
--set global.postgresql.auth.password=Passw0rd \
|
||||
--set global.postgresql.auth.database=recommend
|
||||
```
|
||||
|
||||
#### 5.3.2 Message Queue 설치
|
||||
|
||||
### 5.4 백엔드 개발 환경 설정
|
||||
1. 저장소 클론
|
||||
```bash
|
||||
git clone https://github.com/your-org/lifesub.git
|
||||
cd lifesub
|
||||
```
|
||||
|
||||
2. 의존성 설치 및 각 서비스 개별 빌드
|
||||
```bash
|
||||
# 각 서비스 모듈을 개별적으로 빌드
|
||||
./gradlew :member:build
|
||||
./gradlew :mysub-infra:build
|
||||
./gradlew :recommend:build
|
||||
|
||||
# 또는 테스트 스킵 옵션으로 빌드
|
||||
./gradlew :member:build -x test
|
||||
./gradlew :mysub-infra:build -x test
|
||||
./gradlew :recommend:build -x test
|
||||
```
|
||||
|
||||
3. 각 서비스 실행
|
||||
```bash
|
||||
# Member 서비스 실행
|
||||
java -jar member/build/libs/member.jar
|
||||
|
||||
# MySub 서비스 실행 (mysub-biz는 라이브러리 모듈로 mysub-infra에 포함됨)
|
||||
java -jar mysub-infra/build/libs/mysub.jar
|
||||
|
||||
# Recommend 서비스 실행
|
||||
java -jar recommend/build/libs/recommend.jar
|
||||
```
|
||||
|
||||
4. 환경 설정
|
||||
각 서비스는 `application.yml` 파일에서 설정을 관리합니다. 기본 구성:
|
||||
```yaml
|
||||
server:
|
||||
port: 8081 # 각 서비스별로 다른 포트 사용
|
||||
|
||||
spring:
|
||||
datasource:
|
||||
url: jdbc:postgresql://localhost:5432/member # 각 서비스별 DB 이름 변경 필요
|
||||
username: admin
|
||||
password: Passw0rd
|
||||
|
||||
jwt:
|
||||
secret-key: '8O2HQ13etL2BWZvYOiWsJ5uWFoLi6NBUG8divYVoCgtHVvlk3dqRksMl16toztDUeBTSIuOOPvHIrYq11G2BwQ'
|
||||
access-token-validity: 3600000
|
||||
refresh-token-validity: 86400000
|
||||
|
||||
allowed-origins: http://localhost:3000
|
||||
```
|
||||
|
||||
## 6. 빌드 및 배포
|
||||
|
||||
### 6.1 프론트엔드 빌드 및 배포
|
||||
1. 애플리케이션 빌드
|
||||
```bash
|
||||
npm run build
|
||||
```
|
||||
|
||||
2. 컨테이너 이미지 빌드
|
||||
```bash
|
||||
docker build \
|
||||
--build-arg PROJECT_FOLDER="." \
|
||||
--build-arg REACT_APP_MEMBER_URL="http://api.example.com/member" \
|
||||
--build-arg REACT_APP_MYSUB_URL="http://api.example.com/mysub" \
|
||||
--build-arg REACT_APP_RECOMMEND_URL="http://api.example.com/recommend" \
|
||||
--build-arg BUILD_FOLDER="deployment/container" \
|
||||
--build-arg EXPORT_PORT="18080" \
|
||||
-f deployment/container/Dockerfile-lifesub-web \
|
||||
-t {Image Registry주소}/lifesub/lifesub-web:latest .
|
||||
```
|
||||
|
||||
3. 이미지 푸시
|
||||
```bash
|
||||
docker push {Image Registry주소}/lifesub/lifesub-web:latest
|
||||
```
|
||||
|
||||
4. Kubernetes 배포
|
||||
```bash
|
||||
kubectl apply -f deployment/manifest/
|
||||
```
|
||||
|
||||
### 6.2 백엔드 빌드 및 배포
|
||||
1. 애플리케이션 빌드
|
||||
```bash
|
||||
# 각 서비스 모듈을 개별적으로 빌드
|
||||
./gradlew :member:clean :member:build -x test
|
||||
./gradlew :mysub-infra:clean :mysub-infra:build -x test
|
||||
./gradlew :recommend:clean :recommend:build -x test
|
||||
```
|
||||
|
||||
2. 컨테이너 이미지 빌드 (각 서비스별로 수행)
|
||||
```bash
|
||||
# Member 서비스
|
||||
docker build \
|
||||
--build-arg BUILD_LIB_DIR="member/build/libs" \
|
||||
--build-arg ARTIFACTORY_FILE="member.jar" \
|
||||
-f deployment/Dockerfile \
|
||||
-t {Image Registry주소}/lifesub/member:latest .
|
||||
|
||||
# MySub 서비스
|
||||
docker build \
|
||||
--build-arg BUILD_LIB_DIR="mysub-infra/build/libs" \
|
||||
--build-arg ARTIFACTORY_FILE="mysub.jar" \
|
||||
-f deployment/Dockerfile \
|
||||
-t {Image Registry주소}/lifesub/mysub:latest .
|
||||
|
||||
# Recommend 서비스
|
||||
docker build \
|
||||
--build-arg BUILD_LIB_DIR="recommend/build/libs" \
|
||||
--build-arg ARTIFACTORY_FILE="recommend.jar" \
|
||||
-f deployment/Dockerfile \
|
||||
-t {Image Registry주소}/lifesub/recommend:latest .
|
||||
```
|
||||
|
||||
3. 이미지 푸시
|
||||
```bash
|
||||
docker push {Image Registry주소}/lifesub/member:latest
|
||||
docker push {Image Registry주소}/lifesub/mysub:latest
|
||||
docker push {Image Registry주소}/lifesub/recommend:latest
|
||||
```
|
||||
|
||||
4. Kubernetes 배포
|
||||
```bash
|
||||
kubectl apply -f deployment/manifest/
|
||||
```
|
||||
|
||||
## 7. 팀
|
||||
|
||||
- 오유진 "피오" - Product Owner
|
||||
- 강동훈 "테키" - Tech Lead
|
||||
- 김민지 "유엑스" - UX Designer
|
||||
- 이준혁 "백개" - Backend Developer
|
||||
- 박소연 "프개" - Frontend Developer
|
||||
- 최진우 "큐에이" - QA Engineer
|
||||
- 정해린 "데브옵스" - DevOps Engineer
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user