Best 16 Free Next.js 14 Starters and Boilerplate To Speed up your Project Development in 2024

Best 16 Free Next.js 14 Starters and Boilerplate To Speed up your Project Development in 2024

As we develop our primary apps using Next.js, we wrote several articles and tutorials about it. Now, it's time to update the collection of the best open-source Next.js 14 starters and boilerplates that can save startups, agencies, and developers a lot of time and money.

But before we begin, let's explore the new features of the new Next.js 14 release.

Next.js 14 Features

Next.js 14 offers a range of exciting features and improvements that continue to enhance the developer experience. Some of the standout features include:

  • Server Components: Improved support for server-side rendering and component-based architectures, enabling more efficient and scalable applications.
  • File Uploading: Simplified file uploading processes directly within the Next.js app directory, making it easier to handle and preview file uploads.
  • Stripe Integration: Simplified payment processing with Stripe, allowing for easy setup and management of transactions.
  • Prisma ORM with Postgres: Seamless integration with Postgres databases, making database management more efficient and developer-friendly.
  • React Email and Resend: Tools for creating and sending emails using React components, enhancing email functionality within applications.
  • Layouts: Advanced layout management to create more dynamic and responsive user interfaces, improving the overall user experience.
  • UploadThing: Effortless file upload and preview functionalities, streamlining the process of managing media content.
  • LuciaAuth v3: Enhanced authentication and authorization mechanisms for secure user management, ensuring robust security protocols.
  • Enhanced API Routes: More flexible and efficient ways to define and handle API endpoints, improving backend interactions.
  • Radix UI and Tailwind CSS: Pre-built UI components and styling solutions for quick and beautiful UI development, saving development time and effort.
  • Next-International: Type-safe internationalization support for building multilingual applications, making it easier to reach a global audience.
  • Server Actions: New server-side functionalities that enable more powerful backend interactions, enhancing server capabilities.
  • App Router: Improved routing capabilities with a focus on performance and developer experience, making navigation smoother.
  • Vercel Deployments: Streamlined production and preview deployments on Vercel, simplifying the deployment process.

These features collectively make Next.js 14 a powerful and versatile framework for modern web development, enabling developers to build high-performance, scalable applications with ease.

In this collection, you will find the best open-source Next.js 14 starters that make developers' lives easier by saving them time and money.

1.  Next.js 14+ boilerplate

This Next.js 14+ project is a boilerplate and starter kit for Next.js 14+, Tailwind CSS 3, and TypeScript, designed with a focus on developer experience.

It includes tools like ESLint, Prettier, Husky, Jest, React Testing Library, Storybook, and GitHub actions.

The free boilerplate is ideal for building server-first as well as statically generated websites.

Features

  • Strict Mode for TypeScript and React 18
  • Testing with Jest and react-testing-library
  • Type checking TypeScript
  • Components generation with Plop and atomic design convention
  • Linter with ESLint
  • GH actions
  • Code Formatter with Prettier
  • Next.js for Static Site Generator
  • Husky for Git Hooks
  • Nextjs custom layouts
  • Storybook for components documentation
  • Message convention for git
  • Maximize lighthouse score
  • Integrate with Tailwind CSS
  • Absolute Imports using @ prefix
  • Lint-staged for running linters on Git staged files
  • T3 env Manage your environment variables with ease

2. Nextal

Nextal is a free starter template for NextJs with TypeScript. Supports Tailwind with CSS-Modules. Vitest and @react/testing-library configured and ready to go. Also ESLint, Prettier, Husky, Commit-lint and Atomic Design for components.

Features

GitHub - jvidalv/nextal: Starter template for NextJs with TypeScript. Supports Tailwind with CSS-Modules. Vitest and @react/testing-library configured and ready to go. Also ESLint, Prettier, Husky, Commit-lint and Atomic Design for components.
Starter template for NextJs with TypeScript. Supports Tailwind with CSS-Modules. Vitest and @react/testing-library configured and ready to go. Also ESLint, Prettier, Husky, Commit-lint and Atomic D…

3. Play Next.js (SaaS Starter)

Play Next.js is a free and Open-source SaaS starter kit and boilerplate, designed and built for SaaS startups, apps, businesses, and more.

With its premium design and essential UI components and pages, it provides everything you need to kickstart a feature-rich SaaS website.

Features

  • PostgreSQL for Database: Integration with Prisma ensures data integrity and reliability.
  • NextAuth for Authentication: Provides secure login and user management.
  • MDX for Blogs: Combines Markdown and JSX for a complete blogging solution.
  • Stripe for Subscription Payments: Robust security features and smooth checkout experiences.
  • Tailwind CSS for Styling: Highly flexible and customizable utility-first CSS framework.
  • Essential SaaS Pages & Components: Includes login, signup, blog, about, and other pages.
  • Crafted Using TailGrids Components: Offers professional aesthetics and usability, reducing development time and effort.
GitHub - NextJSTemplates/play-nextjs: Next.js 14 SaaS Boilerplate and Starter Kit designed and built for SaaS startups. It comes with all necessary integrations, pages, and components you need to launch a feature-rich SaaS websites.
Next.js 14 SaaS Boilerplate and Starter Kit designed and built for SaaS startups. It comes with all necessary integrations, pages, and components you need to launch a feature-rich SaaS websites. -…

4. Nextplate

Nextplate is a free starter template built with Next.js 14.1+ and TailwindCSS. It provides you with almost everything you need to jump-start your Next.js project. Try Nextplate and save yourself hours of work.

Features

  • πŸ‘₯ Multi-Authors
  • 🎯 Similar Posts Suggestion
  • πŸ” Search Functionality
  • πŸŒ‘ Dark Mode
  • 🏷️ Tags & Categories
  • πŸ”— Netlify setting pre-configured
  • πŸ“ž Support contact form
  • πŸ“± Fully responsive
  • πŸ“ Write and update content in Markdown / MDX
  • πŸ’¬ Disqus Comment
  • πŸ”³ Syntax Highlighting
  • πŸ“„ 15+ Pre-designed Pages
GitHub - zeon-studio/nextplate: Nextplate is a free starter template built with Next.js and TailwindCSS. It provides you with almost everything you need to jump-start your Next.js project. Try Nextplate and save yourself hours of work.
Nextplate is a free starter template built with Next.js and TailwindCSS. It provides you with almost everything you need to jump-start your Next.js project. Try Nextplate and save yourself hours of…

5. Medusa Next.js Starter Template

This is a Next.js 14.1 template for creating the perfect website with Medusa.

Features Highlight

Its features include:

  • Full ecommerce support:
    • Product Detail Page
    • Product Overview Page
    • Search with Algolia / MeiliSearch
    • Product Collections
    • Cart
    • Checkout with PayPal and Stripe
    • User Accounts
    • Order Details
  • Full Next.js 14 support:
    • App Router
    • Next fetching/caching
    • Server Components
    • Server Actions
    • Streaming
    • Static Pre-Rendering
GitHub - medusajs/nextjs-starter-medusa: A performant frontend ecommerce starter template with Next.js 14 and Medusa.
A performant frontend ecommerce starter template with Next.js 14 and Medusa. - medusajs/nextjs-starter-medusa

6. ChadNext

ChadNext is a quick starter template for Next.js projects, offering features like Next.js 14 App router, Shadcn UI, LuciaAuth, Prisma, Server Actions, Stripe, and Internationalization.

ChadNext: Quickly Build Your Next.js Project with Shadcn UI and Payment Modules
What is ChadNext? ChadNext is a quick starter template for Next.js projects, offering features like Next.js 14 App router, Shadcn UI, LuciaAuth, Prisma, Server Actions, Stripe, and Internationalization. Streamline Rapid Development It aims to streamline development, allowing for rapid prototyping, easy authentication, database interaction, and efficient deployment, ultimately

7. Next 14+ Starter

This is a feature-rich Next.js starter template, packed with features like TypeScript, Tailwind CSS, Next-auth, Eslint, Stripe, testing tools and more. Jumpstart your project with efficiency and style.

Features

  • πŸš€ Next.js 14 (App router)
  • βš›οΈ React 18
  • πŸ“˜ Typescript
  • 🎨 TailwindCSS - Class sorting, merging and linting
  • πŸ› οΈ Shadcn/ui - Customizable UI components
  • πŸ’΅ Stripe - Payment handler
  • πŸ”’ Next-auth - Easy authentication library for Next.js (GitHub provider)
  • πŸ›‘οΈ Prisma - ORM for node.js
  • πŸ“‹ React-hook-form - Manage your forms easy and efficient
  • πŸ” Zod - Schema validation library
  • πŸ§ͺ Jest & React Testing Library - Configured for unit testing
  • 🎭 Playwright - Configured for e2e testing
  • πŸ“ˆ Absolute Import & Path Alias - Import components using @/ prefix
  • πŸ’… Prettier - Code formatter
  • 🧹 Eslint - Code linting tool
  • 🐢 Husky & Lint Staged - Run scripts on your staged files before they are committed
  • πŸ”Ή Icons - From Lucide
  • πŸŒ‘ Dark mode - With next-themes
  • πŸ—ΊοΈ Sitemap & robots.txt - With next-sitemap
  • πŸ“ Commitlint - Lint your git commits
  • πŸ€– Github actions - Lint your code on PR
  • βš™οΈ T3-env - Manage your environment variables
  • πŸ’― Perfect Lighthouse score
  • 🌐 I18n with Paraglide
GitHub - Skolaczk/next-starter: A Next.js starter template, packed with features like TypeScript, Tailwind CSS, Next-auth, Eslint, Stripe, testing tools and more. Jumpstart your project with efficiency and style.
A Next.js starter template, packed with features like TypeScript, Tailwind CSS, Next-auth, Eslint, Stripe, testing tools and more. Jumpstart your project with efficiency and style. - Skolaczk/next-…

8. Nextbase Nextjs Supabase Starter

Nextbase Lite is a simple Next.js 13 + Supabase boilerplate. It includes a Next.js 13 app with Typescript, Supabase and Tailwind CSS. It includes the all new app folder, layout components, React server components and more!

Although this project is based on Next.js 13 but it can be upgraded easily to 14.1.

Features

  • πŸš€ Next.js 13 with async components
  • πŸ’» Data fetching examples in React server and client components. Suspenseful data fetching with minimal loading screens.
  • βš›οΈ React query setup configured
  • πŸ”₯ React Hot Toast component
  • πŸ’» Fully typed with Typescript. Includes automatic type generation for Supabase tables
  • 🎨 Tailwindcss
  • πŸ§ͺ Unit testing and integration testing setups built-in
  • πŸ’š Eslint, typescript, prettier, postcss configured for dev and test environments
  • πŸ“ˆ Automatic sitemap generation
  • πŸ” SEO metadata, JSON-LD and Open Graph tags with NEXT SEO
  • ✍️ Semantic release with Automatic changelog generation
  • 🎨 Prettier Code formatter
  • πŸ’Ž Minimal styling
  • πŸ“– Codebase which is easy to read and modify
GitHub - imbhargav5/nextbase-nextjs-supabase-starter: πŸš€βš‘οΈ Free Boilerplate and Starter kit for Next.js 14+, Supabase, Tailwind CSS 3.2 and TypeScript. πŸš€ Next.js πŸ”₯ Supabase πŸ’» TypeScript πŸ’š ESLint 🎨 Prettier 🐢 Husky 🧹 Lint-Staged πŸ§ͺ Jest πŸ§ͺ Testing Library πŸ•ΉοΈ Playwright ✍️ Commitizen πŸ’¬ Commitlint πŸ’» VSCode πŸŒͺ️ Vercel 🎨 PostCSS πŸƒ Tailwind CSS βš›οΈ React Query
πŸš€βš‘οΈ Free Boilerplate and Starter kit for Next.js 14+, Supabase, Tailwind CSS 3.2 and TypeScript. πŸš€ Next.js πŸ”₯ Supabase πŸ’» TypeScript πŸ’š ESLint 🎨 Prettier 🐢 Husky 🧹 Lint-Staged πŸ§ͺ Jest πŸ§ͺ Testing Library…

9. Nextjs 14+ Latest Project Template

Next14+ Latest Project Template: An easy-to-use and pre-configured project template for kick starting your Next.js 14+ projects effortlessly.

This template comes with all the necessary packages and configurations, allowing you to quickly set up and dive into developing your next cutting-edge web application with Next.js.

GitHub - MdWahiduzzamanEmon/next.js-14.2-starter-template: β€œNextjs 14+ Latest Project Template: An easy-to-use and pre-configured project template for kickstarting your Next.js 13.4+ projects effortlessly.
"Nextjs 14+ Latest Project Template: An easy-to-use and pre-configured project template for kickstarting your Next.js 13.4+ projects effortlessly. - MdWahiduzzamanEmon/next.js-14.2-starter-tem…

10. Next js 14 boilerplate

The Next Starter aims to give you a starting point with everything ready to work and launch to production. Web Vitals with 100% by default. Folder structure ready. Tooling ready. SEO ready. SSR ready.

GitHub - AnwarHossainSR/nextjs-14-template: This is next js 14 boilerplate. You can start your next 14 project without any hassle of setup.
This is next js 14 boilerplate. You can start your next 14 project without any hassle of setup. - AnwarHossainSR/nextjs-14-template

Netcs

A Personal Website and Blog Starter based on Next 14, TailwindCSS with DaisyUI, Contentful, and Turso DB.

Features

  • Flexible and composable content models
  • SEO ready with Metadata being generated based on specific SEO fields but with fallbacks in place
  • Generation of GraphQL (schema, and types), in sync with the content types via graphql-codegen.
  • Typescript
  • Tailwind CSS via DaisyUI
  • Nextjs SSR components
  • Contentful Live preview
  • Contentful Dashboard example App for visualizing stats on Articles views counts
GitHub - pauloamgomes/netcs: A Personal Website and Blog Starter based on Next 14, TailwindCSS with DaisyUI, Contentful, and Turso DB.
A Personal Website and Blog Starter based on Next 14, TailwindCSS with DaisyUI, Contentful, and Turso DB. - pauloamgomes/netcs

11. Next JS 14 boilerplate  for indiehackers!

This is a cool starter for Next.js 14 that uses Uses Postgres as DB, NextAuth 4, Tailwind CSS has support for dark modem and you can also have a Shadcn-ui version.

Features

  • Next.js 14 App Directory
  • Node pg support
  • NextAuth 4
  • Radix UI Primitives
  • Tailwind CSS
  • Google fonts
  • Icons from Lucide
  • Dark mode with next-themes
  • Tailwind CSS class sorting, merging and linting.
GitHub - soulbliss/next-js-14-starter-template: A starter template for product builders. Maintained with #buildinpublic ethos
A starter template for product builders. Maintained with #buildinpublic ethos - soulbliss/next-js-14-starter-template

12. Next Starter

The aim for this starter is to give you a starting point with everything ready to work and launch to production. Web Vitals with 100% by default. Folder structure ready. Tooling ready. SEO ready. SSR ready.

GitHub - AnwarHossainSR/nextjs-14-template: This is next js 14 boilerplate. You can start your next 14 project without any hassle of setup.
This is next js 14 boilerplate. You can start your next 14 project without any hassle of setup. - AnwarHossainSR/nextjs-14-template

13. SupaNext Starter Kit

a Next.js 14 Supabase starter with dozens of useful tools and libraries to speed up your production.

Features

  • ⚑️ Next.js 14 (App Router)
  • πŸ’š Supabase w/ supabase-ssr - Works across the entire Next.js stack (App Router, Pages Router, Client, Server, Middleware, It just works!)
  • βš›οΈ React 18
  • β›‘ TypeScript
  • πŸ“¦ pnpm - Fast, disk space efficient package manager
  • 🎨 Tailwind
  • πŸ”Œ shadcn/ui - Beautifully designed components that you can copy and paste into your apps.
  • πŸ§ͺ Jest w/SWC + React Testing Library - Unit tests for all of your code.
  • πŸŽ›οΈ MSWv2 - Intercept requests inside your tests (set up for testing only)
  • πŸͺTanStackQueryv5 - The best way to fetch data on the client
  • πŸ“ ESLint β€” To find and fix problems in your code
  • πŸ’– Prettier β€” Code Formatter for consistent style
  • 🐢 Husky β€” For running scripts before committing
  • 🚫 lint-staged β€” Run ESLint and Prettier against staged Git files
  • πŸ‘· Github Actions β€” Run Type Checks, Tests, and Linters on Pull Requests
  • πŸ—‚ Path Mapping β€” Import components or images using the @ prefix
  • βšͺ⚫ Dark mode - Toggle theme modes with next-themes
  • ✨ Next Top Loader - Render a pleasent top loader on navigation with nextjs-toploader
  • πŸ”‹ Lots Extras - Next Bundle Analyzer, Vercel Analytics, Vercel Geist Font
GitHub - michaeltroya/supa-next-starter: ⚑️Next.js, Supabase, Tailwind, shadcn⚑️The Last Next.js and Supabase Starter You Will Ever Need
⚑️Next.js, Supabase, Tailwind, shadcn⚑️The Last Next.js and Supabase Starter You Will Ever Need - michaeltroya/supa-next-starter

14. Next.js 14 Admin Dashboard Starter Template

Next.js 14 Admin Dashboard Starter Template With Shadcn-ui
Built with the Next.js App Router. It uses Auth.js, Tailwind CSS, and comes with React Hook Form, and Rich Table library.

It comes with signup page, user profiles page, kanban board, and employee pages.

GitHub - Kiranism/next-shadcn-dashboard-starter: Admin Dashboard Starter with Nextjs14 and shadcn ui
Admin Dashboard Starter with Nextjs14 and shadcn ui - Kiranism/next-shadcn-dashboard-starter

15. Next SaaS Stripe Starter

This is an open-source SaaS Starter with User Roles & Admin Panel. Built using Next.js 14, Prisma, Neon, Auth.js v5, Resend, React Email, Shadcn/ui, Stripe, Server Actions.

GitHub - mickasmt/next-saas-stripe-starter: Open-source SaaS Starter with User Roles & Admin Panel. Built using Next.js 14, Prisma, Neon, Auth.js v5, Resend, React Email, Shadcn/ui, Stripe, Server Actions.
Open-source SaaS Starter with User Roles & Admin Panel. Built using Next.js 14, Prisma, Neon, Auth.js v5, Resend, React Email, Shadcn/ui, Stripe, Server Actions. - mickasmt/next-saas-stripe-sta…

16. NextBase Starter Nextbase Lite

This is yet another πŸš€βš‘οΈ Free Boilerplate and Starter kit for Next.js 14+, Supabase, Tailwind CSS 3.2 and TypeScript. πŸš€ Next.js πŸ”₯ Supabase πŸ’» TypeScript πŸ’š ESLint 🎨 Prettier 🐢 Husky 🧹 Lint-Staged πŸ§ͺ Jest πŸ§ͺ Testing Library πŸ•ΉοΈ Playwright ✍️ Commitizen πŸ’¬ Commitlint πŸ’» VSCode πŸŒͺ️ Vercel 🎨 PostCSS πŸƒ Tailwind CSS βš›οΈ React Query.

Features

  • πŸš€ Next.js 13 with async components
  • πŸ’» Data fetching examples in React server and client components. Suspenseful data fetching with minimal loading screens.
  • βš›οΈ React query setup configured
  • πŸ”₯ React Hot Toast component
  • πŸ’» Fully typed with Typescript. Includes automatic type generation for Supabase tables
  • 🎨 Tailwindcss
  • πŸ§ͺ Unit testing and integration testing setups built-in
  • πŸ’š Eslint, typescript, prettier, postcss configured for dev and test environments
  • πŸ“ˆ Automatic sitemap generation
  • πŸ” SEO metadata, JSON-LD and Open Graph tags with NEXT SEO
  • ✍️ Semantic release with Automatic changelog generation
  • 🎨 Prettier Code formatter
  • πŸ’Ž Minimal styling
  • πŸ“– Codebase which is easy to read and modify
GitHub - imbhargav5/nextbase-nextjs-supabase-starter: πŸš€βš‘οΈ Free Boilerplate and Starter kit for Next.js 14+, Supabase, Tailwind CSS 3.2 and TypeScript. πŸš€ Next.js πŸ”₯ Supabase πŸ’» TypeScript πŸ’š ESLint 🎨 Prettier 🐢 Husky 🧹 Lint-Staged πŸ§ͺ Jest πŸ§ͺ Testing Library πŸ•ΉοΈ Playwright ✍️ Commitizen πŸ’¬ Commitlint πŸ’» VSCode πŸŒͺ️ Vercel 🎨 PostCSS πŸƒ Tailwind CSS βš›οΈ React Query
πŸš€βš‘οΈ Free Boilerplate and Starter kit for Next.js 14+, Supabase, Tailwind CSS 3.2 and TypeScript. πŸš€ Next.js πŸ”₯ Supabase πŸ’» TypeScript πŸ’š ESLint 🎨 Prettier 🐢 Husky 🧹 Lint-Staged πŸ§ͺ Jest πŸ§ͺ Testing Library…







Open-source Apps

9,500+

Medical Apps

500+

Lists

450+

Dev. Resources

900+