[Feature] 프론트엔드 아키텍처 셋업 #2

New Issue

seonkyu.kim · 2026-02-26T03:58:35Z

seonkyu.kim commented

2026-02-26 03:58:35 +00:00

개요

React + Vite + TypeScript 기반 프론트엔드 아키텍처 초기 셋업

작업 내용

Vite 기본 템플릿 정리 (App.css, react.svg 삭제)
index.html 수정 (lang="ko", Noto Sans KR + Material Symbols 폰트)
index.css 디자인 토큰 적용 (guideline.html 기반 HEX 색상)
타입 정의 (api.ts, user.ts, common.ts)
Zustand 스토어 (authStore, uiStore)
API 계층 (Axios client, auth.api)
Feature 모듈 8개 폴더 구조 + 18개 placeholder 페이지
레이아웃 컴포넌트 (AppLayout, AppHeader, AppSidebar, AuthLayout) - guideline.html 기준
ErrorBoundary 피드백 컴포넌트
라우터 설정 (lazy loading, ProtectedRoute, PublicRoute)
App.tsx (QueryClient + Router + Toaster + ErrorBoundary)
유틸리티 (format.ts, storage.ts)
환경변수 (.env.development, .env.example, vite-env.d.ts)

## 개요 React + Vite + TypeScript 기반 프론트엔드 아키텍처 초기 셋업 ## 작업 내용 - Vite 기본 템플릿 정리 (App.css, react.svg 삭제) - index.html 수정 (lang="ko", Noto Sans KR + Material Symbols 폰트) - index.css 디자인 토큰 적용 (guideline.html 기반 HEX 색상) - 타입 정의 (api.ts, user.ts, common.ts) - Zustand 스토어 (authStore, uiStore) - API 계층 (Axios client, auth.api) - Feature 모듈 8개 폴더 구조 + 18개 placeholder 페이지 - 레이아웃 컴포넌트 (AppLayout, AppHeader, AppSidebar, AuthLayout) - guideline.html 기준 - ErrorBoundary 피드백 컴포넌트 - 라우터 설정 (lazy loading, ProtectedRoute, PublicRoute) - App.tsx (QueryClient + Router + Toaster + ErrorBoundary) - 유틸리티 (format.ts, storage.ts) - 환경변수 (.env.development, .env.example, vite-env.d.ts)

seonkyu.kim added the

labels 2026-02-26 04:00:22 +00:00

seonkyu.kim added this to the Phase 1 - 프로젝트 초기 설정 milestone 2026-02-26 04:01:28 +00:00

seonkyu.kim self-assigned this 2026-02-26 04:01:42 +00:00

seonkyu.kim referenced this issue from a commit

2026-02-26 04:02:40 +00:00