바톤 v1.0.0 릴리즈

.github/workflows/frontend_ci.yml

@@ -0,0 +1,27 @@
+name: frontend_ci
+
+on:
+  push:
+    branches:
+      - dev/FE
+    paths: 'frontend/**'
+  pull_request:
+    branches:
+      - dev/FE
+    paths: 'frontend/**'
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    defaults:
+      run:
+        working-directory: ./frontend
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v3
+
+      - name: 의존성을 설치한다
+        run: npm install
+
+      - name: 테스트를 수행한다
+        run: npm run test

.github/workflows/frontend_dev_cd.yml

@@ -0,0 +1,59 @@
+name: frontend_cd
+
+on:
+  push:
+    branches:
+      - deploy/FE
+
+defaults:
+  run:
+    working-directory: ./frontend
+
+permissions:
+  contents: read
+
+jobs:
+  build-and-upload:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Setup Repository
+        uses: actions/checkout@v3
+
+      - name: Setup node with cache
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18
+          cache: 'npm'
+          cache-dependency-path: '**/package-lock.json'
+
+      - name: Setup environment variables
+        run: |
+          echo "REACT_APP_BASE_URL=${{ secrets.REACT_APP_DEV_BASE_URL }}" >> .env
+
+      - name: Install Dependancies
+        run: npm install
+
+      - name: Build App
+        run: npm run build
+
+      - name: Upload frontend build file to artifact
+        uses: actions/upload-artifact@v3
+        with:
+          name: FrontendApplication
+          path: frontend/dist
+
+  deploy:
+    needs: build-and-upload
+    runs-on: [self-hosted, Linux, ARM64]
+
+    steps:
+      - name: Remove previous version app
+        working-directory: frontend/dist
+        run: rm -rf dist
+
+      - name: Download build file from artifact
+        uses: actions/download-artifact@v3
+        with:
+          name: FrontendApplication
+          path: frontend/dist

.github/workflows/frontend_prod_cd.yml

@@ -0,0 +1,59 @@
+name: frontend_cd
+
+on:
+  push:
+    branches:
+      - prod/FE
+
+defaults:
+  run:
+    working-directory: ./frontend
+
+permissions:
+  contents: read
+
+jobs:
+  build-and-upload:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Setup Repository
+        uses: actions/checkout@v3
+
+      - name: Setup node with cache
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18
+          cache: 'npm'
+          cache-dependency-path: '**/package-lock.json'
+
+      - name: Setup environment variables
+        run: |
+          echo "REACT_APP_BASE_URL=${{ secrets.REACT_APP_PROD_BASE_URL }}" >> .env
+
+      - name: Install Dependancies
+        run: npm install
+
+      - name: Build App
+        run: npm run build
+
+      - name: Upload frontend build file to artifact
+        uses: actions/upload-artifact@v3
+        with:
+          name: FrontendApplication
+          path: frontend/dist
+
+  deploy:
+    needs: build-and-upload
+    runs-on: [self-hosted, Linux, ARM64, deploy]
+
+    steps:
+      - name: Remove previous version app
+        working-directory: frontend/dist
+        run: rm -rf dist
+
+      - name: Download build file from artifact
+        uses: actions/download-artifact@v3
+        with:
+          name: FrontendApplication
+          path: frontend/dist

frontend/.babelrc

@@ -0,0 +1,14 @@
+{
+  "presets": [
+    "@babel/preset-react",
+    [
+      "@babel/preset-env",
+      {
+        "modules": false,
+        "useBuiltIns": "usage",
+        "corejs": 3
+      }
+    ],
+    "@babel/preset-typescript"
+  ]
+}

frontend/.eslintrc

@@ -0,0 +1,9 @@
+{
+  "parserOptions": {
+    "ecmaVersion": "latest"
+  },
+  "env": {
+    "es6": true
+  },
+  "extends": ["plugin:prettier/recommended"]
+}

frontend/.gitignore

@@ -0,0 +1,2 @@
+node_modules
+/dist

frontend/.prettierrc

@@ -0,0 +1,7 @@
+{
+  "printWidth": 120,
+  "tabWidth": 2,
+  "singleQuote": true,
+  "trailingComma": "all",
+  "semi": true
+}

frontend/.storybook/main.ts

@@ -0,0 +1,31 @@
+import type { StorybookConfig } from '@storybook/react-webpack5';
+import webpack from '../webpack/webpack.common';
+
+const config: StorybookConfig = {
+  stories: ['../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
+
+  staticDirs: ['../src/assets'],
+  addons: [
+    '@storybook/addon-links',
+    '@storybook/addon-essentials',
+    '@storybook/addon-onboarding',
+    '@storybook/addon-interactions',
+    '@storybook/addon-essentials',
+    '@storybook/addon-styling',
+  ],
+  framework: {
+    name: '@storybook/react-webpack5',
+    options: {},
+  },
+  docs: {
+    autodocs: 'tag',
+  },
+  webpackFinal: async (config) => {
+    return {
+      ...config,
+      module: { ...config.module },
+      resolve: { ...webpack.resolve },
+    };
+  },
+};
+export default config;

frontend/.storybook/preview-body.html

@@ -0,0 +1,2 @@
+<div id="modal-root"></div>
+<div id="toast-root"></div>

frontend/.storybook/preview.ts

@@ -0,0 +1,22 @@
+import type { Preview } from '@storybook/react';
+import { withThemeFromJSXProvider } from '@storybook/addon-styling';
+import { GlobalStyle } from '../src/styles/GlobalStyles';
+
+const preview: Preview = {
+  parameters: {
+    actions: { argTypesRegex: '^on[A-Z].*' },
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/,
+      },
+    },
+  },
+  decorators: [
+    withThemeFromJSXProvider({
+      GlobalStyles: GlobalStyle,
+    }),
+  ],
+};
+
+export default preview;

frontend/jest.config.js

@@ -0,0 +1,7 @@
+module.exports = {
+  preset: 'ts-jest',
+  testEnvironment: 'jsdom',
+  moduleNameMapper: {
+    '^@/(.*)$': '<rootDir>/src/$1',
+  },
+};