[FE] 스프린트 2 개발 산출물

softeer5th · Feb 7, 2025 · 1aec36c · 1aec36c
2 parents 2bcd7eb + b25408b
commit 1aec36c
Show file tree

Hide file tree

Showing 149 changed files with 10,386 additions and 460 deletions.
diff --git a/.DS_Store b/.DS_Store
diff --git a/.github/.DS_Store b/.github/.DS_Store
diff --git a/.github/workflows/fe-admin-deploy.yml b/.github/workflows/fe-admin-deploy.yml
@@ -0,0 +1,66 @@
+name: FE ADMIN CI / CD
+
+on:
+    push:
+        branches:
+            - fe
+
+jobs:
+    CI:
+        runs-on: ubuntu-latest
+
+        env:
+            GCP_PROJECT_ID: ${{ secrets.GCP_PROJECT_ID }}
+            IMAGE_NAME: uniro-backoffice
+            IMAGE_TAG: ${{ github.sha }}
+
+        steps:
+            - name: 코드 체크아웃
+              uses: actions/checkout@v4
+
+            - name: Google Cloud SDK 설정
+              uses: "google-github-actions/auth@v2"
+              with:
+                  credentials_json: ${{ secrets.GCP_SA_KEY }}
+
+            - name: Docker를 위한 gcloud 인증 설정
+              run: gcloud auth configure-docker --quiet
+
+            - name: Create .env from secret
+              run: |
+                  echo "${{ secrets.FE_ENV }}" > uniro_admin_frontend/.env
+
+            - name: Docker 이미지 빌드 및 푸시
+              run: |
+                  docker build -t gcr.io/${{ env.GCP_PROJECT_ID }}/${{ env.IMAGE_NAME }}:${{ env.IMAGE_TAG }} -f uniro_admin_frontend/Dockerfile .
+                  docker push gcr.io/${{ env.GCP_PROJECT_ID }}/${{ env.IMAGE_NAME }}:${{ env.IMAGE_TAG }}
+
+    CD:
+        runs-on: ubuntu-latest
+        needs: CI
+
+        env:
+            GCP_PROJECT_ID: ${{ secrets.GCP_PROJECT_ID }}
+            IMAGE_NAME: uniro-backoffice
+            IMAGE_TAG: ${{ github.sha }}
+            DEPLOY_PATH: ${{ secrets.DEPLOY_SERVER_PATH }}
+
+        steps:
+            - name: 배포 서버에 SSH로 연결하여 배포
+              uses: appleboy/[email protected]
+              with:
+                  host: ${{ secrets.DEPLOY_SERVER_HOST }}
+                  username: ${{ secrets.DEPLOY_SERVER_USER }}
+                  key: ${{ secrets.DEPLOY_SSH_KEY }}
+                  envs: GCP_PROJECT_ID, IMAGE_NAME, IMAGE_TAG, DEPLOY_PATH, TEST
+                  script: |
+                      cd ${DEPLOY_PATH}
+                      sudo docker ps -a --format '{{.ID}} {{.Names}}' \
+                          | egrep -v 'nginx-container|uniro-fe' \
+                          | awk '{print $1}' \
+                          | xargs -r sudo docker stop || true
+                      sudo docker rm $(sudo docker ps -a -q) || true
+                      sudo docker login -u _json_key --password-stdin https://gcr.io <<< '${{ secrets.GCP_SA_KEY }}'
+                      sudo docker pull gcr.io/${GCP_PROJECT_ID}/${IMAGE_NAME}:${IMAGE_TAG}
+                      sudo docker run -d --name ${IMAGE_NAME} -p 3001:3000 gcr.io/${GCP_PROJECT_ID}/${IMAGE_NAME}:${IMAGE_TAG}
+                      sudo docker network connect nginx_app-network ${IMAGE_NAME}
diff --git a/.github/workflows/fe-deploy.yml b/.github/workflows/fe-deploy.yml
@@ -1,66 +1,66 @@
 name: FE CI / CD
 
 on:
-  push:
-    branches:
-      - fe
+    push:
+        branches:
+            - fe
 
 jobs:
-  CI:
-    runs-on: ubuntu-latest
+    CI:
+        runs-on: ubuntu-latest
 
-    env:
-      GCP_PROJECT_ID: ${{ secrets.GCP_PROJECT_ID }}
-      IMAGE_NAME: uniro-fe
-      IMAGE_TAG: ${{ github.sha }}
+        env:
+            GCP_PROJECT_ID: ${{ secrets.GCP_PROJECT_ID }}
+            IMAGE_NAME: uniro-fe
+            IMAGE_TAG: ${{ github.sha }}
 
-    steps:
-      - name: 코드 체크아웃
-        uses: actions/checkout@v4
+        steps:
+            - name: 코드 체크아웃
+              uses: actions/checkout@v4
 
-      - name: Google Cloud SDK 설정
-        uses: "google-github-actions/auth@v2"
-        with:
-          credentials_json: ${{ secrets.GCP_SA_KEY }}
+            - name: Google Cloud SDK 설정
+              uses: "google-github-actions/auth@v2"
+              with:
+                  credentials_json: ${{ secrets.GCP_SA_KEY }}
 
-      - name: Docker를 위한 gcloud 인증 설정
-        run: gcloud auth configure-docker --quiet
+            - name: Docker를 위한 gcloud 인증 설정
+              run: gcloud auth configure-docker --quiet
 
-      - name: Create .env from secret
-        run: |
-          echo "${{ secrets.FE_ENV }}" > uniro_frontend/.env
+            - name: Create .env from secret
+              run: |
+                  echo "${{ secrets.FE_ENV }}" > uniro_frontend/.env
 
-      - name: Docker 이미지 빌드 및 푸시
-        run: |
-          docker build -t gcr.io/${{ env.GCP_PROJECT_ID }}/${{ env.IMAGE_NAME }}:${{ env.IMAGE_TAG }} -f uniro_frontend/Dockerfile .
-          docker push gcr.io/${{ env.GCP_PROJECT_ID }}/${{ env.IMAGE_NAME }}:${{ env.IMAGE_TAG }}
+            - name: Docker 이미지 빌드 및 푸시
+              run: |
+                  docker build -t gcr.io/${{ env.GCP_PROJECT_ID }}/${{ env.IMAGE_NAME }}:${{ env.IMAGE_TAG }} -f uniro_frontend/Dockerfile .
+                  docker push gcr.io/${{ env.GCP_PROJECT_ID }}/${{ env.IMAGE_NAME }}:${{ env.IMAGE_TAG }}
 
-  CD:
-    runs-on: ubuntu-latest
-    needs: CI
+    CD:
+        runs-on: ubuntu-latest
+        needs: CI
 
-    env:
-      GCP_PROJECT_ID: ${{ secrets.GCP_PROJECT_ID }}
-      IMAGE_NAME: uniro-fe
-      IMAGE_TAG: ${{ github.sha }}
-      DEPLOY_PATH: ${{ secrets.DEPLOY_SERVER_PATH }}
+        env:
+            GCP_PROJECT_ID: ${{ secrets.GCP_PROJECT_ID }}
+            IMAGE_NAME: uniro-fe
+            IMAGE_TAG: ${{ github.sha }}
+            DEPLOY_PATH: ${{ secrets.DEPLOY_SERVER_PATH }}
 
-    steps:
-      - name: 배포 서버에 SSH로 연결하여 배포
-        uses: appleboy/[email protected]
-        with:
-          host: ${{ secrets.DEPLOY_SERVER_HOST }}
-          username: ${{ secrets.DEPLOY_SERVER_USER }}
-          key: ${{ secrets.DEPLOY_SSH_KEY }}
-          envs: GCP_PROJECT_ID, IMAGE_NAME, IMAGE_TAG, DEPLOY_PATH, TEST
-          script: |
-            cd ${DEPLOY_PATH}
-            sudo docker ps -a --format '{{.ID}} {{.Names}}' \
-                | grep -v 'nginx-container' \
-                | awk '{print $1}' \
-                | xargs -r sudo docker stop || true
-            sudo docker rm $(sudo docker ps -a -q) || true
-            sudo docker login -u _json_key --password-stdin https://gcr.io <<< '${{ secrets.GCP_SA_KEY }}'
-            sudo docker pull gcr.io/${GCP_PROJECT_ID}/${IMAGE_NAME}:${IMAGE_TAG}
-            sudo docker run -d --name ${IMAGE_NAME} -p 3000:3000 gcr.io/${GCP_PROJECT_ID}/${IMAGE_NAME}:${IMAGE_TAG}
-            sudo docker network connect nginx_app-network ${IMAGE_NAME}
+        steps:
+            - name: 배포 서버에 SSH로 연결하여 배포
+              uses: appleboy/[email protected]
+              with:
+                  host: ${{ secrets.DEPLOY_SERVER_HOST }}
+                  username: ${{ secrets.DEPLOY_SERVER_USER }}
+                  key: ${{ secrets.DEPLOY_SSH_KEY }}
+                  envs: GCP_PROJECT_ID, IMAGE_NAME, IMAGE_TAG, DEPLOY_PATH, TEST
+                  script: |
+                      cd ${DEPLOY_PATH}
+                      sudo docker ps -a --format '{{.ID}} {{.Names}}' \
+                          | egrep -v 'nginx-container|uniro-backoffice' \
+                          | awk '{print $1}' \
+                          | xargs -r sudo docker stop || true
+                      sudo docker rm $(sudo docker ps -a -q) || true
+                      sudo docker login -u _json_key --password-stdin https://gcr.io <<< '${{ secrets.GCP_SA_KEY }}'
+                      sudo docker pull gcr.io/${GCP_PROJECT_ID}/${IMAGE_NAME}:${IMAGE_TAG}
+                      sudo docker run -d --name ${IMAGE_NAME} -p 3000:3000 gcr.io/${GCP_PROJECT_ID}/${IMAGE_NAME}:${IMAGE_TAG}
+                      sudo docker network connect nginx_app-network ${IMAGE_NAME}
diff --git a/uniro_admin_frontend/.gitignore b/uniro_admin_frontend/.gitignore
@@ -0,0 +1,26 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+.env
diff --git a/uniro_admin_frontend/Dockerfile b/uniro_admin_frontend/Dockerfile
@@ -0,0 +1,15 @@
+FROM node:22-slim AS build
+
+WORKDIR /app
+COPY ./uniro_admin_frontend .
+
+RUN npm install --legacy-peer-deps --no-audit && npm run build
+
+FROM nginx
+
+COPY uniro_admin_frontend/nginx/nginx.conf /etc/nginx/nginx.conf
+COPY --from=build /app/dist /usr/share/nginx/html
+
+EXPOSE 3000
+
+CMD ["nginx", "-g", "daemon off;"]
diff --git a/uniro_admin_frontend/README.md b/uniro_admin_frontend/README.md
@@ -0,0 +1,50 @@
+# React + TypeScript + Vite
+
+This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+
+Currently, two official plugins are available:
+
+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
+- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
+
+## Expanding the ESLint configuration
+
+If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
+
+- Configure the top-level `parserOptions` property like this:
+
+```js
+export default tseslint.config({
+  languageOptions: {
+    // other options...
+    parserOptions: {
+      project: ['./tsconfig.node.json', './tsconfig.app.json'],
+      tsconfigRootDir: import.meta.dirname,
+    },
+  },
+})
+```
+
+- Replace `tseslint.configs.recommended` to `tseslint.configs.recommendedTypeChecked` or `tseslint.configs.strictTypeChecked`
+- Optionally add `...tseslint.configs.stylisticTypeChecked`
+- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and update the config:
+
+```js
+// eslint.config.js
+import react from 'eslint-plugin-react'
+
+export default tseslint.config({
+  // Set the react version
+  settings: { react: { version: '18.3' } },
+  plugins: {
+    // Add the react plugin
+    react,
+  },
+  rules: {
+    // other rules...
+    // Enable its recommended rules
+    ...react.configs.recommended.rules,
+    ...react.configs['jsx-runtime'].rules,
+  },
+})
+```
diff --git a/uniro_admin_frontend/eslint.config.js b/uniro_admin_frontend/eslint.config.js
@@ -0,0 +1,28 @@
+import js from '@eslint/js'
+import globals from 'globals'
+import reactHooks from 'eslint-plugin-react-hooks'
+import reactRefresh from 'eslint-plugin-react-refresh'
+import tseslint from 'typescript-eslint'
+
+export default tseslint.config(
+  { ignores: ['dist'] },
+  {
+    extends: [js.configs.recommended, ...tseslint.configs.recommended],
+    files: ['**/*.{ts,tsx}'],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: globals.browser,
+    },
+    plugins: {
+      'react-hooks': reactHooks,
+      'react-refresh': reactRefresh,
+    },
+    rules: {
+      ...reactHooks.configs.recommended.rules,
+      'react-refresh/only-export-components': [
+        'warn',
+        { allowConstantExport: true },
+      ],
+    },
+  },
+)
diff --git a/uniro_admin_frontend/index.html b/uniro_admin_frontend/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/logo.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>UNIRO ADMIN</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>
diff --git a/uniro_admin_frontend/nginx/nginx.conf b/uniro_admin_frontend/nginx/nginx.conf
@@ -0,0 +1,19 @@
+events {
+    worker_connections 1024;
+}
+
+http {
+    include       /etc/nginx/mime.types;
+    default_type  application/octet-stream;
+
+    server {
+        listen       3000;
+        server_name  localhost;
+
+        location / {
+            root   /usr/share/nginx/html;
+            index  index.html;
+            try_files $uri /index.html;
+        }
+    }
+}