Sm0ke

Posted on Apr 19, 2021 • Updated on May 29, 2021 • Originally published at admin-dashboards.com

Admin Dashboard With Database - Free Projects to start fast

#webdev #dashboards #opensource

Hello Coders,
This article presents a curated list with admin dashboards with database that can be used in development right after the download. Usually, admin dashboards are provided by vendors as templates, without any functionalities, database, or authentication flow. Well, the products listed on this page come at least with a database and other useful things on top: authentication, charts, user profile pages etc. Most of the dashboards are open-source, released under permissive licenses (MIT, LGPL) on Github.

Thank you! Content provided by App Generator.

(Free) Django Argon Charts - shows nice charts using Django
(Free) Flask Database Sample - Bootstrap 5 Design coded in Flask
(Free) Django Data Tables - implements data pagination in Django
(Free) Django User Profile - registered users can edit their profile
(Free) React Nodejs Dashboard - Full-stack dashboard with a React UI

To use a database in a dashboard project we need a functional backend that manages the SQL part and translates the SQL responses to HTML, the format expected by the browsers. Dashboard Templates usually provide only the HTML pages without functional features like login, registration, or other flows (render charts, edit user information) .. etc.

Samples presented in this article use technologies and frameworks like Flask, Django and NodeJS to render and manage the database information: emails, passwords, charts, user profile information. This information (backend technology and database type) is mentioned for each product.

Django Charts Argon

This open-source dashboard comes with an SQLite database and functional code that showcases different metrics regarding the sales for a 12 months timeframe: total sales, total orders, best sale, and best month (in sales value).
The information is imported from an external file (csv/xls format) and the authenticated users are able to add new records and even edit existing values. The charts are updated once the new information is saved.

Framework and Database: Django/Sqlite
Django Charts Argon – LIVE demo
Django Charts Argon – Source Code (MIT License)
Argon Dashboard Django – the original starter (free product)

Django Data Tables

Simple Django project that uses an SQLite database to manage the information using a paginated layout: data tables. Users can inspect the data with ease and each record can be edited in-place using Ajax - Project features & links:

Framework and Database: Django/Sqlite
Load sample data using the admin section
Inline rows edit activated at double click
Pagination and Search
Links: LIVE Demo, Sources
The original project: Volt Django Dashboard

Django User Profile

Django Sample project that allows registered users to edit their profile outside of the admin module. Django User Profile is provided on top of Django Volt, a popular open-source Django Template provided by Themesberg and AppSeed. For newcomers, Django is the most popular Python-based web framework initially released in 2003 and currently a reference framework in web development - Project features & links:

Framework and Database: Django/Sqlite
Editable user profile: Name, Surname, Email, Phone, and address
User Profile Page: settings.html
Links: LIVE Demo, and Source Code

Nodejs Argon Dashboard React

This database comes with a Mongo Database and the backend this time is NodeJS. The sample is production-ready and requires Nodejs and Javascript knowledge to use - Project features & links:

MERN Stack: Mongo Database, Express/NodeJS Backend and React (UI)
Authentication: Login, Register, Forgot Password
User Management: Update User Information, List Registered Users
Links: Product Page, Source Code

Flask Database Sample

This admin dashboard comes with a simple SQLite database managed by Flask, a popular Python-based framework. The source code (published on Github) comes with a comprehensive README that explains the necessary setup to use the project. The sample explains step by step how to configure a Flask project to use an SQLite database via SQLAchemy, a popular SQL library for Python.