Next.jsReactStarter

nextjs-boilerplate — Next.js Starter Template

By betaversionio

A Next.js starter template from BetaVersion.IO that integrates TypeScript, Tailwind CSS v4, Radix UI, Framer Motion, and more, with SEO, PWA, and Docker configuration.

Explore the design

Compare the page layouts and mobile experience. Open any screenshot for a closer look.

2 previews
Desktop homepage1 / 2
Desktop captureTop of page

Actual screenshot captured by the server browser.

All pages & views 2

Screenshots show visual appearance; interactive behavior may differ.

Recorded 2026-10-14View source

What stands out

A quick read of the recorded project description.

01

Uses Next.js 16 App Router and React 19

02

Full TypeScript type support

03

Tailwind CSS v4 CSS-based configuration approach

04

Built-in next-themes dark mode toggle

05

Integrates Radix UI, Aceternity UI, and Framer Motion

06

Provides SEO files, PWA manifest, and Docker configuration

Template Details

This is a starter template based on the Next.js App Router. The README states that it uses TypeScript, Tailwind CSS v4, and React 19, and integrates Radix UI, Aceternity UI, Framer Motion, next-themes, and Lucide React. The template includes SEO-related files (dynamic OG images, sitemap, robots.txt, metadata), a PWA manifest and icons, as well as code quality tools ESLint, Prettier, Husky, and Commitlint. The project structure is organized by app, components, config, constants, lib, and styles, and provides scripts for development, build, linting, formatting, type checking, and Docker. The README does not describe specific business functionality, performance metrics, or production environment validation; it only describes the technical configuration and files included in the template.

Next.jsReactStarter

Is it right for your project?

Use Cases

  • When you need to quickly set up a Next.js project foundation
  • When you want to develop with TypeScript and Tailwind CSS v4
  • When you need built-in dark mode and animation components
  • When you need basic SEO files and PWA support
  • When you need to run development or production environments via Docker

Suitable For

  • Front-end developers using Next.js and TypeScript
  • Teams needing a combination of Tailwind CSS v4 and Radix UI
  • Scenarios where you want to deploy a Next.js application via Docker

Getting started & customization

Use these recorded setup notes alongside the repository instructions for your chosen version.

  1. 1

    Requires Node.js >= 20.0.0 and pnpm >= 9.0.0

  2. 2

    After cloning the repository, run pnpm install to install dependencies

  3. 3

    Use pnpm dev to start the development server, accessible by default at http://localhost:3000

  4. 4

    Copy .env.example to .env.local and configure NEXT_PUBLIC_BASE_URL

  5. 5

    Docker-related commands include pnpm docker:dev, pnpm docker:up, pnpm docker:down

Read repository instructions

License & source material

Usage conditions & limitations

Free to use · keep license notice

This entry covers the free version under the MIT license in a public repository; the free scope is the code of this version and does not imply that external services or third-party assets are free.

Must comply with when using

  • Free use, modification, commercial use, and distribution of this version's code are permitted.
  • 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

  • Demo images, fonts, icons, and other third-party assets must be checked against their respective licenses; they cannot be judged solely by the code's MIT license.
  • External services such as domains, hosting, databases, payments, or AI may incur additional charges.
View Original Text Basis

Compiled by DeepSeek based on repository license and README ·2026-10-14. 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
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
2025-12-24
Screenshot last checked
2026-10-14

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: codex-user-requested-batch-review-20261015 · 2026-10-15

Inspect the recorded source material

SHA-256: d824e1b0cbbd2185ba0a4e69a8ef890e6c4d673c60c73b672c6d8481815cbb3a

2026-10-14T15:39:56.903Z

Source file / repository
# BetaVersion.IO Next.js Template

A modern, enterprise-grade Next.js boilerplate built with TypeScript, Tailwind CSS v4, and the latest web technologies. Ship production-ready applications faster.

## Features

- **Next.js 16** - Latest App Router with React 19
- **TypeScript** - Full type safety throughout
- **Tailwind CSS v4** - Modern utility-first styling with CSS-based configuration
- **Dark Mode** - Built-in theme switching with next-themes
- **Framer Motion** - Smooth animations and transitions
- **Radix UI** - Accessible, unstyled UI primitives
- **Aceternity UI** - Beautiful animated components (Container Text Flip, Glowing Effects)
- **SEO Optimized** - Dynamic OG images, sitemap, robots.txt, and metadata
- **Docker Ready** - Development and production Docker configurations
- **Code Quality** - ESLint, Prettier, Husky, and Commitlint pre-configured
- **PWA Ready** - Web manifest and icons included

## Tech Stack

| Category | Technology |
|----------|------------|
| Framework | Next.js 16 |
| Language | TypeScript 5 |
| Styling | Tailwind CSS v4 |
| UI Components | Radix UI, Aceternity UI |
| Animations | Framer Motion |
| Icons | Lucide React |
| Theme | next-themes |
| Package Manager | pnpm |
| Linting | ESLint 9 |
| Formatting | Prettier |
| Git Hooks | Husky + Commitlint |
| Containerization | Docker |

## Quick Start

### Prerequisites

- Node.js >= 20.0.0
- pnpm >= 9.0.0

### Installation

```bash
# Clone the repository
git clone https://github.com/betaversionio/nextjs-boilerplate.git
cd nextjs-boilerplate

# Install dependencies
pnpm install

# Start development server
pnpm dev
```

Open [http://localhost:3000](http://localhost:3000) to view the application.

## Available Scripts

| Command | Description |
|---------|-------------|
| `pnpm dev` | Start development server |
| `pnpm build` | Build for production |
| `pnpm start` | Start production server |
| `pnpm lint` | Run ESLint |
| `pnpm lint:fix` | Fix ESLint errors |
| `pnpm format` | Format code with Prettier |
| `pnpm format:check` | Check code formatting |
| `pnpm type-check` | Run TypeScript type checking |
| `pnpm docker:dev` | Start with Docker (development) |
| `pnpm docker:up` | Start with Docker (production) |
| `pnpm docker:down` | Stop Docker containers |

## Project Structure

```
src/
├── app/                    # Next.js App Router
│   ├── layout.tsx          # Root layout
│   ├── page.tsx            # Home page
│   ├── error.tsx           # Error boundary
│   ├── loading.tsx         # Loading UI
│   ├── not-found.tsx       # 404 page
│   ├── manifest.ts         # PWA manifest
│   ├── robots.ts           # Robots.txt
│   ├── sitemap.ts          # Sitemap
│   ├── opengraph-image.tsx # Dynamic OG image
│   └── globals.css         # Global styles
├── components/
│   ├── aceternity/         # Aceternity UI components
│   ├── layout/             # Layout components (Navigation, Footer, Theme)
│   ├── sections/           # Page sections (Hero, Features, CTA)
│   └── ui/                 # Base UI components
├── config/                 # App configuration
│   ├── site.ts             # Site metadata
│   └── navigation.ts       # Navigation links
├── constants/              # Static data
├── lib/                    # Utility functions
└── styles/                 # Additional styles
```

## Configuration

### Environment Variables

Create a `.env.local` file based on `.env.example`:

```bash
cp .env.example .env.local
```

| Variable | Description | Default |
|----------|-------------|---------|
| `NEXT_PUBLIC_BASE_URL` | Base URL for the application | `https://betaversion.io` |

### Theme Configuration

Theme colors are defined in `src/app/globals.css` using CSS custom properties. The template supports both light and dark modes out of the box.

### Tailwind CSS v4

This template uses Tailwind CSS v4 with CSS-based configuration. Theme customizations are in `globals.css` using the `@theme` directive.

## Deployment

### Vercel (Recommended)

[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https://github.com/betaversionio/nextjs-boilerplate)

### Docker

```bash
# Build the image
pnpm docker:build

# Run with docker-compose
pnpm docker:up
```

### Other Platforms

The application can be deployed to any platform supporting Node.js:
- AWS Amplify
- Netlify
- Railway
- Render

## Contributing

See [CONTRIBUTING.md](CONTRIBUTING.md) for contribution guidelines.

## Security

See [SECURITY.md](SECURITY.md) for security policies and reporting vulnerabilities.

## License

This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.

## Links

- [Website](https://betaversion.io)
- [GitHub](https://github.com/betaversionio)
- [Twitter](https://x.com/BetaVersionIO)
- [LinkedIn](https://linkedin.com/company/betaversionio)

---

Built with passion by [BetaVersion.IO](https://betaversion.io)
Report a correction

Explore similar templates

Compare previews and descriptions within the same stack and category.