Argon Dashboard - Free Django Seed Project

#webdev #argondesign #django #appseed

Hello Coders,

This article presents a simple Django Starter coded on top of a modern UI Kit - Argon Dashboard (free version) with basic modules (authentication, database, ORM) and deployment scripts.
The project can be downloaded directly from Github under the MIT License, a license that permits unlimited hobby & commercial projects (no footer mentions are required).

The goal of this open-source Django starter is to help two categories of programmers:

Beginners - To learn faster how to code a real project
Experienced Programmers - Skip over coding the common modules like authentication, ORM integration, basic project configuration

Argon Dashboard Django - product page
Argon Dashboard Django PRO - more pages, components

Argon Design System

Coding an app is great, but coding a real product on top of a modern UI Kit with commercial value is amazing. Argon UI, crafted under the MIT License by Creative-Tim agency comes with many components and pre-built pages that might help us to deliver faster the end product.

UI Vendor Notes - Argon Dashboard is built with over 100 individual components, giving you the freedom of choosing and combining. All components can take variations in color, that you can easily modify using SASS files.

You will save a lot of time going from prototyping to full-functional code because all elements are implemented. This Design System is coming with prebuilt examples, so the development process is seamless, switching from our pages to the real website is very easy to be done.

If you want to get inspiration or just show something directly to your clients, you can jump-start your development with our pre-built example pages. You will be able to quickly set up the basic structure for your web project.

Argon Design - Dashboard Page

Argon Design - User Profile Page

Argon Design - UI Icons Page

Django Dashboard - Features

The codebase used to integrate the UI is coded using a simple, modular structure super easy to extend and add more features on top - The full list of features:

UI-Ready app, SQLite Database, Django Native ORM
Modular design, clean code-base
Session-Based Authentication, Forms validation
Deployment scripts: Docker, Gunicorn / Nginx
Support via Github (issues tracker) and Discord

Codebase structure

< PROJECT ROOT >
   |
   |-- core/                       # Implements app logic
   |    |-- static/
   |    |    |-- <css, JS, images> # CSS files, Javascripts files
   |    |-- templates/             # Templates Folder
   |         |-- includes/         # HTML chunks and components
   |         |-- layouts/          # Master pages
   |         |-- accounts/         # Authentication pages
   |         |
   |      index.html               # The default page
   |       *.html                  # All other HTML pages
   |
   |-- authentication/             # Handles auth routes 
   |-- app/                        # Serve HTML files
   |
   |-- requirements.txt            # Development modules 
   |
   |-- .env                        # Environment Configuration
   |-- manage.py                   # Start the app
   |
   |-- ****************************

App Bootstrap Flow

Django bootstrapper manage.py uses core/settings.py as the main configuration file
core/settings.py loads the app magic from .env file
Redirect the guest users to Login page
Unlock the pages served by app node for authenticated users

Once we are getting familiar with the codebase we can move forward and code the app locally. To compile the sources, we need a Python3 environment and GIT command tool to clone the source code from Github. The full-list with dependencies and tools required to build the app:

Python3 - the programming language used to code the app
GIT - used to clone the source code from the Github repository
Basic development tools (g++ compiler, python development libraries ..etc) used by Python to compile the app dependencies in your environment.

For more information on how to set up your environment please access the resources listed below. In case I've missed something, feel free to AMA in the comments.

Compile the sources

$ # Get the code
$ git clone https://github.com/app-generator/django-dashboard-argon.git
$ cd django-dashboard-argon
$
$ # Virtualenv set up
$ virtualenv env
$ source env/bin/activate
$
$ # Install modules - SQLite version
$ pip3 install -r requirements.txt
$
$ # Create tables
$ python manage.py makemigrations
$ python manage.py migrate
$
$ # Start the application (development mode)
$ python manage.py runserver # default port 8000
$
$ # Start the app - custom port 
$ # python manage.py runserver 0.0.0.0:<your_port>
$
$ # Access the web app in the browser: http://127.0.0.1:8000/

At this point, we can visit the app in the browser http://127.0.0.1:8000/. By default, the app will redirect guest users to the login page. To access the private pages: