merge: admin 배포 자동화 스크립트 작성 #457

[FEAT] admin 배포 자동화 스크립트 작성 (#458)
woowacourse-teams · Jan 12, 2025 · 25ad030 · 25ad030
2 parents 22c403a + 7b3d4bf
commit 25ad030
Show file tree

Hide file tree

Showing 7 changed files with 102 additions and 4 deletions.
diff --git a/.github/workflows/fe-cd-admin.yml b/.github/workflows/fe-cd-admin.yml
@@ -0,0 +1,49 @@
+name: FE Deploy for admin
+
+on:
+  push:
+    branches: ["main", "develop"]
+    paths:
+      - "frontend-admin/**"
+
+jobs:
+  build-and-test:
+    runs-on: ubuntu-latest
+
+    defaults:
+      run:
+        working-directory: ./frontend-admin
+
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Use Node.js
+        uses: actions/setup-node@v4
+
+      - name: Generate .env File
+        working-directory: ./frontend-admin
+        run: |
+          echo "VITE_API_BASE_URL=${{ secrets.API_BASE_URL_PROD }}" >> .env
+
+      - name: Install Dependencies
+        run: npm install
+        working-directory: ./frontend-admin
+
+      - name: Build
+        run: npm run build
+        working-directory: ./frontend-admin
+
+      - name: Configure AWS CLI
+        run: |
+          aws configure set aws_access_key_id ${{ secrets.AWS_ACCESS_KEY_ID }}
+          aws configure set aws_secret_access_key ${{ secrets.AWS_SECRET_ACCESS_KEY }}
+          aws configure set default.region ${{ secrets.AWS_REGION }}
+
+      - name: Upload to S3 (Admin)
+        working-directory: ./frontend-admin/dist
+        run: |
+          aws s3 sync . s3://${{ secrets.AWS_S3_BUCKET_ADMIN }} --delete
+
+      - name: Invalidate CloudFront Cache (Admin)
+        run: |
+          aws cloudfront create-invalidation --distribution-id ${{ secrets.AWS_CLOUDFRONT_DISTRIBUTION_ID_ADMIN }} --paths "/*"
diff --git a/.github/workflows/fe-ci-admin.yml b/.github/workflows/fe-ci-admin.yml
@@ -0,0 +1,30 @@
+name: FE Build for admin
+
+on:
+  pull_request:
+    branches:
+      - develop
+    paths:
+      - "frontend-admin/**"
+
+jobs:
+  build-and-test:
+    runs-on: ubuntu-latest
+
+    defaults:
+      run:
+        working-directory: ./frontend-admin
+
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Use Node.js
+        uses: actions/setup-node@v4
+
+      - name: Install Dependencies
+        run: npm install
+        working-directory: ./frontend-admin
+
+      - name: Build
+        run: npm run build
+        working-directory: ./frontend-admin
diff --git a/frontend-admin/index.html b/frontend-admin/index.html
@@ -1,10 +1,23 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
     <link rel="icon" type="image/svg+xml" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>땅콩 admin</title>
+    <link rel="preconnect" href="https://cdn.jsdelivr.net" />
+    <link
+      rel="preload"
+      as="style"
+      crossorigin
+      href="https://cdn.jsdelivr.net/gh/orioncactus/[email protected]/dist/web/static/pretendard-dynamic-subset.min.css"
+    />
+    <link
+      rel="stylesheet"
+      as="style"
+      crossorigin
+      href="https://cdn.jsdelivr.net/gh/orioncactus/[email protected]/dist/web/static/pretendard-dynamic-subset.min.css"
+    />
   </head>
   <body>
     <div id="root"></div>

diff --git a/frontend-admin/src/apis/fetcher.ts b/frontend-admin/src/apis/fetcher.ts
@@ -8,7 +8,10 @@ interface RequestProps {
 type FetchProps = Omit<RequestProps, 'method'>;
 
 const fetcher = {
-  async request(url: string, { method, body, headers, auth = true }: RequestProps) {
+  async request(
+    url: string,
+    { method, body, headers = { 'Content-Type': 'application/json' }, auth = true }: RequestProps,
+  ) {
     try {
       const response = await fetch(url, {
         method,

diff --git a/frontend-admin/src/constants/url.ts b/frontend-admin/src/constants/url.ts
@@ -8,7 +8,7 @@ export const API_URL = {
   contents: `${BASE_URL}/api/admin/balances/contents`,
   options: `${BASE_URL}/api/admin/balances/options`,
   deleteContent: (contentId: number) => `${BASE_URL}/api/admin/balances/contents/${contentId}`,
-  categoryList: `${BASE_URL}/api/admin/balances/categories`,
+  categoryList: `${BASE_URL}/api/balances/categories`,
 };
 
 export const MOCK_API_URL = {
@@ -18,5 +18,5 @@ export const MOCK_API_URL = {
   contents: `${BASE_URL}/api/admin/balances/contents`,
   options: `${BASE_URL}/api/admin/balances/options`,
   deleteContent: `${BASE_URL}/api/admin/balances/contents/:contentId`,
-  categoryList: `${BASE_URL}/api/admin/balances/categories`,
+  categoryList: `${BASE_URL}/api/balances/categories`,
 };
diff --git a/frontend-admin/src/styles/GlobalStyle.ts → frontend-admin/src/styles/globalStyle.ts b/frontend-admin/src/styles/GlobalStyle.ts → frontend-admin/src/styles/globalStyle.ts
diff --git a/frontend-admin/vite.config.ts b/frontend-admin/vite.config.ts
@@ -3,6 +3,9 @@ import react from '@vitejs/plugin-react';
 
 // https://vite.dev/config/
 export default defineConfig({
+  server: {
+    port: 3000,
+  },
   plugins: [
     react({
       jsxImportSource: '@emotion/react',