[deploy] 배포 테스트

.github/ISSUE_TEMPLATE/feature_request.md

@@ -10,9 +10,9 @@ assignees:
 ## 🗂️ Epic 및 일정
 Jira **에픽/시작일/기한**을 아래에 입력하세요.
 
-- epic: DP-6
-- start: 2025-07-18
-- due: 2025-07-22
+- epic: DP-2
+- start: 2025-09-01
+- due: 2025-09-02
 
 ---
 

.github/ISSUE_TEMPLATE/fix_request.md

@@ -10,9 +10,9 @@ assignees:
 ## 🗂️ Epic 및 일정
 Jira **에픽/시작일/기한**을 아래에 입력하세요.
 
-- epic: DP-6
-- start: 2025-07-20
-- due: 2025-07-22
+- epic: DP-2
+- start: 2025-09-01
+- due: 2025-09-02
 
 ---
 

.github/ISSUE_TEMPLATE/planning.md

@@ -10,9 +10,9 @@ assignees:
 ## 🗂️ Epic 및 일정
 Jira **에픽/시작일/기한**을 아래에 입력하세요.
 
-- epic: DP-6
-- start: 2025-07-18
-- due: 2025-07-22
+- epic: DP-2
+- start: 2025-09-01
+- due: 2025-09-02
 
 ---
 

.github/ISSUE_TEMPLATE/refactor_request.md

@@ -10,9 +10,9 @@ assignees:
 ## 🗂️ Epic 및 일정
 Jira **에픽/시작일/기한**을 아래에 입력하세요.
 
-- epic: DP-6
-- start: 2025-07-18
-- due: 2025-07-22
+- epic: DP-2
+- start: 2025-09-01
+- due: 2025-09-02
 
 ---
 

.github/PULL_REQUEST_TEMPLATE.md

@@ -33,6 +33,10 @@ PR을 올리기 전에 아래 항목을 확인했나요?
 - Related to #이슈번호
 ---
 
+## 📸스크린샷 (선택)
+
+---
+
 ## 📎 기타 참고 사항
 추가로 리뷰어가 참고해야 할 사항이 있다면 적어주세요.
 

.github/workflows/deploy.yml

@@ -0,0 +1,63 @@
+name: Deploy React Vite App to S3 + CloudFront
+
+on:
+  pull_request:
+    types: [closed]
+    branches: [main]
+
+jobs:
+  deploy:
+    if: |
+      github.event.pull_request.merged == true &&
+      github.head_ref == 'develop' &&
+      contains(github.event.pull_request.title, '[deploy]')
+    runs-on: ubuntu-latest
+
+    steps:
+      # 1. 저장소 체크아웃
+      - name: Checkout repository
+        uses: actions/checkout@v4
+
+      # 2. Node.js + pnpm 설치
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: 'pnpm'
+
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 10.13.1   # packageManager에 맞춘 pnpm 버전
+
+      # 3. 의존성 설치 & 빌드
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile
+
+      - name: Build project
+        run: pnpm build
+        env:
+          VITE_BASE_URL: ${{ secrets.VITE_BASE_URL }}
+          VITE_KAKAO_API_KEY: ${{ secrets.VITE_KAKAO_API_KEY }}
+
+      # 4. AWS CLI 인증
+      - 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 }}
+
+      # 5. 빌드 결과물을 S3에 업로드
+      - name: Sync files to S3
+        run: |
+          aws s3 sync ./dist s3://${{ secrets.AWS_S3_BUCKET }} \
+            --delete \
+            --cache-control "max-age=0, no-cache, no-store, must-revalidate"
+
+      # 6. CloudFront 캐시 무효화
+      - name: Invalidate CloudFront cache
+        run: |
+          aws cloudfront create-invalidation \
+            --distribution-id ${{ secrets.AWS_DISTRIBUTION_ID }} \
+            --paths "/*"

README.md

@@ -1 +1,108 @@
-# DDOK
+# 📖 똑DDOK — 당신 곁의 동료, 딸깍!
+
+> 지도 기반 프로젝트·스터디 매칭 & 팀 협업 플랫폼 
+
+<br />
+
+지도 기반으로 스터디/프로젝트를 빠르게 찾고 참여하고, 팀 협업(채팅·일정·알림)까지 한 곳에서 처리하는 플랫폼입니다.   
+
+프로젝트 기간: 2025.08 ~ 2025.09 (기획 및 개발)   
+시연영상 [YouTube]()   
+Link:   
+Code: [FE](https://github.com/DeepDirect/ddok-fe), [BE](https://github.com/DeepDirect/ddok-be)   
+
+---
+
+## 🫶 팀원
+| 이름      | 역할                 | GitHub 링크                                     |
+|----------|--------------------|------------------------------------------------|
+| 정원용     | 팀장, Full Stack, Infra    | [@projectmiluju](https://github.com/jihun-dev) |
+| 권혜진     | Backend            | [@sunsetkk](https://github.com/sunsetkk)       |
+| 박건      | Frontend            | [@Jammanb0](https://github.com/Jammanb0)       |
+| 박소현     | Frontend           | [@ssoogit](https://github.com/ssoogit)         |
+| 박재경     | Full Stack  | [@Shin-Yu-1](https://github.com/Shin-Yu-1) |
+| 이은지     | Frontend           | [@ebbll](https://github.com/ebbll)             |
+| 최범근     | Backend            | [@vayaconChoi](https://github.com/vayaconChoi) |
+
+<br />
+
+---
+
+## ✨ 주요 기능
+
+- 지도 기반 탐색: 카카오맵에서 주변 스터디/프로젝트/플레이어를 한눈에 확인 (상태/카테고리 필터)
+- 포지션 매칭: 역할/경험/시간대 기반 맞춤 필터와 추천
+- 원클릭 참여: 오픈톡/댓글 없이 클릭 한 번으로 신청/취소
+- 팀 협업: 팀 생성 시 자동 채팅방, 일정 조율(캘린더), 팀 ReadMe
+- 신뢰도 시스템: 온도(완주율/기여도), 배지/랭킹으로 책임감과 지속 참여 유도
+
+<br/>
+
+## 🖼️ 스크린샷
+
+<br/>
+
+## 🛠️ 기술 스택 (Frontend)
+
+| 분류                | 기술명                                                                                 |
+|-------------------|--------------------------------------------------------------------------------------|
+| **프레임워크/언어**    | React, TypeScript, Vite, PNPM                                                      |
+| **라우팅**           | TanStack Router, React Router                                                       |
+| **상태 관리**         | Zustand (전역 상태), TanStack React Query (서버 상태)                              |
+| **폼/유효성 검사**     | React Hook Form, Zod, @hookform/resolvers                                          |
+| **스타일**           | SCSS Modules, SCSS, clsx                                                           |
+| **UI 라이브러리**      | Radix UI, Sonner (토스트), react-spinners (로딩)                                   |
+| **아이콘**           | Phosphor Icons                                                                      |
+| **마크다운**          | uiw/react-md-editor                                                                |
+| **네트워크 요청**      | axios                                                                              |
+| **실시간 통신**       | @stomp/stompjs (STOMP WebSocket 클라이언트)                                         |
+| **지도**             | Kakao Maps JavaScript API, react-kakao-maps-sdk                                     |
+| **날짜/시간 처리**     | dayjs, date-fns                                                                    |
+| **테이블**           | TanStack Table                                                                     |
+| **캘린더**           | react-datepicker, FullCalendar                                                     |
+| **차트/시각화**       | (선택) Recharts / Chart.js                                                         |
+| **코드 품질/자동화**    | ESLint, Prettier, Stylelint, Husky, lint-staged                                   |
+| **번들/배포**         | AWS S3, CloudFront                                                                 |
+| **기타**             | react-dnd (드래그앤드롭), Kakao OAuth                                               |
+
+
+<br />
+
+---
+
+## 📁 디렉토리 구조
+
+```bash
+src/
+├── api/         # API 호출 함수 (axios 등)
+├── assets/      # 이미지, 폰트 등 정적 리소스
+├── components/  # 공통 UI 컴포넌트
+├── constants/   # 상수 값 정의
+├── features/    # 기능 단위 모듈 (채팅, 프로젝트 등)
+├── hooks/       # 공통 커스텀 훅
+├── layouts/     # 공통 페이지 레이아웃
+├── mocks/       # 목(Mock) 데이터
+├── pages/       # 페이지 컴포넌트
+├── router/      # 라우팅 설정
+├── schemas/     # 요청/응답 타입 및 Zod 스키마
+├── stores/      # Zustand 전역 상태 관리
+├── styles/      # 글로벌 스타일, 디자인 토큰
+├── types/       # 전역 TypeScript 타입 정의
+└── utils/       # 공용 유틸리티 함수
+```
+
+<br />
+
+---
+
+## 🏃‍➡️ 설치 및 실행
+```bash
+# 패키지 설치
+pnpm install
+
+# 개발 서버 실행
+pnpm dev
+
+# 빌드
+pnpm build
+```

cspell.json

@@ -22,5 +22,32 @@
     ".env.example",
     ".prettierignore"
   ],
-  "words": ["DDOK", "kakao"]
+  "words": [
+    "appkey",
+    "bname",
+    "clusterer",
+    "daum",
+    "DDOK",
+    "ddtoast",
+    "Dragbar",
+    "findid",
+    "findidcomplete",
+    "findpassword",
+    "jibun",
+    "kakao",
+    "kakaotalk",
+    "noti",
+    "partialize",
+    "relayout",
+    "roadname",
+    "sido",
+    "signupcomplete",
+    "sigungu",
+    "stompjs",
+    "xsmall",
+    "xxsm",
+    "xxsmall",
+    "xxxsmall",
+    "zonecode"
+  ]
 }

eslint.config.js

@@ -3,21 +3,58 @@ import globals from 'globals';
 import reactHooks from 'eslint-plugin-react-hooks';
 import reactRefresh from 'eslint-plugin-react-refresh';
 import tseslint from 'typescript-eslint';
-import { globalIgnores } from 'eslint/config';
+import importPlugin from 'eslint-plugin-import';
 
 export default tseslint.config([
-  globalIgnores(['dist']),
+  { ignores: ['dist'] },
   {
     files: ['**/*.{ts,tsx}'],
-    extends: [
-      js.configs.recommended,
-      tseslint.configs.recommended,
-      reactHooks.configs['recommended-latest'],
-      reactRefresh.configs.vite,
-    ],
+    extends: [js.configs.recommended, ...tseslint.configs.recommended],
+    plugins: {
+      'react-hooks': reactHooks,
+      'react-refresh': reactRefresh,
+      import: importPlugin,
+    },
     languageOptions: {
       ecmaVersion: 2020,
       globals: globals.browser,
     },
+    settings: {
+      'import/resolver': {
+        typescript: true,
+      },
+    },
+    rules: {
+      ...reactHooks.configs.recommended.rules,
+
+      'react-refresh/only-export-components': ['warn', { allowConstantExport: true }],
+
+      'import/order': [
+        'error',
+        {
+          groups: ['builtin', 'external', 'internal', 'parent', 'sibling', 'index'],
+          pathGroups: [
+            {
+              pattern: 'react',
+              group: 'external',
+              position: 'before',
+            },
+            {
+              pattern: 'react/**',
+              group: 'external',
+              position: 'before',
+            },
+          ],
+          pathGroupsExcludedImportTypes: ['react'],
+          'newlines-between': 'always',
+          alphabetize: {
+            order: 'asc',
+            caseInsensitive: true,
+          },
+        },
+      ],
+      'import/newline-after-import': 'error',
+      'import/no-duplicates': 'error',
+    },
   },
 ]);

index.html

@@ -2,12 +2,17 @@
 <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="/DDOK-Mascot-yellow.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite + React + TS</title>
+    <title>똑DDOK!</title>
   </head>
   <body>
     <div id="root"></div>
     <script type="module" src="/src/main.tsx"></script>
+    <script src="//t1.daumcdn.net/mapjsapi/bundle/postcode/prod/postcode.v2.js"></script>
+    <script
+      type="text/javascript"
+      src="//dapi.kakao.com/v2/maps/sdk.js?appkey=%VITE_KAKAO_API_KEY%&libraries=services"
+    ></script>
   </body>
 </html>

package.json

@@ -15,18 +15,32 @@
     "test": "echo \"No tests yet!\""
   },
   "dependencies": {
+    "@hookform/resolvers": "^5.2.1",
+    "@phosphor-icons/react": "^2.1.10",
+    "@stomp/stompjs": "^7.1.1",
     "@tanstack/react-query": "^5.85.3",
+    "@uiw/react-md-editor": "^4.0.8",
+    "axios": "^1.11.0",
+    "clsx": "^2.1.1",
+    "date-fns": "^4.1.0",
+    "dayjs": "^1.11.17",
+    "radix-ui": "^1.4.3",
     "react": "^19.1.1",
+    "react-datepicker": "^8.7.0",
     "react-dom": "^19.1.1",
+    "react-hook-form": "^7.62.0",
+    "react-kakao-maps-sdk": "^1.2.0",
     "react-router-dom": "^7.8.0",
-    "react-toastify": "^11.0.5",
     "sass": "^1.90.0",
-    "zod": "^4.0.17"
+    "sonner": "^2.0.7",
+    "zod": "^4.0.17",
+    "zustand": "^5.0.8"
   },
   "devDependencies": {
     "@eslint/js": "^9.33.0",
     "@types/react": "^19.1.10",
     "@types/react-dom": "^19.1.7",
+    "@types/react-router-dom": "^5.3.3",
     "@typescript-eslint/eslint-plugin": "^8.39.1",
     "@typescript-eslint/parser": "^8.39.1",
     "@vitejs/plugin-react": "^5.0.0",