MyNewName Next.js프로젝트 생성

npm install -D tailwindcss@^3.3.0 postcss@^8.4.0 autoprefixer@^10.4.0

npx tailwindcss init -p

Next.js 프로젝트 생성

npx create-next-app@latest
✔ What is your project named? … my-next-app  <-- 원하는 프로젝트 이름 입력
✔ Would you like to use TypeScript? … Yes
✔ Would you like to use ESLint? … Yes
✔ Would you like to use Tailwind CSS? … Yes
✔ Would you like to use `src/` directory? … Yes (추천)
✔ Would you like to use App Router? (recommended) … Yes ✅ (반드시 Yes 선택)
✔ Would you like to customize the default import alias? … Yes (선택사항, @/ 사용 가능)

npm install framer-motion lucide-react class-variance-authority tailwind-variants clsx

# shadcn/ui 설치 (필요한 경우)
npx shadcn-ui@latest init

# 필요한 컴포넌트 설치
npx shadcn-ui@latest add button input tooltip

npm install @radix-ui/react-slot
npm install @radix-ui/react-tooltip
npm install tailwind-merge
npm install clsx
npm install tailwindcss-animate