Awesome Next.js

Awesome Next.js is a boilerplate template that bundles the Next.js framework with the Mantine component library, the Reatom state manager, cookie-baker, and next-intl into one pre-configured starting point for React applications.

What is Awesome Next.js?

Awesome Next.js is a TypeScript boilerplate published on GitHub (10 stars) that scaffolds a Next.js application with Mantine for UI components, Reatom for state management, cookie-baker for cookie handling, and next-intl for internationalization. It takes a fresh project and produces a runnable Next.js app with pnpm scripts for development, building, and validation. The repository's stated description is "📦 Next.js + Mantine + Reatom."

Key Features

The template's README documents four bundled dependencies and five pnpm scripts that cover development, validation, formatting, and production builds.

• Mantine integration — The Mantine React component library ships as a dependency, so buttons, modals, forms, and other UI primitives are available without extra installation.
• Reatom state management — Reatom, an atomic state manager, is pre-configured for handling both synchronous and asynchronous application state.
• next-intl internationalization — The next-intl library is wired in, enabling multilingual content and locale routing from the start.
• cookie-baker — The cookie-baker package is included for simplified browser cookie read/write operations.
• pnpm scripts — Five scripts are defined: dev (starts the development server at http://localhost:3000), build (creates an optimized production build), start (runs production mode), types (validates code with the TypeScript compiler), and format (runs Prettier on the src directory).
• Path mapping — TypeScript is pre-configured so imports use the @ prefix to reference files in the src directory and the public folder, as shown in the README:

import { Button } from '@/components/Button';
import avatar from '@/public/avatar.png';

Who is it for?

The template targets developers who want a working Next.js base with UI components, state management, and internationalization already settled before feature work begins.

• Next.js developers starting a new project — They can clone the template and begin with UI, state, i18n, and cookie handling already wired together, avoiding dependency setup.
• Teams standardized on Mantine — Developers who build with the Mantine component library get a base project that already includes their component set.
• Multilingual application builders — Projects that need internationalization from day one can rely on the included next-intl configuration.
• Developers evaluating Reatom — Those curious about the Reatom state manager can study a working Next.js integration in a small codebase.

What can you do with Awesome Next.js?

The pre-wired dependencies and scripts support the full cycle from local development to a production-ready build.

• Scaffold a feature-ready app: clone the repo, run pnpm dev, and start building components in the src directory at http://localhost:3000.
• Validate and format code: run pnpm types to check TypeScript correctness and pnpm format to normalize formatting with Prettier across all files in src.
• Ship a production build: run pnpm build to generate an optimized bundle, then pnpm start to serve the result in production mode.

How does Awesome Next.js work?

The template is a standard Next.js application managed with pnpm. After cloning, developers run pnpm dev to launch the development server, write pages and components under the src directory, and import them through the @ path prefix. The pnpm build and pnpm start scripts handle compiling and serving the production output.

Alternatives

• create-next-app — the official Next.js scaffolding tool from Vercel, which generates a bare Next.js project without Mantine, Reatom, or next-intl pre-installed.

FAQ

Is Awesome Next.js free to use?

Yes. The template is hosted as a public GitHub repository, so anyone can clone, modify, and use the code without a license fee.

Does Awesome Next.js require TypeScript?

The template is TypeScript-oriented. It validates code with the TypeScript compiler through the pnpm types script, and its README shows TypeScript path mapping examples for imports.

What state manager does the template use?

The template uses Reatom, an atomic state management library for JavaScript and TypeScript, listed as one of the four core dependencies in the README.

What is the recommended package manager?

The template is built around pnpm — all five documented scripts use pnpm, though they map to standard npm scripts as well.

Does the template include internationalization?

Yes. next-intl is one of the four dependencies, so locale handling and translation support are included in the setup.