nextjs-bun-prisma-stack
1
总安装量
1
周安装量
#48382
全站排名
安装命令
npx skills add https://github.com/yigit433/nextjs-skills --skill nextjs-bun-prisma-stack
Agent 安装分布
amp
1
opencode
1
kimi-cli
1
codex
1
github-copilot
1
claude-code
1
Skill 文档
nextjs-bun-prisma-stack
Amaç
Sıfırdan bir Next.js (App Router) projesi oluÅturur. Bun runtime/package manager, Prisma ORM, Tailwind CSS ve Biome formatter/linter ile tam entegre, production-ready bir iskelet saÄlar.
Ne Zaman Kullanılır
- Yeni bir full-stack Next.js projesi baÅlatılacaksa.
- Bun + Prisma + Tailwind + Biome standart stack’i isteniyorsa.
- Tutarlı bir proje yapısına ihtiyaç varsa.
Ãn KoÅullar
- Bun >= 1.0 kurulu
- Docker ve Docker Compose kurulu
- Node.js >= 18 (Next.js uyumluluk)
SaÄlanan Template Dosyalar
| Dosya | Açıklama |
|---|---|
templates/docker-compose.yml |
PostgreSQL 16 container |
templates/.env.example |
Ortam deÄiÅkenleri |
templates/biome.json |
Biome formatter + linter |
templates/tsconfig.json |
TypeScript strict config |
templates/prisma/schema.prisma |
Base Prisma schema |
templates/prisma/seed.ts |
Ãrnek seed dosyası |
Adımlar
1. Next.js projesi oluÅtur
bun create next-app@latest my-app --typescript --tailwind --eslint=false --app --src-dir --import-alias "@/*"
cd my-app
ESLint devre dıÅı çünkü Biome kullanılacak.
2. ESLint’i kaldır, Biome’u kur
bun remove eslint eslint-config-next
bun add -d @biomejs/biome
templates/biome.json dosyasını proje kök dizinine kopyala:
cp ../templates/biome.json ./biome.json
package.json‘a script’leri ekle:
{
"scripts": {
"check": "biome check .",
"check:fix": "biome check --write .",
"format": "biome format --write ."
}
}
3. Prisma kur ve konfigüre et
bun add prisma @prisma/client
bunx prisma init
OluÅan prisma/schema.prisma dosyasını templates/prisma/schema.prisma ile deÄiÅtir veya üzerine yaz. Seed dosyasını kopyala:
cp ../templates/prisma/schema.prisma ./prisma/schema.prisma
cp ../templates/prisma/seed.ts ./prisma/seed.ts
package.json‘a seed config ekle:
{
"prisma": {
"seed": "bun prisma/seed.ts"
}
}
4. Docker Compose ile PostgreSQL ayarla
cp ../templates/docker-compose.yml ./docker-compose.yml
cp ../templates/.env.example ./.env.example
cp .env.example .env
.env dosyasındaki deÄerleri düzenle, ardından:
docker compose up -d
5. İlk migration
bunx prisma migrate dev --name init
bunx prisma generate
6. Proje yapısını standartlaÅtır
src/
âââ app/
â âââ layout.tsx
â âââ page.tsx
â âââ api/
âââ components/
âââ lib/
â âââ prisma.ts # PrismaClient singleton
âââ types/
âââ styles/
src/lib/prisma.ts â Prisma singleton:
import { PrismaClient } from "@prisma/client";
const globalForPrisma = globalThis as unknown as {
prisma: PrismaClient | undefined;
};
export const prisma = globalForPrisma.prisma ?? new PrismaClient();
if (process.env.NODE_ENV !== "production") {
globalForPrisma.prisma = prisma;
}
7. DoÄrulama
bun dev # Proje çalıÅıyor mu?
bun run check # Biome hatasız mı?
bunx prisma studio # DB baÄlantısı çalıÅıyor mu?
DoD (Definition of Done)
-
bun devile proje ayaÄa kalkıyor. - Prisma client generate edilebiliyor.
- Tailwind sınıfları çalıÅıyor.
-
bun run check(Biome) hatasız geçiyor. - PostgreSQL container çalıÅıyor ve baÄlantı baÅarılı.
- Proje yapısı standartlaÅtırılmıŠ(
src/lib,src/components, vb.).