Skip to content
/ nextjs-boilerplate Public template

πŸš€ Next.js 16+ boilerplate with typescript, husky, lint-staged, biome, vitest, react-testing-library, storybook, and GH actions.

License

Notifications You must be signed in to change notification settings

hadrysm/nextjs-boilerplate

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

1,049 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

Boilerplate and Starter for Next.js 16, Tailwind CSS 4 and TypeScript

πŸš€ Boilerplate and Starter for Next.js, Tailwind CSS and TypeScript ⚑️ Made with developer experience first: Next.js (app routing), TypeScript, Biome, Husky, Lint-Staged, Vitest, React Testing Library, PostCSS, Tailwind CSS, Storybook, GH actions.

Cover

πŸš€ Features

Developer experience first:

  • Next.js for Static Site Generator
  • Type checking TypeScript
  • Integrate with Tailwind CSS 4 (CSS-first configuration)
  • Storybook for components documentation
  • Strict Mode for TypeScript and React 19
  • Linter and Code Formatter with Biome
  • Husky for Git Hooks
  • Lint-staged for running linters on Git staged files
  • Testing with Vitest and React Testing Library
  • Dark mode with next-themes
  • Component variants with CVA and Base UI headless components
  • Absolute Imports using @ prefix
  • Nextjs custom layouts
  • T3 env Manage your environment variables with ease
  • Message convention for git
  • Maximize lighthouse score
  • GH actions

πŸ“… Plans

πŸ§ͺ Testing

Tests live in the __tests__/ directory with a mirrored structure matching src/. Shared test utilities are in __tests__/test-utils.tsx. Run tests with pnpm test (Vitest).

ℹ️ How To Use

To use this template you can simply click in Use this template or create your Next.js app based on this template by running:

pnpm create next-app -e https://github.com/hadrysm/nextjs-boilerplate

πŸš€ Deploy to production

Install command on Vercel:

corepack use pnpm@`pnpm -v` && pnpm i

You can see the results locally in production mode with:

pnpm build
pnpm start

🀝 Contributing

  1. Fork this repository;
  2. Create your branch: git checkout -b my-awesome-contribution;
  3. Commit your changes: git commit -m 'feat: Add some awesome contribution';
  4. Push to the branch: git push origin my-awesome-contribution.

License

Licensed under the MIT License, Copyright Β© 2024-2026

See LICENSE for more information.


Made with much ❀️ and πŸ’ͺ by Mateusz HadryΕ› 😊 My Contact

Releases

No releases published

Packages

 
 
 

Contributors