Atlantis Lite - Free Projects to start fast
Hello Coders,
This article presents a short-list with free, open-source starters coded in different frameworks on top of Atlantis Lite, a modern admin dashboard design. Beginners might use the projects to accommodate with a production-ready codebase enhanced with simple features like authentication, ORM, database.
Thanks for reading! The relevant links are below:
- Atlantis Lite - Flask - product page
- Atlantis Dark - Flask - dark version
- Atlantis Lite - Django - product page
- Atlantis Dark - Django - dark version
- Atlantis Lite - Jinja - product page
Atlantis Lite
Atlantis Lite is a free bootstrap 4 admin dashboard that is beautifully and elegantly designed to display various metrics, numbers or data visualization.
Atlantis Lite admin dashboard has 2 layouts, many plugins and UI components to help developers create dashboards quickly and effectively so they can save development time and also help users to make the right and fast decisions based on existing data.
The HTML files can be downloaded directly from Github by accessing this repo. Being provided with SCSS files, the project can be customized with ease by following the Atlantis Lite Documentation.
Atlantis Lite - Flask Codebase
Features provided in the Flask version of Atlantis Lite are fairly simple: session-based authentication flow using Flask-Login, database, ORM, blueprints, and deployment scripts.
To compile and use the Flask version, we need to have Python3 installed and accesible via the terminal window. GIT command tool is also recommended to download the sources directly from the public repositories.
Let's compile the Flask version (dark layout) with a few commands copied from the README file.
Clone/Download the sources
$ git clone https://github.com/app-generator/flask-dashboard-atlantis-dark.git
$ cd flask-dashboard-atlantis-dark
Install modules
$ # Virtualenv modules installation (Unix based systems)
$ virtualenv env
$ source env/bin/activate
$
$ # Install modules - SQLite Database
$ pip3 install -r requirements.txt
Flask environment set up
$ # Set the FLASK_APP environment variable
$ (Unix/Mac) export FLASK_APP=run.py
$ (Windows) set FLASK_APP=run.py
$ (Powershell) $env:FLASK_APP = ".\run.py"
Start the project
$
$ # Start the application (development mode)
$ flask run --host=0.0.0.0 --port=5000
$
$ # Access the dashboard in browser: http://127.0.0.1:5000/
By default the application redirect the guests users to the login page. After reguster a new user and login, the app unlocks all private pages.
Atlantis Lite - Dashboard Page
Atlantis Lite - Timeline Widget
Atlantis Lite - Django Codebase
The Django codebase is provided with an identical set of features as the Flask version: authentication flow, database and deployment scripts. The product (both versio - lite & dark) can be compiled locally with a few commands typed in the terminal:
$ # Get the code
$ git clone https://github.com/app-generator/django-dashboard-atlantis.git
$ cd django-dashboard-atlantis
$
$ # Virtualenv modules installation (Unix based systems)
$ virtualenv env
$ source env/bin/activate
$
$ # Install modules - SQLite Storage
$ 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
$
$ # Access the web app in browser: http://127.0.0.1:8000/
After a successfull authentication (please create a new user first via the registration page) the app unlocks the private pages and we can click around this modern UI.
Atlantis Lite - Main dashboard
Atlantis Lite - Widgets Page
Atlantis Lite - Jinja Version
Jinja version is provided to facilitate the UI integration into legacy products. The project is basically, a super simple Flask project without a database or any other hard dependencies.
Jinja Codebase Strcuture
< PROJECT ROOT >
|
|-- app/__init__.py
|-- app/
| |-- static/
| | |-- <css, JS, images> # CSS files, Javascripts files
| |
| |-- templates/
| | |
| | |-- includes/ # Page chunks, components
| | | |
| | | |-- navigation.html # Top bar
| | | |-- sidebar.html # Left sidebar
| | | |-- scripts.html # JS scripts common to all pages
| | | |-- footer.html # The common footer
| | |
| | |-- layouts/ # App Layouts (the master pages)
| | | |
| | | |-- base.html # Used by common pages like index, UI
| | | |-- base-fullscreen.html # Used by auth pages (login, register)
| | |
| | index.html # The default page
| | login.html # Auth Login Page
| | register.html # Auth Registration Page
| | page-404.html # Error 404 page (page not found)
| | page-500.html # Error 500 page (server error)
| | *.html # Other pages
|-- requirements.txt
|
|-- run.py
|
|-- ****************************************************
Thanks for reading! Using any starter presented in this article, anyone with a basic programming knowledge might code faster a new project without reinventing the wheel and re-code basic features like authentication, database set up, or deployment scripts.