https://github.com/wrappixel/nextkit-admin-with-supabase-and-mongodb
Simplify Frontend-to-Backend Connectivity with Nextkit , Ultimate Starter Kit for Nextjs Effortless Database Integration with SupaBase, MongoDB & Prisma ORM
https://github.com/wrappixel/nextkit-admin-with-supabase-and-mongodb
admin-kit boilerplate boilerplate-template database-connector mongodb mongodb-atlas mongodb-database nextjs-admin-template nextjs-starter nextjs-starter-kit nextjs-starter-saas prisma prisma-orm react-admin-kit react-admin-template starter-kit starterkit supabase supabase-auth supabase-db
Last synced: 11 months ago
JSON representation
Simplify Frontend-to-Backend Connectivity with Nextkit , Ultimate Starter Kit for Nextjs Effortless Database Integration with SupaBase, MongoDB & Prisma ORM
- Host: GitHub
- URL: https://github.com/wrappixel/nextkit-admin-with-supabase-and-mongodb
- Owner: wrappixel
- Created: 2025-06-20T04:54:41.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2025-06-24T11:13:10.000Z (11 months ago)
- Last Synced: 2025-06-24T12:33:21.940Z (11 months ago)
- Topics: admin-kit, boilerplate, boilerplate-template, database-connector, mongodb, mongodb-atlas, mongodb-database, nextjs-admin-template, nextjs-starter, nextjs-starter-kit, nextjs-starter-saas, prisma, prisma-orm, react-admin-kit, react-admin-template, starter-kit, starterkit, supabase, supabase-auth, supabase-db
- Language: TypeScript
- Homepage: https://nextkit-nextjs-prisma-mongodb.vercel.app
- Size: 4.13 MB
- Stars: 2
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
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:
```bash
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:
```bash
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:
```bash
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](https://adminmart.github.io/premium-documentation/nextjs/nextkit/index.html)**
---
## 🤝 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:
```bash
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:
```bash
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:
```bash
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
[](https://github.com/wrappixel) [](https://twitter.com/wrappixel) [](https://www.facebook.com/wrappixel) [](https://www.instagram.com/wrappixel) [](https://www.youtube.com/@wrappixel) [](https://www.linkedin.com/company/wrappixel)