AI 코딩 도구첫입무료
Claude Code 프로젝트 세팅 자동화
Claude Code를 사용해서 새 프로젝트의 폴더 구조, 설정 파일, 보일러플레이트를 한번에 생성하는 프롬프트
528명 사용
프롬프트 미리보기
새 프로젝트를 세팅해줘. 아래 기술 스택을 사용해. 기술 스택: - Next.js 15 (App Router) - TypeScript strict mode - Prisma + PostgreSQL - NextAuth.js (카카오/구글) - Tailwind CSS 4 + shadcn/ui
전체 프롬프트
새 프로젝트를 세팅해줘. 아래 기술 스택을 사용해.
기술 스택:
- Next.js 15 (App Router)
- TypeScript strict mode
- Prisma + PostgreSQL
- NextAuth.js (카카오/구글)
- Tailwind CSS 4 + shadcn/ui
프로젝트 구조:
src/
app/
api/auth/[...nextauth]/route.ts
layout.tsx
page.tsx
components/
ui/ # shadcn 컴포넌트
providers/ # SessionProvider 등
lib/
prisma.ts # PrismaClient 싱글톤
auth.ts # NextAuth 설정
utils.ts # cn() 유틸리티
types/
설정 파일:
- tsconfig.json (strict: true, paths 설정)
- .env.example (필수 환경변수 목록)
- prisma/schema.prisma (User, Account, Session 모델)
- CLAUDE.md (AI 코딩 룰 파일)
코딩 컨벤션:
- 함수형 컴포넌트 only
- named export 우선 (default는 page.tsx만)
- 에러 핸들링: try-catch + 사용자 친화적 메시지
- API 응답: { success: boolean, data?: T, error?: string }이 프롬프트 사용법
1
빈 폴더를 만들고 터미널에서 Claude Code 실행
2
이 프롬프트를 그대로 붙여넣기
3
Claude가 프로젝트 구조와 설정 파일을 자동 생성
4
.env.example을 참고해서 .env 파일 작성 후 개발 시작
예시 결과
이 프롬프트를 사용하면 아래와 비슷한 결과물을 얻을 수 있습니다.
lib/prisma.ts
typescript
import { PrismaClient } from "@prisma/client";
const globalForPrisma = globalThis as unknown as {
prisma: PrismaClient | undefined;
};
export const prisma =
globalForPrisma.prisma ??
new PrismaClient({
log: process.env.NODE_ENV === "development"
? ["query"] : [],
});
if (process.env.NODE_ENV !== "production") {
globalForPrisma.prisma = prisma;
}