feat: FE 미리보기 배포 기능 추가 #112

.github/workflows/deploy-fe-preview.yml

@@ -0,0 +1,47 @@
+name: Deploy Frontend Preview
+
+on:
+  push:
+    branches:
+      - develop
+    paths:
+      - "frontend/**"
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      - name: Check if commit message contains 'preview'
+        id: check_commit
+        run: |
+          if [[ "${{ github.event.head_commit.message }}" == *"preview"* ]]; then
+            echo "Commit message contains 'preview'"
+            echo "deploy=true" >> $GITHUB_ENV
+          else
+            echo "Commit message does not contain 'preview'"
+            echo "deploy=false" >> $GITHUB_ENV
+          fi
+
+      - name: Build React App
+        if: env.deploy == 'true'
+        env:
+          VITE_AXIOS_PROD_BASE_URL: ${{ secrets.VITE_AXIOS_PROD_BASE_URL }}
+          VITE_GOOGLE_MAPS_API_KEY: ${{ secrets.VITE_GOOGLE_MAPS_API_KEY }}
+          VITE_GOOGLE_MAPS_ID: ${{ secrets.VITE_GOOGLE_MAPS_ID }}
+        run: |
+          cd ${{ github.workspace }}/frontend
+          yarn install
+          yarn build
+
+      - name: Deploy to Nginx Server
+        if: env.deploy == 'true'
+        uses: appleboy/scp-action@master
+        with:
+          host: ${{ secrets.NCP_SERVER_HOST }}
+          username: ${{ secrets.NCP_SERVER_USER }}
+          key: ${{ secrets.SSH_PRIVATE_KEY }}
+          source: "frontend/dist/*"
+          target: "/usr/share/nginx/html/preview"

backend/resources/nginx.conf

@@ -18,41 +18,24 @@ http {
         listen 443 ssl;
         server_name dailyroad.site www.dailyroad.site;
 
-        ssl_certificate /etc/letsencrypt/live/dailyroad.site/fullchain.pem;
-        ssl_certificate_key /etc/letsencrypt/live/dailyroad.site/privkey.pem;
+        ssl_certificate /etc/letsencrypt/live/dailyroad.site-0001/fullchain.pem;
+        ssl_certificate_key /etc/letsencrypt/live/dailyroad.site-0001/privkey.pem;
 
         ssl_protocols TLSv1.2 TLSv1.3;
         ssl_ciphers HIGH:!aNULL:!MD5;
 
         location / {
             try_files $uri $uri/ /index.html =404;
         }
-
-        # NestJS API 요청 처리 (추후논의)
-        location /api/ {
-            rewrite ^/api/(.*) /$1 break;
-            proxy_pass http://localhost:8080;
-
-            proxy_set_header Host $host;
-            proxy_set_header X-Real-IP $remote_addr;
-            proxy_set_header X-Forwarded-Prefix /api;
-            proxy_set_header X-Forwarded-Host $http_x_forwarded_host;
-            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
-            proxy_set_header X-NginX-Proxy true;
-            proxy_set_header X-Forwarded-Proto $scheme;
-
-            proxy_pass_request_body on;
-            proxy_method $request_method;
-        }
     }
 
     # API 서브도메인
     server {
         listen 443 ssl;
         server_name api.dailyroad.site;
 
-        ssl_certificate /etc/letsencrypt/live/dailyroad.site/fullchain.pem;
-        ssl_certificate_key /etc/letsencrypt/live/dailyroad.site/privkey.pem;
+        ssl_certificate /etc/letsencrypt/live/dailyroad.site-0001/fullchain.pem;
+        ssl_certificate_key /etc/letsencrypt/live/dailyroad.site-0001/privkey.pem;
 
         ssl_protocols TLSv1.2 TLSv1.3;
         ssl_ciphers HIGH:!aNULL:!MD5;
@@ -88,4 +71,22 @@ http {
             proxy_set_header X-Forwarded-Proto $scheme;
         }
     }
+
+    # Preview 서브도메인
+    server {
+        listen 443 ssl;
+        server_name preview.dailyroad.site;
+
+        root /usr/share/nginx/html/preview/frontend/dist;
+
+        ssl_certificate /etc/letsencrypt/live/dailyroad.site-0001/fullchain.pem;
+        ssl_certificate_key /etc/letsencrypt/live/dailyroad.site-0001/privkey.pem;
+
+        ssl_protocols TLSv1.2 TLSv1.3;
+        ssl_ciphers HIGH:!aNULL:!MD5;
+
+        location / {
+            try_files $uri $uri/ /index.html =404;
+        }
+    }
 }