Responsive application shell with desktop and mobile navigation, plus a collapsible sidebar that remembers preferences
novasaas — Next.js Admin dashboard Template
By dvanessa
An open-source SaaS admin dashboard template built with Next.js and TypeScript, including demo authentication, role permissions, theme switching, and dashboard interfaces. Requires your own backend integration.
Explore the design
Compare the page layouts and mobile experience. Open any screenshot for a closer look.
Actual screenshot captured by the server browser.
All pages & views 2
Screenshots show visual appearance; interactive behavior may differ.
What stands out
A quick read of the recorded project description.
Dashboard displays metrics, revenue visualization, plan distribution, and activity records
Light, dark, and system-following themes, with a Cmd/Ctrl + K keyboard command menu
Demo authentication flows and typed role permissions, with permission-based navigation and client-side guards
Reusable components built on Radix UI primitives, plus a /design-system showcase page
Automated tests using Vitest and React Testing Library, with Netlify configuration included
Template Details
NovaSaaS Free is a SaaS admin dashboard frontend starter template built with Next.js, TypeScript, and Tailwind CSS. It provides a responsive application shell (desktop and mobile navigation), a collapsible sidebar that remembers browser preferences, a dashboard with metrics, revenue visualization, plan distribution, and activity records, plus light, dark, and system-following themes. UI components are built on Radix UI primitives and include a keyboard command menu (Cmd/Ctrl + K), notification previews, an organization switcher, and a user menu, with a design system showcase page at /design-system.
The template includes demo authentication flows (login, registration, password recovery, password reset, email verification) and typed role and permission configuration. Navigation shows or hides based on permissions and includes client-side route guards. Demo accounts are public frontend fixed data and are not verified by a server. Metrics, charts, users, organizations, subscriptions, billing, and more in the dashboard are all demo data.
The project explicitly states it is a frontend starter rather than a production-grade authentication system: sessions are simulated and stored in browser local storage, with no backend, database, OAuth, JWT, password hashing, real payment processing, or email sending. The sidebar also includes page entries for analytics, organizations, users, roles, subscriptions, billing, invoices, notifications, audit logs, and settings, but these pages only provide navigation, permission, and layout foundations and do not implement backend business operations. Production use requires integrating your own API and database and enforcing authorization on the server side.
Is it right for your project?
Use Cases
- As a frontend starting point for a SaaS admin interface, first set up the shell, navigation, and dashboard layout
- Demonstrate or prototype permission-controlled navigation and access-restricted pages
- As a reference implementation for a design system and accessible components (Radix UI primitives)
Suitable For
- Developers who need a Next.js + TypeScript + Tailwind CSS admin frontend skeleton
- Teams preparing to integrate their own API, database, and production authentication
- Personal projects looking for a reference frontend implementation of role permissions and theme switching
Getting started & customization
Use these recorded setup notes alongside the repository instructions for your chosen version.
- 1
Requires Node.js 20.9 or higher and npm 10 or higher
- 2
After cloning the repository, run npm ci to install dependencies, then npm run dev to start the development server
- 3
Demo accounts (e.g., [email protected] / password) are public frontend fixed data and must not be used in production
- 4
Before production use, replace the demo authentication service in src/features/auth/services/auth.service.ts and integrate your own backend and database
- 5
When deploying to Netlify, use the build command npm run build and the publish directory .next; the project does not use static export
License & source material
Usage conditions & limitations
Free to use · keep license noticeThis listing covers the free version under the MIT license in the public repository; the free scope applies to that version's code and does not imply that external services or third-party assets are free.
Must comply with when using
- You may use, modify, commercialize, and distribute this version's code for free.
- When distributing copies or substantial portions of the code, retain the original author's copyright notice and the full MIT license notice.
- The code is provided as is; warranties and limitations of liability are governed by the original license and applicable law.
Additional costs & items to verify
- Project materials mention an optional paid version or features; this listing only covers the public free code and does not include paid upgrades.
- Demo images, fonts, icons, and other third-party assets must be checked against their respective licenses and cannot be judged solely by the code's MIT license.
- External services such as domains, hosting, databases, payments, or AI may incur separate charges.
- Demo accounts are only public frontend fixed data and are not verified by a server; they must never be reused in production.
- Metrics, charts, activities, users, organizations, subscriptions, billing, and more in the dashboard are all demo data and cannot be used directly in production.
- Before production use, you must integrate your own backend/API and database, enforce server-side authorization, and configure production authentication.
- This project is a frontend starter, not a production-grade authentication system, and cannot be used directly for production authentication.
- Sessions are simulated and stored only in browser local storage, without real security.
- Route guards and hidden controls are presentational only, not security boundaries, and cannot be used as access control measures.
- The project does not include a backend, database, OAuth, JWT, password hashing, real payment processing, or email sending.
- Production authorization must be enforced by your own backend for every protected endpoint and data operation.
- Pages such as analytics, organizations, users, roles, subscriptions, and billing only provide navigation, permission, and layout foundations and do not implement backend business operations.
- Advanced data tables, CRUD workflows, configurable roles, billing interfaces, richer analytics, API adapters, and more are part of a future Pro version and are not included in the free version.
- Deployment to Netlify relies on its automatically provided Next.js adapter; the project does not use static export.
View Original Text Basis
Permission is hereby granted, free of charge
Original License Text
These credentials are public frontend fixtures. They do not authenticate against a server and must never be reused in production.
Original README
All dashboard metrics, charts, activities, users, organizations, subscriptions, billing values, and related records displayed in NovaSaaS Free are demonstration fixture data.
Original README
Before production use, connect your own backend/API and database, implement server-side authorization, and configure production authentication.
Original README
NovaSaaS Free is a frontend starter, not a production authentication system.
Original README
Sessions are simulated and stored in browser local storage.
Original README
Route guards and hidden controls are presentation behavior, not security boundaries.
Original README
There is no backend, database, OAuth, JWT, password hashing, real payment processing, or email delivery.
Original README
Production authorization must be enforced by your backend for every protected endpoint and data operation.
Original README
These pages intentionally provide navigation, permissions, and layout foundations without pretending to implement backend business operations.
Original README
A separate future Pro edition may add advanced data tables, CRUD workflows, organizations, configurable roles, billing screens, richer analytics, API adapters, and additional layouts.
Original README
https://github.com/dvanessa/novasaas/blob/main/LICENSEhttps://github.com/dvanessa/novasaas/blob/main/README.mdNetlify automatically provides its Next.js adapter; this project does not use static export.
Original README
Compiled by DeepSeek based on repository license and README ·2026-10-09. Results only cover the materials read; dependencies, images, fonts, and subsequent term changes are subject to their respective original texts.
Project checks & description sources
Template Information
- Source platforms
- GitHub
- Documentation and maintenance reference score
- More documented · 85 / 100
- Technologies
- Next.js · React
- Website type
- Admin dashboard · SaaS · Starter
How this score is calculated
Our heuristic uses license records (up to 30), a demo link (12), a preview (10), stars (15), recorded maintenance (15), description completeness (8), feature records (5) and classification data (5). It is not a code, security or performance test, or a Google score. A link does not establish tested functionality.
What to verify for this project
- Repository update recorded
- 2026-10-09
- Screenshot last checked
- 2026-10-09
A demo link is listed. Check it with your own content and viewport sizes; its presence does not confirm that forms, authentication or payments work.
The catalog identifies Next.js as the primary stack. Check the actual dependency manifest and lockfile for versions and hosting requirements. These notes use recorded metadata, not a code audit or a deployment test.
Use a selection guide →How this description was prepared
AI-assisted description based on catalog records and repository material. Repository authors are not automatically the reviewers of this description.
Review declaration: [email protected] · 2026-10-10
Inspect the recorded source material
SHA-256: 4ae2c957659bb481b6513e2fd0bb805de129f8a3950b37936f660bd98a4279f8
2026-10-09T19:51:45.899Z
Source file / repository# NovaSaaS Free An open-source SaaS admin dashboard starter built with Next.js, TypeScript, and Tailwind CSS. NovaSaaS provides a polished frontend foundation that you can connect to your own API, database, authentication provider, and business logic. [View the live demo](https://novasaas-v1.netlify.app/) · [Open the dashboard](https://novasaas-v1.netlify.app/login) [Join the NovaSaaS Pro waitlist](https://novasaas-v1.netlify.app/#pro-waitlist)  ## Highlights - Responsive application shell with desktop and mobile navigation - Collapsible sidebar with persisted browser preference - Dashboard with metrics, revenue visualization, plan distribution, and activity - Light, dark, and system themes - Keyboard command menu with `Cmd/Ctrl + K` - Notification preview, organization switcher, and user menu - Demo authentication, registration, recovery, and email-verification flows - Typed roles, permissions, permission-aware navigation, and client-side guards - Reusable accessible components built with Radix UI primitives - Design system showcase at `/design-system` - Automated tests with Vitest and React Testing Library - Netlify configuration included ## Demo accounts | Role | Email | Password | | ----------- | ------------------ | ---------- | | Super Admin | `[email protected]` | `password` | | Manager | `[email protected]` | `password` | | Member | `[email protected]` | `password` | These credentials are public frontend fixtures. They do not authenticate against a server and must never be reused in production. All dashboard metrics, charts, activities, users, organizations, subscriptions, billing values, and related records displayed in NovaSaaS Free are demonstration fixture data. Before production use, connect your own backend/API and database, implement server-side authorization, and configure production authentication. ## Technology - Next.js 16 with the App Router - React 19 - TypeScript in strict mode - Tailwind CSS 4 - Radix UI primitives - Lucide React - React Hook Form and Zod - next-themes - Vitest and React Testing Library - ESLint and Prettier ## Getting started Requirements: - Node.js 20.9 or newer - npm 10 or newer ```bash git clone https://github.com/dvanessa/novasaas.git cd novasaas npm ci npm run dev ``` Open [http://localhost:3000](http://localhost:3000). ## Available scripts ```bash npm run dev # Start the development server npm run build # Create a production build npm run start # Run the production server npm run lint # Run ESLint npm run typecheck # Check TypeScript npm run test # Run the test suite npm run audit:production # Audit production dependencies npm run test:watch # Run tests in watch mode npm run format # Format the codebase npm run format:check # Check formatting ``` ## Project structure ```text src/ ├── app/ # App Router pages and layouts ├── components/ │ ├── auth/ # Authentication and permission guards │ ├── dashboard/ # Application shell and dashboard modules │ ├── theme/ # Theme provider and selector │ └── ui/ # Reusable UI primitives ├── config/ # App, auth, navigation, and permissions config ├── features/auth/ # Forms, schemas, services, and auth tests ├── hooks/ # Authentication and permission hooks ├── lib/ # Navigation, permissions, and shared utilities ├── stores/ # Demo session store └── types/ # Shared TypeScript types ``` ## Routes The working demo includes: - `/` — product landing page - `/login`, `/register`, `/forgot-password`, `/reset-password`, `/verify-email` - `/dashboard` — completed Free dashboard overview - `/design-system` — tokens and component showcase - `/forbidden` — access-denied state The sidebar also includes integration-ready starter pages for analytics, organizations, users, roles, subscriptions, billing, invoices, notifications, audit logs, and settings. These pages intentionally provide navigation, permissions, and layout foundations without pretending to implement backend business operations. ## Authentication and security NovaSaaS Free is a frontend starter, not a production authentication system. - Sessions are simulated and stored in browser local storage. - Route guards and hidden controls are presentation behavior, not security boundaries. - There is no backend, database, OAuth, JWT, password hashing, real payment processing, or email delivery. - Production authorization must be enforced by your backend for every protected endpoint and data operation. The async interface in `src/features/auth/services/auth.service.ts` is the replacement point for a real backend implementation. ## Customization 1. Update product metadata in `src/config/app.config.ts`. 2. Adjust semantic color tokens in `src/app/globals.css`. 3. Configure navigation in `src/config/navigation.ts`. 4. Configure roles and permissions in `src/config/permissions.config.ts`. 5. Replace the demo auth service with your server integration. 6. Replace dashboard fixture data with API responses. ## Deploying to Netlify Import `dvanessa/novasaas` in Netlify and use: ```text Base directory: (empty) Build command: npm run build Publish directory: .next Production branch: main ``` The root `netlify.toml` contains the build and publish configuration. Netlify automatically provides its Next.js adapter; this project does not use static export. ## Free and Pro editions NovaSaaS Free contains the reusable shell, dashboard overview, design system, demo authentication, and permission foundations. A separate future Pro edition may add advanced data tables, CRUD workflows, organizations, configurable roles, billing screens, richer analytics, API adapters, and additional layouts. | Capability | Free | Planned Pro | | ----------------------------------- | :--: | :---------: | | Responsive dashboard shell | ✓ | ✓ | | Theme and design system | ✓ | ✓ | | Demo auth and permissions | ✓ | ✓ | | Advanced analytics and filters | — | ✓ | | Production-ready data tables | — | ✓ | | Complete CRUD workflows | — | ✓ | | Billing and invoice screens | — | ✓ | | Additional layouts and API adapters | — | ✓ | Follow the repository to receive NovaSaaS Pro development updates. ## Contributing and feedback Issues and feature suggestions are welcome in the [GitHub repository](https://github.com/dvanessa/novasaas/issues). Please avoid including passwords, tokens, customer data, or other private information in a public issue. ## License NovaSaaS Free is available under the [MIT License](LICENSE). ## Author Created by Vanessa Duarte.
Explore similar templates
Compare previews and descriptions within the same stack and category.

Next.js SaaS Starter
The official Next.js SaaS starter template, integrating email/password authentication, Stripe Checkout subscriptions, a dashboard with user/team CRUD, basic Owner/Member RBAC, and activity logging.
Next.js · SaaS

Next.js Commerce
Vercel's officially maintained Next.js App Router ecommerce starter with deep Shopify integration, offering a complete product catalog, cart, and checkout flow. Core logic is modular for swapping backends, and community provider versions exist for BigCommerce, Medusa, and Saleor.
Next.js · E-commerce

Next-js-Boilerplate
A developer-first Next.js 16 starter with Tailwind CSS 4 and TypeScript, supporting both App Router and Page Router.
Next.js · Starter

tailwind-nextjs-starter-blog
A Next.js and Tailwind CSS blog starter template using Contentlayer for Markdown/MDX, with built-in SEO, code highlighting, and tags. It targets personal technical blogs and migration from Jekyll/Hugo to React, and supports one-click Vercel deployment.
Next.js · Blog

next-forge
next-forge is a Turborepo-based Next.js template maintained by Vercel, positioned as a starting point for SaaS products.
Next.js · Starter

SaaS-Boilerplate
SaaS-Boilerplate is an open-source SaaS starter template built with Next.js App Router, React 19, TypeScript, Tailwind CSS, and Shadcn UI.
Next.js · SaaS
