Mantine Vite Template

Mantine Vite Template is a production-ready admin dashboard boilerplate built on Vite, React, TypeScript, and Mantine UI that ships with authentication, state management, testing, and internationalization already configured.

What is the Mantine Vite Template?

The Mantine Vite Template is an open-source GitHub repository created by auronvila. It's a starter template for admin dashboard applications, providing a pre-configured development environment rather than a finished product. You input your business logic and components; the template outputs a working app with authentication hooks, Axios HTTP client, Redux Toolkit store, and i18next translations set up, ready for development on the Vite dev server at localhost:5173.

Key Features

• PostCSS with mantine-postcss-preset — Mantine's PostCSS preset is preconfigured, so you can use Mantine's styling features without manual setup.
• TypeScript — The entire template is written in TypeScript, and a typecheck script is included to verify types.
• Redux Toolkit with redux-persist — State management is set up with Redux Toolkit, and redux-persist handles storing state in local storage across sessions.
• Storybook — A Storybook dev server and production build script (storybook:build) are included for developing UI components in isolation.
• Vitest with React Testing Library — Unit tests run on Vitest with React Testing Library; the test script also runs Prettier, ESLint, and type checks.
• ESLint with eslint-config-mantine — Linting is configured using Mantine's own ESLint config.
• Internationalization with i18next — Translation infrastructure is ready, so you can add locale files and switch languages.
• Custom auth hooks and Axios setup — Authentication hooks and an Axios instance are pre-wired, reducing boilerplate for API calls.
• Yup schema validation and React Router — Form validation with Yup and routing with React Router are included.

Who should use the Mantine Vite Template?

Frontend developers who need to spin up an admin dashboard quickly without repeating configuration for auth, data fetching, or testing will find this template useful. Teams that standardize on React, TypeScript, and Mantine can adopt it as a shared foundation. Developers new to testing or internationalization can learn from the pre-built Vitest, ESLint, and i18next setups.

What can you do with the Mantine Vite Template?

• Admin dashboard developers: build a full dashboard with pre-configured authentication and API layers.
• Indie developers or freelancers: use the template as a starting point for client projects to reduce initial setup time.
• UI developers: use Storybook to prototype Mantine components and layouts before integrating them.

How does the Mantine Vite Template work?

Clone the repository, install dependencies with yarn, and run yarn dev to start the development server at http://localhost:5173. The project includes npm scripts for building (build), previewing (preview), type checking (typecheck), linting (lint), testing (vitest), and Storybook (storybook). Detailed configuration guidance is provided in the GitHub wiki.

Pricing

The template is free and open source. The repository is public, and contributions are welcomed; the author requests a GitHub star as the easiest form of support.

FAQ

Is the Mantine Vite template free?

Yes, the template is free and open source. It is published on GitHub under a public repository, and the author only asks for a star if you find it useful. There are no paid tiers or licensing fees mentioned.

What stack does the Mantine Vite template use?

The template uses Vite as the build tool, React and TypeScript for the frontend, and Mantine for UI components. State management is handled by Redux Toolkit with redux-persist, HTTP requests by Axios, and routing by React Router.

Does the template include authentication?

Yes, the template comes with custom authentication hooks, so you don't have to build the auth logic from scratch. The wiki explains how to configure the auth hooks to work with your backend.

How do I run the Mantine Vite template?

After cloning the repository, install dependencies with yarn, then run yarn dev. The development server starts at http://localhost:5173. You can also run yarn test to run tests, linting, and type checking together.

Does it support internationalization?

Yes, the template includes i18next integration. You can add translation files and use the i18next API to switch languages in your app. The configuration is already in place.