개발/React

GCP Appengine 배포 방법

hr0513 2026. 1. 11. 15:05
728x90
반응형

안녕하세요. hr0513입니다!
오늘은 GCP Appengine 배포 방법에 대해 작성하려고 합니다.

 

1. Google Cloud SDK 설치

# Google Cloude SDK 설치
brew install --cask google-cloud-sdk

# 설치 확인
gcloud --version

# 구글 계정 로그인
gcloud auth login

 

2. 프로젝트 설정

# 현재 GCP 프로젝트 서렂ㅇ
gcloud config set project <PROJECT_ID>

# 현재 로그인된 계정이 접근 가능한 프로젝트 목록 보기
gcloud project list

PROJECT_ID 는 GCP 콘솔에서 확인 가능합니다.

 

3. app.yaml 파일 생성

runtime: nodejs20

service: frontend

# 자동 스케일링 지정
automatic_scaling:
  max_instances: 5
  min_instances: 0

# 환경변수 설정
env_variables:
  # 환경 설정
  NODE_ENV: 'production'

# 정적 파일 핸들러
handlers:
  # assets 폴더의 정적 파일들
  - url: /assets
    static_dir: dist/assets
    expiration: 1d
    secure: always

  # 기타 정적 파일들 (favicon 등)
  - url: /(.*\.(js|css|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot|webp))
    static_files: dist/\1
    upload: dist/.*\.(js|css|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot|webp)$
    expiration: 1d
    secure: always

  # SPA 라우팅을 위한 fallback
  - url: /.*
    static_files: dist/index.html
    upload: dist/index.html
    secure: always

 

 

4. .gcloudeignore 파일 생성

node_modules/
.git
.gitignore
*.md
public/
.env.local
.env.development

 

5. App Engine 상태 확인

# 현재 App Engine 설정 및 배포 상태 확인
gcloud app describe

 

6. 빌드 및 배포

# 의존성 설치
yarn install

# 프로덕션 빌드
yarn build

# dist 폴더가 생성되었는지 확인
ls -la dist/

# 배포
gcloud app deploy app.yaml --project=<PROJECT_NAME>

 

7. 배포 확인

# 배포된 서비스 확인
gcloud app services list

# 브라우저로 열기
gcloud app browse --service=frontend

# 로그 확인
gcloud app logs tail -s frontend

도움이 되셨길 바라며, 글을 마칩니다.

728x90
반응형