DEV Community

Salman Shahriar
Salman Shahriar

Posted on

I got tired of bloated Next.js boilerplates locking me into databases, so I built my own (Open Source)

Let’s be honest. Setting up a production-ready Next.js app is exhausting.

You have a killer SaaS idea. You run npx create-next-app... and then you spend the next three days fighting with Auth, configuring i18n, setting up RBAC (Role-Based Access Control), wiring up Tailwind, and arguing with ESLint/Prettier.

Or worse, you grab a popular open-source boilerplate, but it forces a massive Prisma + PostgreSQL setup down your throat. But what if you already have a backend? What if you just want to consume a Go, Python, or existing Node.js API?

After 4 years of building full-stack web apps and deploying them everywhere from Vercel to my own Coolify instances, I got sick of repeating the exact same frontend setup.

So, I built Next-Elite — a frontend-first, API-driven boilerplate that gives you the ultimate developer experience without the database lock-in.

And today, I’m open-sourcing it for everyone.

(If you just want to skip the read and see the code, drop a ⭐️ on the GitHub repo here)


🚀 What makes Next-Elite different?

Most starters give you the bare minimum or bolt on an ORM you might not even need. Next-Elite is intentionally frontend-first. It is built to consume APIs (REST/GraphQL/BFF) instead of owning a database. You can drop it on top of literally any backend you already have.

Here is the tech stack I packed into it:

  • The Bleeding Edge: Next.js 16 (App Router) + React 19 + Node.js 22.
  • UI/UX Ready: shadcn/ui + Tailwind CSS v4. (Perfect for those sleek, dark-theme, glassmorphism bento UIs we all love right now).
  • Authentication: BetterAuth baked in (Email/password + optional Google OAuth).
  • Production Gates: Vitest, Playwright E2E, ESLint 9, Prettier, Lefthook, Knip, and GitHub Actions CI.

But the real magic is in the architecture. Here are the three features I think will save you the most time:

1. 🛡️ True RBAC with Parallel Routes

Handling roles in Next.js can get messy fast. In Next-Elite, I implemented permission-based RBAC with server-side guards (requireUser, requirePermission).

But here is the coolest part: Parallel Routes for Dashboards.
Instead of writing a messy if (user.role === 'admin') inside your page, Next-Elite uses Next.js parallel routes (@admin, @user).

Your /dashboard route stays completely role-agnostic. The layout automatically picks the right slot based on the user's BetterAuth permissions. It is incredibly clean.

2. 🌍 Type-Safe i18n (6 Languages out of the box)

Localization is usually an afterthought that breaks everything when you finally implement it. I set up next-intl with cookie-based locales (no ugly URL prefixes!) supporting English, Bengali (বাংলা), Arabic (العربية - RTL), French, Spanish, and Chinese.

And yes, it’s 100% type-safe. If you type t("navigation.hme") instead of home, your build fails. No more missing translation keys in production.

3. 🧪 Instant "Demo Mode" for Previews

Want to show off a staging environment without forcing clients or users to register?

Next-Elite ships with a self-contained Demo module. Just set NEXT_PUBLIC_DEMO_MODE=true in your .env. Your login page will automatically render a click-to-fill credentials panel and auto-register seed accounts on the first sign-in.

Going to production? Just set it to false (or delete the src/features/auth/demo/ folder entirely). Your auth provider and RBAC stay completely untouched.


🛠️ How to get started right now

You can have a production-ready, internationalized, auth-protected app running locally in under 60 seconds:

git clone https://github.com/salmanshahriar/Next-Elite.git
cd Next-Elite
npm install
cp .env.example .env
npm run dev

Enter fullscreen mode Exit fullscreen mode

Open up http://localhost:3000 and you are good to go.

It even includes a pre-configured Dockerfile based on Node 22 Alpine if you prefer deploying via Docker Compose or PaaS tools like Coolify.

Let's make this the standard

I built Next-Elite because I wanted a starter that respected my time, respected modern UI/UX workflows, and didn't force a database choice on me. If you’re building SaaS products, agency portals, or complex dashboards, this will save you a massive amount of boilerplate fatigue.

I’d love your feedback, PRs, and support!

If you find this valuable, please head over to GitHub and give it a ⭐️ star. It helps more developers find the project and tells me I should keep building out features for it!

👉 Check out Next-Elite on GitHub

Let me know what you think in the comments below! What feature do you look for most in a Next.js boilerplate?

Top comments (0)