Deploy: 소셜로그인 버그 수정 반영 배포

.eslintrc.cjs

@@ -9,6 +9,7 @@ module.exports = {
     'airbnb',
     'airbnb/hooks',
     'airbnb-typescript',
+    'plugin:@tanstack/eslint-plugin-query/recommended',
     'plugin:testing-library/react',
     'plugin:vitest/recommended',
     'prettier',
@@ -20,16 +21,29 @@ module.exports = {
     'consistent-return': 'off',
     'object-curly-newline': 'off',
     '@typescript-eslint/no-unused-vars': 'warn',
+    '@typescript-eslint/no-shadow': 'warn',
+    'no-param-reassign': 'warn',
+    'no-return-assign': 'warn',
     'no-unused-vars': 'warn',
+    'no-cond-assign': 'off',
+    'no-plusplus': 'warn',
     'react/react-in-jsx-scope': 'off',
     'react/prop-types': 'off',
     'react/require-default-props': 'off',
+    'react/no-array-index-key': 'warn',
     'react-hooks/exhaustive-deps': 'warn',
+    'react/jsx-props-no-spreading': 'off',
     'import/prefer-default-export': 'warn',
     'import/no-extraneous-dependencies': 'off',
     'import/extensions': 'off',
     'jsx-a11y/no-noninteractive-element-interactions': 'warn',
     'vitest/valid-title': 'off',
+    'jsx-a11y/label-has-associated-control': [
+      2,
+      {
+        labelAttributes: ['htmlFor'],
+      },
+    ],
   },
   ignorePatterns: [
     'dist',

.github/PULL_REQUEST_TEMPLATE.md

@@ -6,8 +6,8 @@ What kind of change does this PR introduce?
 
 - [ ] **\[Fix\]** 버그를 수정했어요.
 - [ ] **\[Feat\]** 새로운 기능을 추가했어요.
-- [ ] **\[Design\]** CSS 등 사용자 UI 디자인 추가/삭제/변경 했어요.
-- [ ] **\[Style\]** 코드 스타일 업데이트를 했어요(포맷팅, 변수명 변경 etc)
+- [ ] **\[UI\]** CSS 등 사용자 UI 디자인 추가/삭제/변경 했어요.
+- [ ] **\[Formatting\]** 코드 스타일 업데이트를 했어요(포맷팅, 변수명 변경 etc)
 - [ ] **\[Refactor\]** 리팩토링을 했어요 (기능적인 변화 없이, api 변경 없이)
 - [ ] **\[Config\]** 환경설정을 변경했어요.
 - [ ] **\[Docs\]** 문서 내용을 변경했어요. 

.github/workflows/deploy.yaml

@@ -0,0 +1,57 @@
+name: deploy-workflow
+
+on:
+  push:
+    branches: [main]
+  workflow_dispatch:
+
+jobs:
+  aws-deploy:
+    runs-on: ubuntu-latest
+    steps:
+      # Github workspace 로컬 다운로드
+      - name: Checkout branch
+        uses: actions/checkout@v4
+        with:
+          ref: main
+
+      # NodeJS 설치
+      - name: Setup Node.js environment v20
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+
+      # Yarn 의존성 설치
+      - name: Install yarn dependencies
+        run: yarn install
+
+      # 빌드용 환경 변수 .env 파일 생성
+      - name: Create .env file for Vite
+        run: |
+          echo "VITE_BASE_URL=${{ secrets.VITE_BASE_URL }}" >> .env
+          echo "VITE_API_URL=${{ secrets.VITE_API_URL }}" >> .env
+          echo "VITE_KAKAO_URL=${{ secrets.VITE_KAKAO_URL }}" >> .env
+          echo "VITE_GOOGLE_URL=${{ secrets.VITE_GOOGLE_URL }}" >> .env
+        shell: bash
+
+      # 프로젝트 빌드
+      - name: Build the project
+        run: yarn build
+
+      # AWS IAM credentials 설정
+      - name: Configure AWS credentials
+        uses: aws-actions/configure-aws-credentials@v4
+        with:
+          aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }}
+          aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
+          aws-region: ${{ secrets.AWS_REGION }}
+
+      # S3에 빌드 파일 배포
+      - name: Deploy file to S3
+        run: |
+          aws s3 sync --delete --region ${{ secrets.AWS_REGION }} ./dist ${{ secrets.AWS_S3_BUCKET }}
+
+      # CloudFront 캐시 무효화
+      - name: Invalidate CloudFront cache
+        run: |
+          aws cloudfront create-invalidation --distribution-id ${{ secrets.AWS_CLOUDFRONT_DISTRIBUTION_ID }} --paths "/*"

.github/workflows/vitest.yaml

@@ -0,0 +1,29 @@
+name: vitest-workflow
+
+on:
+  pull_request: 
+    types: [opened, reopened, synchronize, ready_for_review]
+    branches:
+      - main
+      - develop
+    paths:
+      - 'src/**'
+
+jobs:
+  vitest:
+    if: github.event.pull_request.draft == false
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Install node.js v20
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+
+      - name: Install yarn dependencies
+        run: yarn install
+
+      - name: Run tests with vitest
+        run: yarn run test -- --passWithNoTests

.gitignore

@@ -30,10 +30,17 @@ dist-ssr
 .env.test
 .env.production
 .env.local
+.env.staging
 .env.development.local
 .env.test.local
 .env.production.local
 
+# https local cert
+localhost-key.pem
+localhost.pem
+
 # etc
 .history
-.eslintcache
+.eslintcache
+tsconfig.tsbuildinfo
+tsconfig.*.tsbuildinfo

.prettierrc

@@ -9,5 +9,6 @@
   "bracketSpacing": true,
   "bracketSameLine": false,
   "arrowParens": "always",
-  "endOfLine": "lf"
+  "endOfLine": "lf",
+  "plugins": ["prettier-plugin-tailwindcss"]
 }

.vscode/extensions.json

@@ -9,6 +9,11 @@
     "formulahendry.auto-rename-tag",
     "pkief.material-icon-theme",
     "equinusocio.vsc-material-theme",
-    "wix.vscode-import-cost"
+    "wix.vscode-import-cost",
+    "streetsidesoftware.code-spell-checker",
+    "vitest.explorer",
+    "crystal-spider.jsdoc-generator",
+    "simonsiefke.svg-preview",
+    "bierner.jsdoc-markdown-highlighting"
   ]
 }

index.html

@@ -2,12 +2,12 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite + React + TS</title>
   </head>
   <body>
     <div id="root"></div>
+    <div id="modal"></div>
     <script type="module" src="/src/main.tsx"></script>
   </body>
 </html>

package.json

@@ -5,30 +5,53 @@
   "type": "module",
   "scripts": {
     "dev": "vite",
-    "build": "tsc && vite build",
+    "build:staging": "tsc --project tsconfig.prod.json && vite build --mode staging",
+    "serve:staging": "serve -s dist -l 5713 --ssl-cert localhost.pem --ssl-key localhost-key.pem",
+    "build": "tsc --project tsconfig.prod.json && vite build",
     "lint": "eslint . --ext ts,tsx,js,jsx --report-unused-disable-directives --max-warnings 0",
     "preview": "vite preview",
-    "test": "vitest --watch",
+    "test": "vitest",
+    "test:watch": "vitest --watch",
     "test-ui": "vitest --ui",
     "coverage": "vitest run --coverage",
     "prepare": "husky"
   },
   "dependencies": {
+    "@hello-pangea/dnd": "^16.6.0",
     "@tanstack/react-query": "^5.36.2",
+    "@tanstack/react-query-devtools": "^5.52.2",
+    "@types/crypto-js": "^4.2.2",
+    "@types/js-cookie": "^3.0.6",
     "axios": "^1.6.8",
+    "crypto-js": "^4.2.0",
+    "js-cookie": "^3.0.5",
+    "luxon": "^3.4.4",
     "react": "^18.2.0",
+    "react-big-calendar": "^1.13.0",
     "react-dom": "^18.2.0",
+    "react-helmet-async": "^2.0.5",
     "react-hook-form": "^7.51.4",
+    "react-icons": "^5.2.1",
+    "react-markdown": "^9.0.1",
     "react-router-dom": "^6.23.1",
+    "react-syntax-highlighter": "^15.5.0",
+    "react-toastify": "^10.0.5",
+    "rehype-raw": "^7.0.0",
+    "remark-gfm": "^4.0.0",
+    "tailwind-scrollbar-hide": "^1.1.7",
     "zustand": "^4.5.2"
   },
   "devDependencies": {
+    "@tanstack/eslint-plugin-query": "^5.35.6",
     "@testing-library/jest-dom": "^6.4.5",
     "@testing-library/react": "^15.0.7",
     "@testing-library/user-event": "^14.5.2",
+    "@types/luxon": "^3.4.2",
     "@types/node": "^20.12.11",
     "@types/react": "^18.3.2",
+    "@types/react-big-calendar": "^1.8.9",
     "@types/react-dom": "^18.3.0",
+    "@types/react-syntax-highlighter": "^15.5.13",
     "@typescript-eslint/eslint-plugin": "^7.2.0",
     "@typescript-eslint/parser": "^7.2.0",
     "@vitejs/plugin-react-swc": "^3.5.0",
@@ -52,6 +75,8 @@
     "msw": "^2.3.0",
     "postcss": "^8.4.38",
     "prettier": "3.2.5",
+    "prettier-plugin-tailwindcss": "^0.6.5",
+    "serve": "^14.2.4",
     "tailwindcss": "^3.4.3",
     "typescript": "^5.2.2",
     "vite": "^5.2.0",