Starter kit for building localized Next.js 16 (App Router) web apps with React 19, TypeScript, Tailwind CSS v4, Tolgee + next-intl, Prisma (MongoDB), Shadcn UI, Radix primitives, and a handful of developer utilities prewired.
- Localization: next-intl routing + Tolgee translations (preloaded
en,ar,tr), RTL-aware layout, locale cookie, and CLI sync scripts. - Styling & UI: Tailwind v4, Shadcn UI components, Radix UI, Lucide/Mdi icons, themes via
next-themes, framer-motion ready. - Data & State: Prisma Client generated to
src/generated/prisma, MongoDB datasource, TanStack Query (with devtools), Zustand, React Hook Form + Zod validation. - Tooling: ESLint, Prettier (with Tailwind plugin), TypeScript strictness, postcss, handy CL scripts for dev/build/lint/format/clean.
- App scaffold: App Router with metadata helpers, shared page definitions, global fonts, and sample home page showing language/theme switchers.
- Node.js version supported by Next.js 16 (a
.nvmrcwithv22.16.0is provided as a baseline, but any compatible 18+ runtime works). - Package manager: Bun lockfile is present (
bun.lock); Bun is the default, but npm/pnpm/yarn are fine. If you prefer Deno or plain Node, use their equivalents. - Database connection string for
DATABASE_URL(Prisma works with any supported provider; the default schema targets MongoDB and can be changed). - Tolgee project credentials (
NEXT_PUBLIC_TOLGEE_API_KEY,NEXT_PUBLIC_TOLGEE_API_URL,TOLGEE_PROJECT_ID).
- Install dependencies (example with Bun):
bun install- Copy environment template and fill values:
cp .env.example .env.development
# update PORT, Tolgee keys, DATABASE_URL, etc.- Generate the Prisma client (reads your
.env.*file):
bun run setup- Start the dev server (uses the first matching
.env.development*.envfile):
bun run devVisit http://localhost:3000.
bun run dev– Start Next.js in development with dotenv loading (use the equivalentnpm run dev/pnpm dev/yarn devif you switch package managers).bun run build– Build the Next.js app and compile scripts.bun run start– Run the production server (afterbuild).bun run lint– Type-check (ts-patch) then run ESLint.bun run format– Prettier format common source files.bun run clean– Remove.next,dist,node_modules, and TS build info files.bun run setup– Load env +prisma generate.bun run prisma– Interactive Prisma helper (generate/push/migrate/seed/studio/etc.).bun run locales– Interactive Tolgee CLI helper (push/pull/compare/sync locales).
- Translation files live in
src/i18n/*.json; keys are extracted via Tolgee (tolgee.config.mjs). - Use
bun run locales pull|push|compare|syncto keep Tolgee and the repo in sync (requires Tolgee env vars). - Language routing is under
src/app/[locale], withlocalePrefix: 'always'; RTL is enabled for Arabic.
- Schema:
src/database/schema.prismacurrently targets MongoDB with a sampleExamplemodel. Swap thedatasourceprovider/url to any Prisma-supported database (Postgres, MySQL, SQLite, etc.) as needed. - Generated client output:
src/generated/prisma. - Seeds: add seeders in
src/database/seed.tsand runbun run prisma seed. - Adjust Prisma config in
prisma.config.tsif you change paths or add migrations.
src/app– App Router entry, layouts, locales, error/not-found pages.src/components– Reusable UI components (Shadcn/Radix).src/config– App + page definitions and other configuration.src/i18n– Static translation JSON files.src/lib– Integrations (Tolgee, Prisma helpers, metadata, TanStack Query).src/database– Prisma schema and seeding.public– Static assets (includesfavicon.ico, logo).
- Build with
bun run build; start withbun run start. - Ensure production env vars are set (
.env.production*is auto-picked up by scripts). - If using a different package manager, run the equivalent
npm run .../pnpm ...commands.