Next Pages Template screenshot

Next Pages Template

Author Avatar Theme by Mantinedev
Updated: 14 May 2025
492 Stars

Mantine + Next.js pages router template

Categories

Overview:

The Mantine Next Template allows users to easily get started with Mantine + Next framework by providing pre-configured setup and essential features. This template can be used to create a new repository with @mantine packages and includes server side rendering, color scheme management, Storybook, Jest testing, ESLint setup, and various npm scripts.

Features:

  • Server side rendering setup for Mantine
  • Color scheme stored in cookie: Ensures that the color scheme remains consistent after hydration.
  • Storybook with color scheme toggle: Allows users to toggle between different color schemes while viewing the components in Storybook.
  • Jest with react testing library: Includes Jest testing framework with react testing library for easy testing of components.
  • ESLint setup with eslint-config-mantine: Provides ESLint setup with eslint-config-mantine for consistent code quality.
  • npm scripts: Includes various npm scripts for different purposes such as starting the development server, building the application for production, exporting static websites, analyzing application bundle, checking TypeScript types, running ESLint, running prettier checks, running jest tests, watching jest tests, and running various scripts together.

Installation:

To install the Mantine Next Template, follow these steps:

  1. Click on the “Use this template” button at the header of the repository or follow this link link to create a new repository with @mantine packages.
  2. Note that you need to be logged in to GitHub to generate the template.

Summary:

The Mantine Next Template provides a convenient way to start using Mantine + Next framework by offering a pre-configured setup with essential features. This template includes server side rendering, color scheme management, Storybook, Jest testing, ESLint setup, and various npm scripts for different purposes. By following the installation guide, users can quickly set up the template and start using Mantine + Next for their projects.