Lewati ke konten
create-nextjs-kit

Arsitektur

src/
├── app/ # routing saja: layout, page, loading, error, route handler
├── features/ # satu folder per domain bisnis (inti aplikasi)
├── components/ # ui/ = primitive design system; providers.tsx
├── server/ # hanya server, setiap file diawali import "server-only"
├── lib/ # util murni, aman untuk client dan server
├── config/ # env.ts (tervalidasi Zod) dan site.ts
└── styles/

ESLint menegakkan aturan ini. Kalau import ditolak, pindahkan kode ke lapisan yang benar, jangan menonaktifkan aturannya.

  1. app/ boleh import features/, components/, server/, lib/, config/.
  2. features/<x> boleh import components/, server/, lib/, config/, dan fitur lain hanya lewat features/<y>/index.ts atau features/<y>/server.ts.
  3. components/ hanya boleh import lib/.
  4. server/ hanya boleh import lib/ dan config/.
  5. lib/ dan config/ tidak import lapisan aplikasi mana pun.
features/todos/
├── components/ # komponen khusus fitur
├── actions.ts # "use server": mutasi
├── queries.ts # import "server-only": baca data
├── schemas.ts # Zod, sumber kebenaran tipe input
├── types.ts
├── index.ts # public API aman untuk client
└── server.ts # public API server-only

Salin pola features/todos untuk fitur baru.

  • Default ke Server Component. Tambahkan "use client" hanya di komponen daun.
  • Setiap Server Action: validasi dengan Zod, cek otorisasi, tulis data, revalidatePath atau revalidateTag, lalu kembalikan ActionResult dari @/lib/action-result.
  • Baca env hanya lewat env dari @/config/env, bukan process.env.
  • Logging di server lewat logger dari @/server/logger.

Konvensi lengkap ada di AGENTS.md pada proyek hasil generate. Berkas itu juga dibaca oleh AI coding agent.