Nextkit Admin Starter Kit with Supabase, Prisma & Mongodb

Connecting frontend to backend just got simpler! 🚀 We built Next Kit as a dedicated starter kit for developers. Effortlessly link with SupaBase, MongoDB, and Prisma ORM. Say goodbye to Database integration headaches!🛠

👋 Introduction

NextKit is a modern, open-source admin dashboard template built with Next.js , Tailwind CSS , Supabase , MongoDB and Prisma , inspired by the principles of Material Design. It offers a clean, minimal UI combined with a powerful development stack, making it ideal for building fast, responsive, and scalable web applications.

Whether you're developing a content management system (CMS), analytics dashboard, internal admin panel, or SaaS backend, NextKit provides you with a flexible and customizable foundation that speeds up development while ensuring a smooth user experience.

Designed with developers in mind, NextKit comes packed with pre-built components, layouts, and utility-first styling, so you can focus more on functionality and less on UI boilerplate.

🔑 Key Features

• Responsive Design
  Seamless user experience across desktops, tablets, and mobile devices.

• Ready to use Authentication and Authorization
  Utilised supabase powered authentication or a custom Next.js API backend powered by JWT .

• Complete prisma setup for instant Database connection
  Integrated modern prsima ORM to connect or interact with database instantly.

• Flowbite Integration
  A rich library of prebuilt UI components—like modals, dropdowns, navbars, and tabs—designed specifically for Tailwind CSS, helping developers build faster with consistent and responsive designs.

• Pre-designed Pages
  Includes essential pages like dashboards, login, user profiles, error pages, and more.

• ApexCharts Integration
  Interactive, customizable charts powered by ApexCharts for visualizing data effectively.

• Optimized for Performance
  Fast load times, efficient rendering, and a scalable codebase.

---

🛠️ Notable Libraries and Tools

Library / Tool	Description
Tailwind CSS	A utility-first CSS framework that enables developers to build custom designs quickly by applying classes directly in HTML.
Apex Charts	A powerful charting library for creating interactive and visually appealing charts, perfect for dashboards and data visualizations.
Flowbite	A library of UI components built on top of Tailwind CSS that provides ready-to-use elements like modals, dropdowns, and more.
Prisma	A modern ORM for Node.js and TypeScript that simplifies database access with auto-generated, type-safe queries and schema syncing.
Supabase	An open-source Firebase alternative that offers instant APIs, authentication, and real-time capabilities on top of a PostgreSQL database.
Tabler Icons	These icons are simple, lightweight, and easy to integrate, making them perfect for building clean and visually appealing user interfaces.

---

💾 Installation Guide

Welcome to the NextKit Free Admin Template with supabase and mongodb! This guide will walk you through the installation and setup process, so you can get started with building your custom admin dashboard in no time.

📝 Steps to Install

1. Clone the Repository

The easiest way to get started is by cloning the repository or download the zip file. You can do this with the following command:

git clone https://github.com/wrappixel/nextkit-admin-with-supabase-and-mongodb.git

2. Choose your desired package

After cloning , you will find two package , one that is powered by Supabase and second one powered by MongoDB

3. Install Dependencies

Install the relative Dependencies of the template. You can do this with the following command:

npm install

4. Initialize project environment variables

Overwrite the environment variables with real credentials.

5. Start the Development Server

Once the dependencies are installed, you can start a local development server to preview the template:

npm run dev

---

📝 Documentation

Welcome to the NextKit Free Admin Tempalte with Supabase and MongoDB documentation! Whether you're just getting started or looking to explore advanced features, this guide will help you set up and customize your project with ease.

👉 Click here to read the full documentation

---

🤝 Contributing

We welcome contributions from the community to help improve the NextKit Free Admin Template with Supabase and MongoDB. Whether it’s fixing bugs, adding new features, improving documentation, or sharing ideas — your input is appreciated!

🛠️ How to Contribute

Follow these simple steps to start contributing:

1. Fork the Repository
   Click the Fork button on the top-right corner of this repo to create your own copy.

2. Clone Your Fork
   Use the command below to clone your forked repository:

   git clone https://github.com/wrappixel/nextkit-admin-with-supabase-and-mongodb.git
   

3. Create a New Branch
   Create a new branch to work on your feature or fix. This keeps your changes separate from the main branch:

   git checkout -b feature/your-feature-name
   

4. Commit and Push Changes
   After making your changes, commit them with a meaningful message and push your branch to your fork:

   git commit -am "Add: Description of changes made"
   git push origin feature/your-feature-name
   
   

---

🧭 Useful Links

• Admin Templates from Wrappixel

• Bootstrap Templates from Wrappixel

• Angular Templates from Wrappixel

• React Template from Wrappixel

• Framer Templates from Wrappixel

• Material UI Templates from Wrappixel

• Vuetify Templates from Wrappixel

• NextJs Templates from Wrappixel

• Nuxt Templates from Wrappixel

• Tailwind Templates from Wrappixel

---

🌐 We are social