20.06 nextjs - yojulab/learn_promptengineerings GitHub Wiki
๊ฐ๋ฐ ๊ฐ์ด๋ ๋ฌธ์
๊ธฐ์ ํ๊ฒฝ ์ด๊ธฐํ
- ์ต์ ๋ฒ์ ์ฌ์ฉ
- ๊ธฐ์ ์คํ: nextjs, typescript, tailwindCSS, ShadCN
๊ฐ๋ฐ ๊ฐ์ด๋ ์์ฑ: .cursorrule
### Best Practices
- TypeScript ํ์
์ ๋ฐ๋์ ์ ์ํด์ผ ํฉ๋๋ค
- ์ปดํฌ๋ํธ๋ ์ฌ์ฌ์ฉ ๊ฐ๋ฅํ๋๋ก ์ค๊ณํด์ผ ํฉ๋๋ค
### Component Guidelines
#### ShadCN Components
- ๋ชจ๋ UI ์ปดํฌ๋ํธ๋ ShadCN์ ์ฌ์ฉํด์ผ ํฉ๋๋ค.
- ์ปดํฌ๋ํธ ์ฌ์ฉ ์ ์ค์น ์ฌ๋ถ๋ฅผ ํ์ธํด์ผ ํฉ๋๋ค: '/components/ui' ๋๋ ํ ๋ฆฌ ์ฒดํฌ
- ์ปดํฌ๋ํธ ์ค์น ๋ช
๋ น์ด๋ฅผ ์ฌ์ฉํด์ผ ํฉ๋๋ค: 'npx shadcn@latest add [component-name]'
- ์ฃผ์์ฌํญ:
- 'npx shadcn-ui@latest add' ๋ช
๋ น์ด๋ deprecated. ๋ฐ๋์ 'npx shadcn@latest add' ์ฌ์ฉํด์ผ ํฉ๋๋ค
#### Icons
- ๋ชจ๋ ์์ด์ฝ์ Lucide React๋ฅผ ์ฌ์ฉํด์ผ ํฉ๋๋ค
- ์์ด์ฝ ์ํฌํธ ๋ฐฉ๋ฒ: 'import { IconName } from "lucide-react"'
- ์์: "import { Search, Menu } from "lucide-react"'
#### Component Structure
- ์ปดํฌ๋ํธ๋ '/components' ๋๋ ํ ๋ฆฌ ๋ด์ ์์นํด์ผ ํฉ๋๋ค
- UI ์ปดํฌ๋ํธ๋ '/components/ui' ๋๋ ํ ๋ฆฌ์ ์์นํด์ผ ํฉ๋๋ค
- ํ์ด์ง๋ณ ์ปดํฌ๋ํธ๋ '/app' ๋๋ ํ ๋ฆฌ ๋ด ํด๋น ๋ผ์ฐํธ์ ์์นํด์ผ ํฉ๋๋ค
๊ฐ๋ฐ ๊ตฌํ ๊ฐ์ด๋ doc: ./docs
module build: rpm build
๋ฐฐํฌ: Vercel
- Vercel์ CLI ๋ช
๋ น์ด๋ฅผ ํ์ฉํด์ ๋ฐฐํฌ๋ฅผ ์งํ
- GitHub ์ฐ๋ํ์ง ์๊ณ ๋ฐ๋ก Vercel์ ๋ฐฐํฌ ์งํ