[코드리뷰] 코드리뷰용 PR입니다

.coderabbit.yaml

@@ -0,0 +1,15 @@
+language: 'ko-KR'
+early_access: false
+reviews:
+  profile: 'chill'
+  request_changes_workflow: false
+  high_level_summary: true
+  poem: true
+  review_status: true
+  collapse_walkthrough: false
+  path_filters: ['!.github/**', '!dist/**', '!./**']
+  auto_review:
+    enabled: true
+    drafts: false
+chat:
+  auto_reply: true

.github/ISSUE_TEMPLATE/bug.yml

@@ -0,0 +1,45 @@
+name: 🐞 bug
+description: 버그가 발생했나요?
+title: '[bug] '
+labels: ['🐞 BugFix']
+projects: []
+assignees:
+  -
+body:
+  - type: textarea
+    id: bug-description
+    attributes:
+      label: 🐞 설명
+      description: 버그에 대한 설명을 작성해 주세요.
+    validations:
+      required: true
+  - type: textarea
+    id: bug-simulation
+    attributes:
+      label: 💻 버그 시뮬레이션
+      description: 버그를 발견한 상황을 단계별로 작성해 주세요.
+    validations:
+      required: true
+  - type: textarea
+    id: bug-log
+    attributes:
+      label: 📄 로그
+      description: 로그가 있다면 작성해 주세요.
+    validations:
+      required: false
+  - type: textarea
+    id: bug-os
+    attributes:
+      label: 🌏 환경
+      description: 버그가 발생한 환경에 대해 작성해 주세요.
+      placeholder: |
+        OS: macOS 14.5
+    validations:
+      required: false
+  - type: textarea
+    id: bug-more
+    attributes:
+      label: 📝 메모
+      description: 더 하고 싶은 말이 있다면 작성해 주세요.
+    validations:
+      required: false

.github/ISSUE_TEMPLATE/feature.yml

@@ -0,0 +1,28 @@
+name: ✨ feature
+description: 새로운 기능이나 명세가 있나요?
+title: '[feature] '
+labels: ['✨ Feature']
+body:
+  - type: textarea
+    id: bug-description
+    attributes:
+      label: 📄 설명
+      description: 새로운 기능에 대한 설명을 작성해 주세요.
+      placeholder: 자세하게 작성하기!
+    validations:
+      required: true
+  - type: textarea
+    id: bug-simulation
+    attributes:
+      label: ✅ 해야 할 일
+      description: 해야 할 일에 대한 Tasks를 작성해 주세요.
+      placeholder: 최대한 세분화해서 작성!
+    validations:
+      required: true
+  - type: textarea
+    id: bug-more
+    attributes:
+      label: 📝 메모
+      description: 더 하고 싶은 말이 있다면 작성해 주세요.
+    validations:
+      required: false

.github/ISSUE_TEMPLATE/help.yml

@@ -0,0 +1,36 @@
+name: 😢 help
+description: 도움이 필요하신가요?
+title: '[help] '
+labels: ['😢 Help']
+body:
+  - type: textarea
+    id: help-description
+    attributes:
+      label: 😢 문제 설명
+      description: 도움이 필요한 문제에 대한 설명을 작성해 주세요.
+      placeholder: 자세하게 작성해 주세요.
+    validations:
+      required: true
+  - type: textarea
+    id: help-context
+    attributes:
+      label: 🌐 문제 발생 상황
+      description: 문제가 발생한 상황을 설명해 주세요.
+      placeholder: 가능한 구체적으로 작성해 주세요.
+    validations:
+      required: true
+  - type: textarea
+    id: help-attempts
+    attributes:
+      label: 💡 시도한 해결책
+      description: 문제를 해결하기 위해 시도한 방법이 있다면 작성해 주세요.
+      placeholder: 시도한 모든 방법을 나열해 주세요.
+    validations:
+      required: false
+  - type: textarea
+    id: help-more
+    attributes:
+      label: 📝 추가 메모
+      description: 추가로 하고 싶은 말이 있다면 작성해 주세요.
+    validations:
+      required: false

.github/PULL_REQUEST_TEMPLATE.md

@@ -0,0 +1,19 @@
+# 🚀 풀 리퀘스트 제안
+
+**[작업 내용을 간략히 적어주세요]**
+
+## 📋 작업 내용
+
+수정한 내용이나 추가한 기능에 대해 자세히 설명해 주세요.
+
+## 🔧 변경 사항
+
+주요 변경 사항을 요약해 주세요.
+
+## 📸 스크린샷 (선택 사항)
+
+수정된 화면 또는 기능을 시연할 수 있는 스크린샷을 첨부할 수 있습니다.
+
+## 📄 기타
+
+추가적으로 전달하고 싶은 내용이나 특별한 요구 사항이 있으면 작성해 주세요.

.github/workflows/main.yml

@@ -0,0 +1,40 @@
+name: Deploy to AWS
+
+on:
+  push:
+    branches:
+      - develop
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v3
+
+      - name: Install dependencies
+        run: npm install
+
+      - name: Build project
+        env:
+          VITE_API_BASE_URL: ${{ secrets.VITE_API_BASE_URL}}
+        run: npm run build
+
+      - name: Deploy to S3
+        uses: jakejarvis/[email protected]
+        with:
+          args: --delete
+        env:
+          AWS_S3_BUCKET: 5re5park-s3-frontend # S3 버킷 이름
+          AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
+          AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
+          AWS_REGION: ap-northeast-2 # 예: us-east-1
+          SOURCE_DIR: ./dist # 빌드된 정적 파일 경로
+          VITE_API_BASE_URL: ${{ secrets.VITE_API_BASE_URL}}
+      - name: Invalidate CloudFront cache
+        run: aws cloudfront create-invalidation --distribution-id ${{ secrets.CLOUDFRONT_DISTRIBUTION_ID }} --paths "/*"
+        env:
+          AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
+          AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
+# 이거 진짜로 되는걸까

.gitignore

@@ -7,11 +7,16 @@ yarn-error.log*
 pnpm-debug.log*
 lerna-debug.log*
 
+# Dependency directories
 node_modules
 dist
 dist-ssr
 *.local
 
+# Environment variables
+.env
+.env.*
+
 # Editor directories and files
 .vscode/*
 !.vscode/extensions.json
@@ -22,3 +27,4 @@ dist-ssr
 *.njsproj
 *.sln
 *.sw?
+.env

README.md

@@ -22,7 +22,7 @@ export default tseslint.config({
       tsconfigRootDir: import.meta.dirname,
     },
   },
-})
+});
 ```
 
 - Replace `tseslint.configs.recommended` to `tseslint.configs.recommendedTypeChecked` or `tseslint.configs.strictTypeChecked`
@@ -31,7 +31,7 @@ export default tseslint.config({
 
 ```js
 // eslint.config.js
-import react from 'eslint-plugin-react'
+import react from 'eslint-plugin-react';
 
 export default tseslint.config({
   // Set the react version
@@ -46,5 +46,5 @@ export default tseslint.config({
     ...react.configs.recommended.rules,
     ...react.configs['jsx-runtime'].rules,
   },
-})
+});
 ```

components.json

@@ -0,0 +1,20 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "new-york",
+  "rsc": false,
+  "tsx": true,
+  "tailwind": {
+    "config": "tailwind.config.js",
+    "css": "src/index.css",
+    "baseColor": "zinc",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/utils",
+    "ui": "@/components/ui",
+    "lib": "@/lib",
+    "hooks": "@/hooks"
+  }
+}

eslint.config.js

@@ -1,28 +1,113 @@
-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'
+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,
+    env: {
+      browser: true,
+      es2021: true,
+      node: true,
     },
-    plugins: {
-      'react-hooks': reactHooks,
-      'react-refresh': reactRefresh,
+    extends: [
+      'eslint:recommended',
+      'plugin:react/recommended',
+      'plugin:react-hooks/recommended',
+      'plugin:prettier/recommended',
+    ],
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
+      ecmaVersion: 12,
+      sourceType: 'module',
     },
+    plugins: ['react'],
     rules: {
-      ...reactHooks.configs.recommended.rules,
-      'react-refresh/only-export-components': [
-        'warn',
-        { allowConstantExport: true },
+      // 함수형 컴포넌트를 화살표 함수로 작성하도록 강제 (코딩 컨벤션)
+      'react/function-component-definition': [
+        2,
+        {
+          namedComponents: 'arrow-function',
+          unnamedComponents: 'arrow-function',
+        },
       ],
+
+      // 화살표 함수 본문 스타일 지정(간결한 함수 작성을 유도하여 코드의 가독성을 높일 수 있음)
+      'arrow-body-style': ['error', 'as-needed'],
+
+      // 컴포넌트 이름을 PascalCase로 강제(코딩 컨벤션)
+      'react/jsx-pascal-case': 'error',
+
+      // 변수/함수명은 camelCase로 강제(코딩 컨벤션)
+      camelcase: ['error', { properties: 'never' }],
+
+      // 이벤트 핸들러 prop 이름은 'on'으로 시작하도록 강제(코딩 컨벤션)
+      'react/jsx-handler-names': [
+        'error',
+        {
+          eventHandlerPropPrefix: 'on',
+        },
+      ],
+
+      // Default Export와 Named Export 모두 허용(코딩 컨벤션)
+      'import/no-default-export': 'off',
+      'import/prefer-default-export': 'off',
+
+      // 매직 넘버 사용 방지 (배열 인덱스 제외) -> 코드의 의미를 명확히 하고 유지보수성을 향상시킬 수 있음
+      'no-magic-numbers': ['error', { ignoreArrayIndexes: true }],
+
+      // React Hooks 규칙 강제(Hooks 관련 버그를 방지하고, Hooks의 올바른 사용을 유도)
+      'react-hooks/rules-of-hooks': 'error',
+
+      // PropTypes 사용 권장(타입 안정성을 향상시키고, 컴포넌트의 인터페이스를 명확히 할 수 있음)
+      'react/prop-types': 'warn',
+
+      // 재할당 없는 변수는 const 사용 강제
+      'prefer-const': 'error',
+
+      // var 대신 let과 const 사용 강제
+      'no-var': 'error',
+
+      // 사용하지 않는 변수 경고 (언더스코어로 시작하는 변수 제외)
+      'no-unused-vars': ['warn', { argsIgnorePattern: '^_' }],
+
+      // === 와 !== 사용 강제(타입 강제 변환으로 인한 예기치 않은 동작을 방지)
+      eqeqeq: 'error',
+
+      // console.log() 사용 시 경고 (warn과 error는 허용)
+      'no-console': ['warn', { allow: ['warn', 'error'] }],
+
+      // 객체 구조 분해 할당 권장(코드를 더 간결하고 읽기 쉽게 만들며, 필요한 속성만 명시적으로 사용할 수 있게 할 수 있음)
+      'prefer-destructuring': [
+        'error',
+        {
+          array: false,
+          object: true,
+        },
+      ],
+
+      // import 문 정렬(일관된 import 순서를 유지하여 코드의 구조를 파악하기 쉽게 만들어 줌)
+      'sort-imports': [
+        'error',
+        {
+          ignoreCase: true,
+          ignoreDeclarationSort: true,
+          ignoreMemberSort: false,
+          memberSyntaxSortOrder: ['none', 'all', 'multiple', 'single'],
+        },
+      ],
+
+      // JSX에서 중복된 props 방지(실수로 같은 prop을 여러 번 사용하는 것을 방지하여 버그를 예방)
+      'react/jsx-no-duplicate-props': ['error', { ignoreCase: true }],
+    },
+    settings: {
+      react: {
+        version: 'detect',
+      },
     },
-  },
-)
+  }
+);