Django Website Template - Material Kit Design

Published Oct 30, 2021Last updated Nov 03, 2021

Hello Coders!

This article presents an open-source Django Website Template crafted on top of Material Kit, a modern Bootstrap 5 design. The product can be downloaded directly from Github and used for unlimited hobby & commercial projects or simply for eLearning. For newcomers, Django is a leading web framework coded in Python by experienced developers and actively suppirted by an impressive open-source community.

Thanks for reading!

✨ Django Material Kit - LIVE App
✨ Django Material Kit - Product page

Django Website Template - Material Kit Design.

The product comes with a few useful features like authentication, database and Docker support. In case your workstation has already Docker installed, we can execute a few commands in the terminal and start the product Dockerized. Let's try!

Step #1 - Clone/Download source code

$ git clone https://github.com/app-generator/django-material-kit.git
$ cd django-material-kit

Step #2 - Start in Docker

$ docker-compose pull   # download packages
$ docker-compose build  # local set up
$ docker-compose up     # start the app

Once all the above commands are executed, we should be able to visit Django Material Kit in the browser http://localhost:85:

Django Website Template - Material Kit Design, the login screen.

The other way to use the product is to compile from sources using a simple set up:

clone sources using GIT
create a virtual environment to isolate the app
install modules
set up the database
start the app
register a new user and authenticate

$ # Get the code
$ git clone https://github.com/app-generator/django-material-kit.git
$ cd django-material-kit
$
$ # Virtualenv modules installation (Unix based systems)
$ virtualenv env
$ source env/bin/activate
$
$ # Install modules
$ pip3 install -r requirements.txt
$
$ # Create tables
$ python manage.py makemigrations
$ python manage.py migrate
$
$ # Start the application (development mode)
$ python manage.py runserver 
$
$ # Access the web app in browser: http://127.0.0.1:8000/

Once all the above commands are executed, we can visit the app in the browser and interact with the UI:

✨ Django Material Kit - UI Elements

Django Website Template - Material Kit Design, UI Elements.