Feat: FE dev 환경 세팅을 위한 cicd 및 환경변수 수정

pwc2002 · pwc2002 · commit 1dad8f87b2fd · 2025-09-02T03:56:28.000+09:00
diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
@@ -4,7 +4,7 @@ permissions:
 
 on:
   push:
-    branches: [ develop ]
+    branches: [ develop, main ]
     tags: [ 'development-**' ]
   workflow_dispatch:
 
@@ -16,7 +16,6 @@ jobs:
   deploy:
     runs-on: ubuntu-latest
     env:
-      NEXT_PUBLIC_BASE_API_URL: ${{ secrets.NEXT_PUBLIC_BASE_API_URL }}
       NEXT_PUBLIC_GOOGLE_REDIRECT_CLIENT_ID: ${{ secrets.NEXT_PUBLIC_GOOGLE_REDIRECT_CLIENT_ID }}
       NEXT_PUBLIC_GOOGLE_REDIRECT_URI: ${{ secrets.NEXT_PUBLIC_GOOGLE_REDIRECT_URI }}
 
@@ -30,6 +29,20 @@ jobs:
           node-version: '20'
           cache: 'yarn'       # yarn.lock 기반 자동 캐시
 
+      - name: Set env for develop
+        if: github.ref == 'refs/heads/develop'
+        run: |
+          echo "TARGET_BUCKET=${{ secrets.AWS_S3_BUCKET_DEV }}" >> $GITHUB_ENV
+          echo "NEXT_PUBLIC_APP_ENV=dev" >> $GITHUB_ENV
+          echo "NEXT_PUBLIC_BASE_API_URL=${{ secrets.NEXT_PUBLIC_BASE_API_URL_DEV }}" >> $GITHUB_ENV
+
+      - name: Set env for main
+        if: github.ref == 'refs/heads/main'
+        run: |
+          echo "TARGET_BUCKET=${{ secrets.AWS_S3_BUCKET }}" >> $GITHUB_ENV
+          echo "NEXT_PUBLIC_APP_ENV=production" >> $GITHUB_ENV
+          echo "NEXT_PUBLIC_BASE_API_URL=${{ secrets.NEXT_PUBLIC_BASE_API_URL }}" >> $GITHUB_ENV
+
       - name: Install dependencies
         run: yarn install --frozen-lockfile
 
@@ -47,22 +60,22 @@ jobs:
       # 프로젝트에 맞게 include/exclude 패턴 조정
       - name: Upload static assets (long cache)
         run: |
-          aws s3 cp ./out s3://${{ secrets.AWS_S3_BUCKET }} \
+          aws s3 cp ./out s3://$TARGET_BUCKET \
             --recursive \
             --exclude "*" \
             --include "_next/**" --include "static/**" --include "assets/**" \
             --cache-control "public, max-age=31536000, immutable" \
             --metadata-directive REPLACE
       - name: Upload html (no cache)
         run: |
-          aws s3 cp ./out s3://${{ secrets.AWS_S3_BUCKET }} \
+          aws s3 cp ./out s3://$TARGET_BUCKET \
             --recursive \
             --exclude "_next/*" --exclude "static/*" --exclude "assets/*" \
             --cache-control "no-cache" \
             --metadata-directive REPLACE
       # (단순화 원하면 기존 sync 한 줄 유지 가능)
       # - name: Deploy to S3
-      #   run: aws s3 sync ./out s3://${{ secrets.AWS_S3_BUCKET }} --delete
+      #   run: aws s3 sync ./out s3://$TARGET_BUCKET --delete
 
       - name: Invalidate CloudFront Cache
         run: |
diff --git a/src/app/layout.js b/src/app/layout.js
@@ -4,6 +4,7 @@ import { ErrorBoundary } from "react-error-boundary";
 import localFont from "next/font/local";
 import Script from 'next/script';
 import { NextUIProvider } from "@nextui-org/react";
+import DevHeader from "@/components/ui/common/DevHeader";
 
 // components
 import Loading from "@/app/loading";
@@ -128,6 +129,7 @@ export default function RootLayout({ children }) {
         />
       </head>
       <body className={`${pretendard.className} antialiased`}>
+      {((process.env.NEXT_PUBLIC_APP_ENV ?? process.env.NODE_ENV) !== 'production') && <DevHeader />}
         <NextUIProvider>
           <ErrorBoundary fallback={<Error />}>
             <AuthProvider>
diff --git a/src/components/ui/common/DevHeader.jsx b/src/components/ui/common/DevHeader.jsx
@@ -0,0 +1,13 @@
+import React from 'react'
+
+export default function DevHeader() {
+  return (
+    <>
+        <div className="fixed top-0 left-0 w-full h-8 bg-transparent text-red-500" style={{zIndex: 999999}}>
+            <div className="flex justify-between items-center">
+                <div className="text-2xl font-bold">Dev 서버입니다</div>
+            </div>
+        </div>
+    </>
+  )
+}
diff --git a/yarn.lock b/yarn.lock
