DEV Community

Cover image for Soft UI - Generate a Django Dashboard with ease
admin-dashboards
admin-dashboards

Posted on • Originally published at admin-dashboards.com

3 1

Soft UI - Generate a Django Dashboard with ease

Hello Coders!

This article presents an easy way to generate a Django dashboard on top of Soft UI, a modern Bootstrap 5 design crafted by Creative-Tim. To achieve this goal we will use an open-source tool: Django Cookie-Cutter. During the process, we can choose the design (Soft UI) and also the database type from a short-list with popular engines: SQLite, MySql, or PostgreSQL.

Thanks for reading! - Content provided by Admin Dashboards.


What's in the box? The generated product looks similar to this one:


Soft UI Django - product page (includes demo & sources)

Soft UI - Generated by Django Cookie-Cutter.


To use this open-source generator a minimal programming kit should be installed in the workstation starting with Python3 and GIT:

  • Python - the language used by the tool
  • GIT - the popular command-line versioning tool
  • A modern programming editor like Atom or VSCode

Once we have all the tools, we can proceed further and generate our simple Django Dashboard.

Step #1 - Install dependencies (cookie-cutter and GitPython)

$ pip install cookiecutter
$ pip install GitPython
Enter fullscreen mode Exit fullscreen mode

CookieCutter is the Python library that makes all the work for us and GitPython is a nice and useful Python wrapper around Git used to pull the UI themes from Git.


Step #2 - Generate the dashboard using Soft UI design

$ cookiecutter https://github.com/app-generator/cookiecutter-django.git
Enter fullscreen mode Exit fullscreen mode

Step #3 - Customize the project

Most of the commands provide a default value select-able by an ENTER. The most important step is the one when we choose the UI kit because the tool provides multiple choices regarding the design:


>>> # Project Name Option 
>>> project_name [Django Seed project]: Django Soft UI

>>> # Project Slug is the directory name
>>> project_slug [django_soft_ui]:

>>> # Project Description: saved in the README file 
>>> description [A simple Django project]: My Simple Django Project

>>> # Project Author: saved in the README file   
>>> author_name []: Bill Gates

>>> # Author Email: saved in the README file   
>>> email [bill@microsoft.com]:

>>> Project Version: saved in the README file
>>> version [0.0.1]:

>>> UI Kit: (Volt default option)
>>> Select theme:
1 - volt
2 - soft-ui                       <------ The magic option            
3 - datta-able

>>> Database: (SQLite default option) 
Select database:
1 - sqlite3
2 - mysql
3 - postgresql

>>> Database Credentials: Used to configure the connection
>>> database_name [appseed_django]: (use default)
>>> database_user [appseed_user]: (use default)
>>> database_pass [Pass1234]: (use default)
Enter fullscreen mode Exit fullscreen mode

Once the process is finished, we can open the django_soft_ui directory using a programming editor like Atom or VsCode and follow the instruction provided by the README to compile the generated project.


Step #1 - Create a virtual environment (used to install dependencies)

$ virtualenv env
$ source env/bin/activate
Enter fullscreen mode Exit fullscreen mode

Step #2 - Install project dependencies

$ # Install modules
$ pip3 install -r requirements.txt
Enter fullscreen mode Exit fullscreen mode

Step #3 - Set up the database

$ python manage.py makemigrations
$ python manage.py migrate
Enter fullscreen mode Exit fullscreen mode

Step #4 - Start the generated Django project

$ # Start the application (development mode)
$ python manage.py runserver
Enter fullscreen mode Exit fullscreen mode

By visiting the project in the browser we should see something similar to the original project: Soft UI Dashboard (demo link). Once we create a new user and Sign IN, the access to the private pages is unlocked.


Soft UI - Dashboard generated by Django Cookie-Cutter.


Soft UI - VR Page

Soft UI - VR Sample page generated by Django Cookie-Cutter Tool.


In the same way, we can build more Django projects but using different UI kits with less manual work. Regarding the Django Cookie-Cutter tool, the product has a nice roadmap where the publisher presents a few really nice features:

  • New themes: CoreUI, AdminLTE (popular open-source templates)
  • Deployment: AWS, Google Cloud, HEROKU, Docker
  • Modules: Data tables, Charts, Stripe Payments

For more information please access the public repository of this tool and read more about it.


Thanks for reading! For more resources, please access:

Hostinger image

Get n8n VPS hosting 3x cheaper than a cloud solution

Get fast, easy, secure n8n VPS hosting from $4.99/mo at Hostinger. Automate any workflow using a pre-installed n8n application and no-code customization.

Start now

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

Instrument, monitor, fix: a hands-on debugging session

Join Lazar for a hands-on session where you’ll build it, break it, debug it, and fix it. You’ll set up Sentry, track errors, use Session Replay and Tracing, and leverage some good ol’ AI to find and fix issues fast.

Tune in to the full event

DEV is partnering to bring live events to the community. Join us or dismiss this billboard if you're not interested. ❤️