chore/프로젝트 세팅

.editorconfig

@@ -0,0 +1,12 @@
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+indent_style = space
+indent_size = 2
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.md]
+trim_trailing_whitespace = false

.env.example

@@ -0,0 +1,6 @@
+
+# API
+VITE_API_URL=
+
+# App
+VITE_APP_TITLE=또랑

.eslintrc

@@ -0,0 +1,75 @@
+{
+  "root": true,
+  "env": {
+    "browser": true,
+    "es2021": true
+  },
+  "extends": [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:react/recommended",
+    "plugin:react/jsx-runtime",
+    "plugin:react-hooks/recommended",
+    "prettier"
+  ],
+  "parser": "@typescript-eslint/parser",
+  "parserOptions": {
+    "ecmaVersion": "latest",
+    "sourceType": "module",
+    "ecmaFeatures": {
+      "jsx": true
+    }
+  },
+  "plugins": ["@typescript-eslint", "react", "react-hooks", "react-refresh", "check-file"],
+  "settings": {
+    "react": {
+      "version": "detect"
+    }
+  },
+  "rules": {
+    "@typescript-eslint/no-unused-vars": "warn",
+    "react/prop-types": "off",
+    "no-console": "off",
+    "react-refresh/only-export-components": ["warn", { "allowConstantExport": true }],
+
+    "check-file/folder-naming-convention": [
+      "error",
+      { "src/**/": "KEBAB_CASE" }
+    ],
+    "check-file/filename-naming-convention": [
+      "error",
+      {
+        "src/**/!(*main|*vite-env)*.tsx": "PASCAL_CASE",
+        "src/**/!(*vite-env)*.ts": "CAMEL_CASE"
+      },
+      { "ignoreMiddleExtensions": true }
+    ],
+
+    "@typescript-eslint/naming-convention": [
+      "error",
+      {
+        "selector": "variable",
+        "format": ["camelCase", "UPPER_CASE", "PascalCase"],
+        "leadingUnderscore": "allow"
+      },
+      {
+        "selector": "variable",
+        "modifiers": ["const", "exported"],
+        "types": ["function"],
+        "format": ["camelCase", "PascalCase"]
+      },
+      {
+        "selector": "function",
+        "format": ["camelCase", "PascalCase"]
+      },
+      {
+        "selector": "typeLike",
+        "format": ["PascalCase"]
+      },
+      {
+        "selector": "enumMember",
+        "format": ["UPPER_CASE"]
+      }
+    ]
+  }
+}

.github/copilot-instructions.md

@@ -0,0 +1,38 @@
+# Copilot 코드 리뷰 지침
+
+## 언어
+
+- 한글로 리뷰해주세요
+
+## 네이밍 컨벤션
+
+- 폴더명: `kebab-case`
+- 일반 파일(.ts): `camelCase`
+- 컴포넌트 파일(.tsx): `PascalCase`
+- 변수/함수명: `camelCase`
+- 상수명: `UPPER_SNAKE_CASE`
+- 컴포넌트명: `PascalCase`
+- 페이지 컴포넌트: `PascalCase + Page` (예: `MainPage`)
+
+## Export 규칙
+
+- 컴포넌트: `export default`
+- 유틸 함수: `named export`
+
+## 코드 품질
+
+- 불필요한 `console.log`가 있는지 확인해주세요
+- 사용하지 않는 import가 있는지 확인해주세요
+- TypeScript 타입이 `any`로 되어있는지 확인해주세요
+- 하드코딩된 값이 상수로 분리되어야 하는지 확인해주세요
+
+## React
+
+- 컴포넌트 props는 interface로 정의해주세요
+- useEffect 의존성 배열이 올바른지 확인해주세요
+- 불필요한 리렌더링이 발생할 수 있는 코드인지 확인해주세요
+
+## 보안
+
+- API 키나 민감한 정보가 하드코딩되어 있는지 확인해주세요
+- 환경변수는 `VITE_` 접두사를 사용해야 합니다

.github/workflows/ci.yml

@@ -0,0 +1,31 @@
+name: CI
+
+on:
+  pull_request:
+    branches: [main, develop]
+
+jobs:
+  check:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 22
+          cache: 'npm'
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Lint
+        run: npm run lint
+
+      - name: Type check
+        run: npm run type-check
+
+      - name: Build
+        run: npm run build

.gitignore

@@ -0,0 +1,29 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+bun.lock
+.env
+.env.local
+.env.*.local
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+!.vscode/settings.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

.husky/commit-msg

@@ -0,0 +1,77 @@
+#!/bin/sh
+
+commit_msg=$(cat "$1")
+first_line=$(echo "$commit_msg" | head -n 1)
+
+# 허용된 타입
+allowed_types="feat|fix|docs|style|refactor|test|chore|design|ci|perf"
+
+# 1. 타입 형식 체크 (type: 형식인지)
+if ! echo "$first_line" | grep -qE "^[a-zA-Z]+:"; then
+  echo ""
+  echo "❌ 커밋 메시지 형식이 올바르지 않습니다."
+  echo ""
+  echo "올바른 형식: type: 메시지 (#이슈번호)"
+  echo "예시: feat: 로그인 기능 구현 (#123)"
+  echo ""
+  exit 1
+fi
+
+# 2. 타입 추출
+type=$(echo "$first_line" | sed 's/:.*//')
+
+# 3. 대문자 타입 체크
+if echo "$type" | grep -qE "[A-Z]"; then
+  echo ""
+  echo "❌ 커밋 타입은 소문자만 사용해야 합니다."
+  echo ""
+  echo "잘못된 예: Feat, FEAT, FIX"
+  echo "올바른 예: feat, fix, docs"
+  echo ""
+  exit 1
+fi
+
+# 4. 허용된 타입인지 체크
+if ! echo "$type" | grep -qE "^($allowed_types)$"; then
+  echo ""
+  echo "❌ '$type'은(는) 허용되지 않는 커밋 타입입니다."
+  echo ""
+  echo "허용된 타입:"
+  echo "  feat     - 새로운 기능"
+  echo "  fix      - 버그 수정"
+  echo "  docs     - 문서 변경"
+  echo "  style    - 코드 포맷팅 (로직 변경 없음)"
+  echo "  refactor - 리팩토링"
+  echo "  test     - 테스트 추가/수정"
+  echo "  chore    - 빌드, 설정 등 기타"
+  echo "  design   - UI/UX 디자인 변경"
+  echo "  ci       - CI/CD 관련 변경"
+  echo "  perf     - 성능 개선"
+  echo ""
+  exit 1
+fi
+
+# 5. 이슈 번호 체크
+if ! echo "$first_line" | grep -qE "\(#[0-9]+\)$"; then
+  echo ""
+  echo "❌ 커밋 메시지에 이슈 번호가 없습니다."
+  echo ""
+  echo "올바른 형식: type: 메시지 (#이슈번호)"
+  echo "예시: feat: 로그인 기능 구현 (#123)"
+  echo ""
+  exit 1
+fi
+
+# 6. 헤더 길이 체크 (100자)
+length=${#first_line}
+if [ "$length" -gt 100 ]; then
+  echo ""
+  echo "❌ 커밋 메시지가 너무 깁니다. (현재: ${length}자)"
+  echo ""
+  echo "커밋 헤더는 100자 이내로 작성해주세요."
+  echo ""
+  exit 1
+fi
+
+# 모든 체크 통과 시 commitlint 실행
+npx --no -- commitlint --edit "$1"

.husky/pre-commit

@@ -0,0 +1 @@
+npx lint-staged

.husky/pre-push

@@ -0,0 +1,76 @@
+#!/bin/sh
+
+branch=$(git rev-parse --abbrev-ref HEAD)
+
+# main, develop 브랜치는 허용
+if [ "$branch" = "main" ] || [ "$branch" = "develop" ]; then
+  exit 0
+fi
+
+# 허용된 타입
+allowed_types="feat|fix|refactor|design|chore|docs"
+
+# 1. 기본 형식 체크 (type/xxx 형식인지)
+if ! echo "$branch" | grep -qE "^[a-zA-Z]+/"; then
+  echo ""
+  echo "❌ 브랜치 이름 형식이 올바르지 않습니다."
+  echo ""
+  echo "올바른 형식: type/설명#이슈번호"
+  echo "예시: feat/login#12, fix/button-click#34"
+  echo ""
+  exit 1
+fi
+
+# 2. 타입 추출
+type=$(echo "$branch" | sed 's/\/.*//')
+
+# 3. 대문자 체크
+if echo "$branch" | grep -qE "[A-Z]"; then
+  echo ""
+  echo "❌ 브랜치 이름은 소문자만 사용해야 합니다."
+  echo ""
+  echo "잘못된 예: Feat/login#12, feat/Login#12"
+  echo "올바른 예: feat/login#12, fix/button#34"
+  echo ""
+  exit 1
+fi
+
+# 4. 허용된 타입인지 체크
+if ! echo "$type" | grep -qE "^($allowed_types)$"; then
+  echo ""
+  echo "❌ '$type'은(는) 허용되지 않는 브랜치 타입입니다."
+  echo ""
+  echo "허용된 타입:"
+  echo "  feat     - 새로운 기능"
+  echo "  fix      - 버그 수정"
+  echo "  refactor - 리팩토링"
+  echo "  design   - UI/UX 디자인 변경"
+  echo "  chore    - 빌드, 설정 등 기타"
+  echo "  docs     - 문서 작업"
+  echo ""
+  exit 1
+fi
+
+# 5. 이슈 번호 체크 (끝에 #숫자)
+if ! echo "$branch" | grep -qE "#[0-9]+$"; then
+  echo ""
+  echo "❌ 브랜치 이름에 이슈 번호가 없습니다."
+  echo ""
+  echo "올바른 형식: type/설명#이슈번호"
+  echo "예시: feat/login#12, fix/button-click#34"
+  echo ""
+  exit 1
+fi
+
+# 6. 허용되지 않는 문자 체크
+if echo "$branch" | grep -qE "[^a-z0-9/#\-]"; then
+  echo ""
+  echo "❌ 브랜치 이름에 허용되지 않는 문자가 있습니다."
+  echo ""
+  echo "허용: 소문자(a-z), 숫자(0-9), 하이픈(-), 슬래시(/), 샵(#)"
+  echo "예시: feat/user-login#12"
+  echo ""
+  exit 1
+fi
+
+exit 0

.nvmrc

@@ -0,0 +1 @@
+22

.prettierignore

@@ -0,0 +1,3 @@
+# Ignore artifacts:
+build
+coverage

.prettierrc

@@ -0,0 +1,19 @@
+{
+  "singleQuote": true,
+  "semi": true,
+  "tabWidth": 2,
+  "useTabs": false,
+  "trailingComma": "all",
+  "printWidth": 100,
+  "bracketSpacing": true,
+  "arrowParens": "always",
+  "plugins": ["@trivago/prettier-plugin-sort-imports"],
+  "importOrder": [
+    "^react",
+    "^[a-z]",
+    "^@/(.*)$",
+    "^[./]"
+  ],
+  "importOrderSeparation": true,
+  "importOrderSortSpecifiers": true
+}

.vscode/settings.json

@@ -0,0 +1,11 @@
+{
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "editor.formatOnSave": true,
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": "explicit"
+  },
+  "editor.tabSize": 2,
+  "files.eol": "\n",
+  "files.insertFinalNewline": true,
+  "files.trimTrailingWhitespace": true
+}