nextjs15-init

name	nextjs15-init
description	Use when user wants to create a new Next.js 15 project (Todo/Blog/Dashboard/E-commerce/Custom domain) with App Router, ShadCN, Zustand, Tanstack Query, and modern Next.js stack

NextJS 15 Init Skill

도메인 기반 Next.js 15 프로젝트를 생성하고 현대적인 스택으로 자동 설정합니다. Todo, Blog, Dashboard, E-commerce 또는 Custom 도메인을 선택하여 App Router 기반의 완전한 CRUD 앱을 즉시 생성할 수 있습니다.

Quick Start

스킬 실행 시 다음 정보를 입력받습니다:

• 폴더명 (예: my-todo-app)
• 프로젝트명 (예: todo-app)
• 도메인 선택 (Todo/Blog/Dashboard/E-commerce/Custom)
• 스택 프리셋 (Minimal/Essential/Full Stack/Custom)

그 후 자동으로 다음 단계가 실행됩니다:

# 1. Next.js 15 프로젝트 생성 (App Router, TypeScript, Tailwind)
npx create-next-app@latest [폴더명] --typescript --tailwind --app --use-npm

# 2. 패키지 설치
npm install

# 3. 도메인별 App Router 구조 자동 생성
# - app/[domain]/ (페이지)
# - components/[domain]/ (컴포넌트)
# - lib/stores/[domain].ts (Zustand 스토어)
# - lib/api/[domain].ts (API 로직)
# - lib/validations/[domain].ts (Zod 스키마)

# 4. 코드 품질 검증 (필수)
npm run lint

# 5. 개발 서버 실행
npm run dev

Task Instructions

IMPORTANT: 이 스킬은 대화형으로 진행됩니다.

Step 1: 도메인 및 프로젝트 설정 질문

먼저 사용자에게 이렇게 물어보세요:

"Next.js 15 앱을 생성합니다. 다음 정보를 알려주세요:

1. 도메인(엔티티) 선택

어떤 도메인의 앱을 만드시겠습니까?

A) Todo (할 일 관리)

• 필드: title, description, completed, createdAt, updatedAt
• 기능: CRUD, 필터링(전체/진행중/완료), 체크박스 토글
• API: /api/todos (GET, POST, PATCH, DELETE)