{"id":13706076,"url":"https://github.com/design-sparx/mantine-analytics-dashboard","last_synced_at":"2025-04-08T20:53:47.298Z","repository":{"id":189361258,"uuid":"680488510","full_name":"design-sparx/mantine-analytics-dashboard","owner":"design-sparx","description":"A free, open source, Next 14, React 18 admin dashboard template created using Mantine 7","archived":false,"fork":false,"pushed_at":"2024-12-22T17:49:26.000Z","size":26232,"stargazers_count":261,"open_issues_count":6,"forks_count":60,"subscribers_count":3,"default_branch":"main","last_synced_at":"2024-12-22T18:31:20.162Z","etag":null,"topics":["admin-dashboard","apexcharts","dnd-kit","embla-carousel","full-calendar","lodash","mantine","mantine-datatable","mantine-ui","nextauth","nextjs","postcss","react","react-simple-maps","tabler-icons","tiptap","typescript"],"latest_commit_sha":null,"homepage":"https://mantine-analytics-dashboard.netlify.app/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/design-sparx.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-08-19T12:07:35.000Z","updated_at":"2024-12-22T17:49:22.000Z","dependencies_parsed_at":"2024-12-22T18:36:17.685Z","dependency_job_id":null,"html_url":"https://github.com/design-sparx/mantine-analytics-dashboard","commit_stats":null,"previous_names":["design-sparx/analytics-dashboard","design-sparx/mantine-analytics-dashboard"],"tags_count":3,"template":true,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/design-sparx%2Fmantine-analytics-dashboard","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/design-sparx%2Fmantine-analytics-dashboard/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/design-sparx%2Fmantine-analytics-dashboard/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/design-sparx%2Fmantine-analytics-dashboard/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/design-sparx","download_url":"https://codeload.github.com/design-sparx/mantine-analytics-dashboard/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247927287,"owners_count":21019506,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["admin-dashboard","apexcharts","dnd-kit","embla-carousel","full-calendar","lodash","mantine","mantine-datatable","mantine-ui","nextauth","nextjs","postcss","react","react-simple-maps","tabler-icons","tiptap","typescript"],"created_at":"2024-08-02T22:00:51.907Z","updated_at":"2025-04-08T20:53:47.290Z","avatar_url":"https://github.com/design-sparx.png","language":"TypeScript","funding_links":[],"categories":["Showcase"],"sub_categories":["Open source"],"readme":"## 🔉 Announcements\n- Added file manager page UI\n- Updated mantine version to latest 7.14.3\n- New dark mode variant\n- New sidebar variant, now we have full, mini and full collapsed modes\n\n---\n\n![showcase](public/thumbnail-img-b.jpg)\n\n\u003cp align=\"center\"\u003e\n\u003cimg src=\"public/logo-no-background.png\" alt=\"logo\" height=\"100\"/\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://github.com/design-sparx/mantine-analytics-dashboard/blob/master/LICENSE\"\u003e\n    \u003cimg src=\"https://img.shields.io/badge/license-MIT-blue.svg\" alt=\"License\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://github.com/design-sparx/mantine-analytics-dashboard/issues?q=is%3Aopen+is%3Aissue\"\u003e\n    \u003cimg src=\"https://img.shields.io/github/issues/design-sparx/mantine-analytics-dashboard/open.svg\" alt=\"GitHub issues open\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://github.com/design-sparx/mantine-analytics-dashboard/issues?q=is%3Aissue+is%3Aclosed\"\u003e\n    \u003cimg src=\"https://img.shields.io/github/issues-closed-raw/design-sparx/mantine-analytics-dashboard\" alt=\"GitHub issues closed\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://mantine-analytics-dashboard.netlify.app/\" rel=\"nofollow\"\u003e\n    \u003cimg src=\"https://img.shields.io/badge/demo-online-green.svg\" alt=\"Live Demo\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://github.com/design-sparx/mantine-analytics-dashboard/archive/refs/heads/ft/readme.zip\"\u003e\n    \u003cimg src=\"https://img.shields.io/static/v1?label=download\u0026message=ZIP\u0026color=green\" alt=\"Download\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://app.netlify.com/sites/mantine-analytics-dashboard/deploys\"\u003e\n    \u003cimg src=\"https://api.netlify.com/api/v1/badges/453b19f9-2043-402d-a715-41d55db6447a/deploy-status\" alt=\"Netlify Deployment Status\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://github.com/design-sparx/mantine-analytics-dashboard/actions/workflows/chromatic.yml\"\u003e\n    \u003cimg src=\"https://github.com/design-sparx/mantine-analytics-dashboard/actions/workflows/chromatic.yml/badge.svg\" alt=\"Storybook Deployment Status\"\u003e\n  \u003c/a\u003e\n  \u003cbr\u003e\n  \u003ca href=\"https://github.com/design-sparx/mantine-analytics-dashboard\"\u003e\n    \u003cimg alt=\"GitHub stars\" src=\"https://img.shields.io/github/stars/design-sparx/mantine-analytics-dashboard?style=social\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n- [Live preview](https://mantine-analytics-dashboard.netlify.app/)\n- [Components preview](https://6546507b657a74164abf2db6-oniqlpqtfs.chromatic.com/)\n- [Medium](https://medium.com/stackademic/how-i-built-an-open-source-admin-dashboard-template-with-mantine-and-next-js-4f00a21ce04f)\n- [Product roadmap](https://kelvink96.notion.site/Mantine-analytics-dashboard-Product-roadmap-822fe0c757e647c9b2fd62a50807500a?pvs=74) * **New** *\n\n# About\n\nA professional admin \u0026 dashboard template built using on [Mantine 7](https://mantine.dev/) that comes with hundreds of\nUI components, forms, tables, charts, pages and icons. This template is built\nusing [Next v14](https://nextjs.org/), [React](https://react.dev/), [Apex Charts](https://apexcharts.com/),[Mantine DataTable](https://icflorescu.github.io/mantine-datatable/)\nand [Storybook](https://storybook.js.org/).\n\n![preview image](public/dashboard.png)\n\n# Previous release\n\nThe previous release of the dashboard template, supports Next 13 with Pages router and Mantine 6. To view the live demo\nuse this link - [preview](https://652579e5b7998a00083d022b--mantine-analytics-dashboard.netlify.app/), and to checkout\nfork the repo use this link - [version 1](https://github.com/design-sparx/mantine-analytics-dashboard/tree/v1)\n\n# Features\n\n- **Customizable:** You don't need to be an expert to customize the template. Our code is very readable and\n  well-documented.\n- **Fully Responsive:** With mobile, tablet \u0026 desktop support it doesn't matter what device you're using. Antd Dashboard\n  is responsive in all browsers.\n- **Cross-Browser:** Our themes are working perfectly with Chrome, Firefox, Opera, and Edge. We're working hard to\n  support them.\n- **Clean Code:** We strictly follow Ant Design's guidelines to make your integration as easy as possible. All code is\n  handwritten.\n- **Regular Updates:** From time to time you'll receive an update containing new components, improvements, and bug\n  fixes.\n\n# Tech stack\n\nTo make this template awesome, I used the following packages:\n\n## Core\n\n- **Next js v14:** Next.js is an open-source web development framework created by the private company Vercel providing\n  React-based web applications with server-side rendering and static website generation.\n- **Mantine v7:** Mantine is a React UI components library. It's built on top of React and TypeScript, and provides a\n  variety of\n  components and hooks for building high-performance web applications.\n- **React v18:** React is a free and open-source front-end JavaScript library for building user interfaces based on\n  components.\n- **Typescript v5:** TypeScript is a free and open-source high-level programming language developed by Microsoft that\n  adds static typing with optional type annotations to JavaScript.\n- **Storybook v7:** Storybook is a free, open-source tool for developing UI components in isolation. It's used by web\n  developers to improve their UI development workflow and build better web applications.\n- **Changeset CLI v2:** Changeset is a package that helps in managing my versions and changelogs.\n- **NextAuth v4:** NextAuth.js is a flexible and secure authentication library that can be used for client-side\n  authentication in Next.js.\n- **Tabler icons v2:** Tabler Icons is a free, open-source icon library with over 4,700 icons. The icons are designed\n  with a modern aesthetic and are suitable for a wide range of applications.\n- **Mantine datatable v7:** Mantine DataTable is a React component that can be used to create data-rich user interfaces.\n  It is a table component that is aware of dark themes and is designed for Mantine UI.\n- **Lodash v4:** A JavaScript utility library delivering consistency, modularity, performance, \u0026 extras.\n- **Apex chart v3:s** ApexCharts is a free, open-source JavaScript charting library that allows developers to create\n  interactive data visualizations for web pages. It can be used for both commercial and non-commercial projects.\n- **Dayjs v1:** Day.js is a JavaScript library that handles dates and times.\n- **Tiptap v2:** A headless, framework-agnostic and extendable rich text editor, based on ProseMirror.\n- **Fullcalendar v6**: FullCalendar is a JavaScript event calendar with over 300 settings. It's open source and has a\n  free core.\n- **Dnd-Kit v6:** Dnd-kit is a lightweight, modular, and extensible drag-and-drop toolkit for React. It is also\n  accessible and performant.\n- **Embla carousel v7:** Embla Carousel is a lightweight carousel library with fluid motion and precise swiping.\n- **React simple maps v3:** An svg map chart component built with and for React.\n- **Clerk/nextjs v4:** Clerk Next.js is a wrapper around Clerk React. It allows users to use the hooks that Clerk React\n  provides.\n- **React countup v6:** A React component wrapper around CountUp.js.\n\n## Dev\n\n- **Prettier v3:** Prettier is a code formatter that automatically formats code to ensure it is consistent and easy to\n  read.\n- **Husky v8:** Husky is a tool that makes it easier to work with git hooks. Prettier is a code formatter.\n- **Lint staged v15:** Lint-staged will automatically add any modifications to the commit as long as there are no\n  errors.\n- **Postcss v8:** PostCSS is a JavaScript library that uses plugins to transform CSS. It transpiles CSS into an abstract\n  syntax tree, which is then represented by JavaScript objects.\n\n# Quick start\n\n## Download\n\n- Clone this repo git clone `https://github.com/design-sparx/mantine-analytics-dashboard.git`\n- [Download from GitHub](https://github.com/design-sparx/mantine-analytics-dashboard/archive/refs/heads/main.zip)\n\n## Build tools\n\nYou'll need to install Node.js.\nOnce Node.js is installed, run npm install to install the rest of the template's dependencies. All dependencies will be\ndownloaded to the node_modules directory.\n\n```bash copy\nnpm install\n```\n\nNow you're ready to modify the source files and generate new files. To automatically detect file changes and start a\nlocal webserver at http://localhost:3000, run the following command.\n\n```bash copy\nnpm run dev\n```\n\nCompile, optimize, minify and uglify all source files to build/\n\n```bash copy\nnpm run build\n```\n\n# File structure\n\nInside the zip-file you'll find the following directories and files. Both compiled and minified distribution files, as\nInside the zip file, you'll find the following directories and files. Both compiled and minified distribution files, as\nwell as the source files are included in the package.\n\n```\nmantine-analytics-dashboard/\n├── .changeset\n├── .github\n├── .gitignore\n├── .editorconfig\n├── .prettierignore\n├── .prettierrc\n├── README.md\n├── CHANGELOG.md\n├── LICENSE\n├── index.html\n├── package.json\n├── tsconfig.json\n├── next.config.js\n├── postcss.config.cjs\n├── clerkMiddleware.ts\n├── yarn.lock\n├── public/\n│   ├── mocks/\n│   ├── _redirects\n│   ├── favicon.ico\n├── src/\n│   ├── .changeset/\n│   ├── .github/\n│   ├── .husty/\n│   ├── .storybook/\n│   ├── .yarn/\n│   ├── app/\n├────── api/\n├────── error.tsx\n├────── error.module.css\n├────── global.css\n├────── layout.tsx\n├────── loading.tsx\n├────── not-found.tsx\n├────── page.module.css\n├────── page.tsx\n│   ├── components/\n│   ├── hooks/\n│   ├── layout/\n│   ├── providers/\n│   ├── public/\n│   ├── routes/\n│   ├── styles/\n│   ├── theme/\n│   ├── types/\n│   ├── utils/\n└──\n```\n\n# Contributing and Support\n\nI welcome all developers and enthusiasts to contribute to the growth of our open-source admin dashboard template.\nContributing is a collaborative process that empowers us to collectively enhance the template’s capabilities and\nquality. To get started:\n\n- Fork the Repository: Fork the template’s GitHub repository to your own GitHub account.\n- Clone the Fork: Clone the forked repository to your local machine using Git.\n- Create a Branch: Create a new branch for your contributions to keep the main codebase intact.\n- Implement Changes: Make your desired changes, add new components, or refine existing features.\n- Commit and Push: Commit your changes to the new branch and push them to your GitHub fork.\n- Submit a Pull Request: Submit a pull request from your forked repository to the main template repository. Your changes\n  will be reviewed and potentially merged.\n\n# Reporting Issues and Seeking Help\n\nShould you encounter any issues or need assistance while using the template, we’re here to help:\n\n- Issue Tracker: Visit the GitHub\n  repository’s [Issues](https://github.com/design-sparx/mantine-analytics-dashboard/issues) tab to report bugs, suggest\n  enhancements, or seek clarification on aspects of the template.\n- Community Interaction: Engage with the template’s community on platforms\n  like [GitHub Discussions](https://github.com/design-sparx/mantine-analytics-dashboard/discussions) for assistance,\n  guidance, and insights.\n\n# Invitation to Explore and Utilize\n\nThe Mantine and Next.js admin dashboard template isn’t just an end; it’s a beginning — a starting point for your\ncreative journey. Whether you’re a seasoned developer seeking a rapid launch or an enthusiast keen on learning modern\ndevelopment practices, this template is your canvas.\n\n# Further resources\n\n- Nextjs - [https://nextjs.org/docs](https://nextjs.org/docs)\n- React - [https://react.dev/learn](https://react.dev/learn)\n- Mantine - [https://mantine.dev/getting-started/](https://mantine.dev/getting-started/)\n- Nextauth - [https://authjs.dev/](https://authjs.dev/)\n- Storybook - [https://storybook.js.org/docs/get-started/install](https://storybook.js.org/docs/get-started/install)\n- Apexcharts - [https://apexcharts.com/docs/installation/](https://apexcharts.com/docs/installation/)\n- Tiptap - [https://tiptap.dev/introduction](https://tiptap.dev/introduction)\n- Dndkit - [https://docs.dndkit.com/](https://docs.dndkit.com/)\n- Embla carousel - [https://www.embla-carousel.com/get-started/](https://www.embla-carousel.com/get-started/)\n- Fullcalendar - [https://fullcalendar.io/docs/getting-started](https://fullcalendar.io/docs/getting-started)\n- React simple\n  maps - [https://www.react-simple-maps.io/docs/getting-started/](https://www.react-simple-maps.io/docs/getting-started/)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdesign-sparx%2Fmantine-analytics-dashboard","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdesign-sparx%2Fmantine-analytics-dashboard","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdesign-sparx%2Fmantine-analytics-dashboard/lists"}