Files
AutonetSellCar/DEPLOYMENT_GUIDE.md
AutonetSellCar Deploy 1f0dcb1ddb Initial commit: AutonetSellCar platform with deployment system
- Frontend: Next.js 14 with TypeScript
- Backend: FastAPI with SQLAlchemy
- Agent: Carmodoo sync agent
- Deployment: Docker Compose based staging/production setup
- Scripts: Automated deployment with rollback support

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2025-12-30 13:24:39 +09:00

7.9 KiB

사이트 배포 가이드

개요

이 문서는 Next.js Frontend + FastAPI Backend 사이트를 Ubuntu 서버에 배포하는 전체 과정을 설명합니다.


배포 순서도

┌─────────────────────────────────────────────────────────────────────────────┐
│                         사이트 배포 전체 흐름                                │
└─────────────────────────────────────────────────────────────────────────────┘

1. 사전 준비
   │
   ├─→ DNS 설정 (도메인 → 공인 IP)
   │     ├─ example.com → 59.14.158.123
   │     ├─ www.example.com → 59.14.158.123
   │     └─ api.example.com → 59.14.158.123  ★ 중요: API 서브도메인 필수
   │
   ├─→ 공유기 포트포워딩
   │     ├─ 80 → 192.168.0.201:80 (NPM)
   │     └─ 443 → 192.168.0.201:443 (NPM)
   │
   └─→ 서버 준비
         ├─ Docker 설치
         ├─ Node.js 설치
         └─ Python 설치

2. 소스코드 전송
   │
   ├─→ 압축 (node_modules 제외)
   │     └─ 7z a -tzip project.zip frontend backend -xr!node_modules
   │
   ├─→ 전송 (내부망 경유 권장)
   │     └─ scp project.zip damon@192.168.0.203:~/sites/project/
   │
   └─→ 압축 해제
         └─ unzip project.zip

3. Backend 배포
   │
   ├─→ 가상환경 생성
   │     └─ python3 -m venv venv && source venv/bin/activate
   │
   ├─→ 의존성 설치
   │     └─ pip install -r requirements.txt
   │
   ├─→ ★★★ CORS 설정 수정 ★★★
   │     └─ config.py의 CORS_ORIGINS에 도메인 추가
   │         - http://example.com
   │         - https://example.com
   │         - http://www.example.com
   │         - https://www.example.com
   │
   ├─→ Admin 계정 생성/리셋
   │     └─ python init_admin.py 또는 reset_pw.py 실행
   │
   └─→ 서버 실행
         └─ nohup uvicorn app.main:app --host 0.0.0.0 --port 8001 > ~/logs/backend.log 2>&1 &

4. Frontend 배포
   │
   ├─→ 의존성 설치
   │     └─ npm install
   │
   ├─→ ★★★ 환경변수 설정 ★★★
   │     └─ echo "NEXT_PUBLIC_API_URL=http://api.example.com/api" > .env.local
   │
   ├─→ 빌드
   │     └─ npm run build
   │
   └─→ 서버 실행
         └─ nohup sh -c 'PORT=3001 npm start' > ~/logs/frontend.log 2>&1 &

5. NPM (Nginx Proxy Manager) 설정
   │
   ├─→ Frontend Proxy Host
   │     ├─ Domain: example.com, www.example.com
   │     ├─ Forward: 192.168.0.203:3001
   │     └─ SSL: Let's Encrypt
   │
   └─→ ★★★ API Proxy Host ★★★
         ├─ Domain: api.example.com
         ├─ Forward: 192.168.0.203:8001
         └─ SSL: Let's Encrypt

6. 테스트
   │
   ├─→ 사이트 접속: http://example.com
   ├─→ API 접속: http://api.example.com/api/health
   └─→ Admin 로그인: http://example.com/admin/login

핵심 체크리스트

배포 전 필수 확인 사항

  • DNS에 api 서브도메인 A 레코드 추가했는가?
  • NPM에 api.도메인 프록시 설정했는가?
  • Backend CORS_ORIGINS에 도메인 추가했는가?
  • Frontend .env.local에 API URL 설정했는가?
  • Admin 계정이 DB에 존재하는가?

자주 발생하는 문제와 해결법

1. 사이트 로딩만 계속됨 (뱅글뱅글)

원인: Frontend가 API에 연결하지 못함

확인 순서:

# 1. Backend 실행 확인
ps aux | grep uvicorn

# 2. API 직접 테스트
curl http://api.example.com/api/health

# 3. .env.local 확인
cat ~/sites/project/frontend/.env.local

# 4. 빌드에 환경변수 적용 확인
grep -r "api.example" ~/sites/project/frontend/.next/ | head -3

해결:

# .env.local 설정 후 재빌드
echo "NEXT_PUBLIC_API_URL=http://api.example.com/api" > .env.local
rm -rf .next
npm run build

2. CORS 에러

원인: Backend에서 Frontend 도메인을 허용하지 않음

증상: 브라우저 Network 탭에서 "CORS error" 표시

확인:

cat ~/sites/project/backend/app/core/config.py | grep CORS

해결: config.py의 CORS_ORIGINS에 도메인 추가

CORS_ORIGINS: list = [
    "http://localhost:3000",
    "http://example.com",
    "https://example.com",
    "http://www.example.com",
    "https://www.example.com"
]

Backend 재시작:

pkill -f uvicorn
nohup uvicorn app.main:app --host 0.0.0.0 --port 8001 > ~/logs/backend.log 2>&1 &

3. 로그인 안 됨

원인: DB에 admin 계정이 없거나 비밀번호가 다름

확인:

# API 직접 테스트
curl -X POST "http://api.example.com/api/auth/login" \
  -H "Content-Type: application/json" \
  -d '{"username":"admin","password":"비밀번호"}'

해결: 비밀번호 리셋 스크립트 실행

cd ~/sites/project/backend
source venv/bin/activate
cat > reset_pw.py << 'EOF'
from app.core.database import SessionLocal
from app.models.admin import Admin
from app.core.security import get_password_hash
db = SessionLocal()
admin = db.query(Admin).filter(Admin.username == 'admin').first()
if admin:
    admin.password_hash = get_password_hash('새비밀번호')
    db.commit()
    print('Password reset')
else:
    print('Admin not found')
db.close()
EOF
python reset_pw.py

4. 포트 충돌 (EADDRINUSE)

원인: 기존 프로세스가 포트를 점유 중

확인:

sudo netstat -tlnp | grep 3001
sudo netstat -tlnp | grep 8001

해결:

# PID 확인 후 종료
sudo kill -9 <PID>

# 또는 프로세스 이름으로 종료
pkill -f "npm start"
pkill -f uvicorn

5. 500 Internal Server Error (정적 파일)

원인: 빌드 파일 손상 또는 캐시 문제

해결:

cd ~/sites/project/frontend
pkill -f "npm start"
rm -rf .next
rm -rf node_modules/.cache
npm run build
nohup sh -c 'PORT=3001 npm start' > ~/logs/frontend.log 2>&1 &

유용한 명령어 모음

프로세스 관리

# 프로세스 확인
ps aux | grep -E "npm|uvicorn|node"

# 포트 사용 확인
sudo netstat -tlnp | grep -E "3001|8001"

# 로그 확인
tail -f ~/logs/frontend.log
tail -f ~/logs/backend.log

서비스 재시작

# Frontend 재시작
pkill -f "npm start"
cd ~/sites/project/frontend
nohup sh -c 'PORT=3001 npm start' > ~/logs/frontend.log 2>&1 &

# Backend 재시작
pkill -f uvicorn
cd ~/sites/project/backend
source venv/bin/activate
nohup uvicorn app.main:app --host 0.0.0.0 --port 8001 > ~/logs/backend.log 2>&1 &

API 테스트

# Health check
curl http://api.example.com/api/health

# 로그인 테스트
curl -X POST "http://api.example.com/api/auth/login" \
  -H "Content-Type: application/json" \
  -d '{"username":"admin","password":"password"}'

서버 정보

네트워크 구성

서버 내부 IP 역할
Server1 192.168.0.201 NPM, PostgreSQL, Redis, 모니터링
Server2 192.168.0.202 MongolCar (autonetsellcar.com)
Server3 192.168.0.203 Grantech, Cylinx
Server4 192.168.0.204 Windows PC (파일 전송 중계)

외부 접속

포트 용도
80, 443 NPM (웹 서비스)
81 NPM 관리 페이지
201, 202, 203 SSH (각 서버)

도메인

도메인 서비스
autonetsellcar.com MongolCar
grantech.kr Grantech
api.grantech.kr Grantech API
cylinx.kr Cylinx (예정)

버전 정보

  • Node.js: 20.x
  • Python: 3.10
  • Next.js: 16.x
  • FastAPI: Latest
  • Ubuntu: 22.04

최종 업데이트: 2025-12-05