Project Packages

한국 서비스용 dayjs 중앙 setup 파일을 생성. timezone(Asia/Seoul) + 한국어 locale + utc/timezone plugin을 한 번에 등록하고, parseDateOnly/formatDateOnly/parseTimestamp/formatDateTime/extractTime 같은 자주 쓰는 헬퍼를 묶어 lib/dayjs.ts로 박아넣는다. "dayjs 세팅", "날짜 모듈화", "한국 타임존 설정", "date-fns 대신 dayjs", "lib/dayjs.ts 만들어줘", "날짜 포맷 헬퍼" 같은 요청에 트리거. 새 프로젝트 초기 세팅이나 기존 프로젝트의 흩어진 dayjs 호출을 중앙화할 때 사용.

새 프론트엔드 프로젝트 초기 세팅 시 표준 패키지 설치 + 중앙 setup 파일들을 한 번에 적용하는 마스터 스킬. tailwind cn 유틸, dayjs KST, (추후) TanStack Query, Zustand, Supabase 클라이언트, Server Action/Form 패턴까지 묶어 처리. "프로젝트 초기 세팅", "표준 setup 박아줘", "lib 폴더 표준화", "패키지 표준 적용", "새 프로젝트 부트스트랩" 같은 요청에 트리거. shadcn init 직후 또는 새 Next.js 프로젝트 생성 직후 사용.

기능별 표준 패키지 룩업 표. "PDF 파싱하려면 뭘 써야 해?", "이미지 크롭 라이브러리 추천", "차트 어떤 거 써?", "토스트는 어느 라이브러리?", "스프레드시트 다루는 패키지" 같은 "이 기능 → 어떤 패키지" 질문에 트리거. 본인 표준 답을 통일하는 reference 스킬. 새로운 기능을 시작할 때 매번 다른 라이브러리를 고르지 않도록 함.

shadcn/ui 사용 프로젝트의 표준 cn() 유틸을 세팅. Tailwind class 병합 헬퍼(clsx + tailwind-merge)와 KRW 통화 포맷 등 자주 쓰는 유틸을 lib/utils.ts에 박아넣는다. 새 프로젝트 시작 시, 또는 "cn 유틸 세팅", "tailwind merge 헬퍼 추가", "shadcn utils 만들어줘", "lib/utils.ts 표준화" 같은 요청에 트리거. shadcn/ui CLI(`npx shadcn@latest init`)를 막 돌렸거나 돌리려는 시점에 사용.

Zustand 표준 store 패턴(State/Actions 인터페이스 분리)과 인증 사용자 store(useUserStore)를 stores/ 폴더에 박는다. Supabase 인증과 연결된 fetchUser/logout/reset 액션 포함. "zustand 세팅", "store 만들어줘", "user store 추가", "인증 store 셋업", "zustand 스토어 패턴 적용" 등에 트리거. 인증은 Supabase 사용 가정 — 다른 인증이면 fetchUser/logout 본문만 교체하면 됨.

TanStack Query 표준 setup 3종 (전역 캐시 설정, queryKey 팩토리, QueryProvider) + devtools를 한 번에 박는다. lib/query-defaults.ts에 GLOBAL_QUERY_CONFIG/SHORT_CACHE_CONFIG/REALTIME_CONFIG 정의, lib/query-keys.ts에 도메인별 query key, providers/query-provider.tsx에 클라이언트 Provider. "tanstack query 세팅", "react-query 셋업", "QueryClient 만들어줘", "queryKey 팩토리 추가", "react query provider", "리액트 쿼리 캐시 설정" 등에 트리거. SWR이 아니라 TanStack Query 사용 프로젝트가 전제.

react-hook-form + zod + shadcn/ui Form 표준 패턴 셋업. 패키지 설치, shadcn form 컴포넌트 추가, 그리고 표준 폼 예시(zod 스키마 외부, z.infer 타입, FormField 래핑)를 components/forms/ 아래에 박는다. "react-hook-form 셋업", "zod 폼 검증", "form 패턴 적용", "폼 검증 표준화", "shadcn form 추가" 등에 트리거. shadcn/ui가 이미 초기화된 프로젝트 전제.

Next.js 프로젝트에 Supabase 클라이언트 표준 4종 세트를 한 번에 세팅. 브라우저용 client, 서버용 server, RLS 우회 service-role, 그리고 세션 갱신 + 보호 라우트 리다이렉트 middleware를 lib/supabase/ 아래에 박는다. "supabase 클라이언트 세팅", "supabase ssr 셋업", "lib/supabase 만들어줘", "supabase middleware 추가", "service role 클라이언트 추가" 등에 트리거. database.types.ts(Database 제네릭)는 별도 supabase:initial-setting 스킬로 생성하는 것을 가정.