nextjs-boilerplate — Next.js Starter Template

SHA-256: 6f4192deb21db22de17984b58c1c248d2d3e4cb182d158639496c177388f72fe

2026-10-14T00:07:55.207Z

# Savantly Next JS Boilerplate

## Quick start

### 1. Install dependencies

It is encouraged to use **pnpm** so the husky hooks can work properly.

```bash
pnpm install
```

### 2. Run the development server

You can start the server using this command:

```bash
pnpm dev
```

Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. You can start editing the page by modifying `src/pages/index.tsx`.

The page will automatically update as you edit the file.

Use the Flowbite React components when possible.

[https://www.flowbite-react.com/](https://www.flowbite-react.com/)

A simple `slug` style routing is configured so you can easily load different components/pages based on the slug value in the url.

For example -  
`http://localhost:3000/some-page` will load the `src/app/[slug]/page.tsx` file, with the slug value available as a prop.

### 3. Commit Message Convention

This starter is using [conventional commits](https://www.conventionalcommits.org/en/v1.0.0/), it is mandatory to use it to commit changes.

### 4. Contribute to UI Components

The UI components are located in the `src/components` directory.  
If you feel compelled, please contribute your reusable components to the nexus-ui-components library.

https://nexus-ui-components.vercel.app/

### Originally bootrapped from ...

ts-nextjs-tailwind-starter

#### Features

This repository is 🔋 battery packed with:

- ⚡️ Next.js 14 with App Router
- ⚛️ React 18
- ✨ TypeScript
- 💨 Tailwind CSS 3 — Configured with CSS Variables to extend the **primary** color
- 💎 Pre-built Components — Components that will **automatically adapt** with your brand color, [check here for the demo](https://tsnext-tw.thcl.dev/components)
- 🃏 Jest — Configured for unit testing
- 📈 Absolute Import and Path Alias — Import components using `@/` prefix
- 📏 ESLint — Find and fix problems in your code, also will **auto sort** your imports
- 💖 Prettier — Format your code consistently
- 🐶 Husky & Lint Staged — Run scripts on your staged files before they are committed
- 🤖 Conventional Commit Lint — Make sure you & your teammates follow conventional commit
- ⏰ Release Please — Generate your changelog by activating the `release-please` workflow
- 👷 Github Actions — Lint your code on PR
- 🚘 Automatic Branch and Issue Autolink — Branch will be automatically created on issue **assign**, and auto linked on PR
- 🔥 Snippets — A collection of useful snippets
- 👀 Open Graph Helper Function — Awesome open graph generated using [og](https://github.com/theodorusclarence/og), fork it and deploy!
- 🗺 Site Map — Automatically generate sitemap.xml
- 📦 Expansion Pack — Easily install common libraries, additional components, and configs.

See the 👉 [feature details and changelog](https://github.com/theodorusclarence/ts-nextjs-tailwind-starter/blob/main/CHANGELOG.md) 👈 for more.