Flask Argon Design

Open-Source Web App coded in Flask Framework on top of Argon Design System design (free version) - Provided by AppSeed Web App Generator.

App Features

App technology stack

Flask Argon Design - Open-Source Web App.

Prepare your environment

The product is built on top of Flask, a popular Python Web Framework. To build the app, Python3 should be installed properly in the workstation. If you are not sure if Python is properly installed, please open a terminal and type python --version. The full-list with dependencies and tools required to build the app:

Check Python (using the terminal)

$ # Check Python version
$ python --version
Python 3.7.2 # <--- All good

Check GIT command tool (using the terminal)

$ # Check git
$ git --version
$ git version 2.10.1.windows.1 # <--- All good

For more information on how to set up your environment please access the resources listed below. In case we've missed something, contact us on Discord.

Project Structure

The boilerplate code is built with a modular structure that follows the recommended pattern used by many open-source projects. The most important files and directories are shown below:

< PROJECT ROOT >                            # application root folder
    |--- app/__init__.py                    # application constructor  
    |--- app//static                        # Assets Directory: Img, CSS, Javascript, sitemap.xml
    |--- app/templates                      # Jinja2 files
    |            |---<includes>             # Page chunks, components (footer, navigation)
    |            |---<layouts>              # Layouts (default.html)
    |            |---<accounts>             # Authentication Pages
    |            |     |---- login.html     # Login page
    |            |     |---- register.html  # Register page
    |            |
    |            |---<pages>                # Pages
    |                  |---- index.html     # Index page
    |                  |---- about.html     # Simple about page
    |                  |---- elements.html  # UI Kit elements
    |--- requirements.txt                   # Modules and dependencies
    |--- run.py                             # bootstrap the app

How to use it

$ # Clone the sources
$ git clone https://github.com/app-generator/flask-argon-design-system.git
$ cd flask-argon-design-system
$ # Virtualenv modules installation (Unix based systems)
$ virtualenv --no-site-packages env
$ source env/bin/activate
$ # Virtualenv modules installation (Windows based systems)
$ # virtualenv --no-site-packages env
$ # .\env\Scripts\activate
$ # Install requirements
$ pip3 install -r requirements.txt
$ # 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"
$ # Set up the DEBUG environment
$ # (Unix/Mac) export FLASK_ENV=development
$ # (Windows) set FLASK_ENV=development
$ # (Powershell) $env:FLASK_ENV = "development"
$ # Run the application
$ # --host= - expose the app on all network interfaces (default
$ # --port=5000    - specify the app port (default 5000)  
$ flask run --host= --port=5000
$ # Access the app in browser:

Flask Framework

Flask is a micro web framework written in Python. It is classified as a microframework because it does not require particular tools or libraries. It has no database abstraction layer, form validation, or any other components where pre-existing third-party libraries provide common functions.

What is dashboard

In information technology, a dashboard is a user interface that, somewhat resembling an automobile's dashboard, organizes and presents information in a way that is easy to read. However, a computer dashboard is more likely to be interactive than an automobile dashboard (unless it is also computer-based). To some extent, most graphical user interfaces (GUIs) resemble a dashboard - by Techtarget

Argon Design System

Free and open-source design system for Bootstrap4 - Argon Design System 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. Start your development with a Design System for Bootstrap 4. It is open-source, free and it features many components that can help you create amazing websites - provided by Creative-Tim.

Flask Argon Design - Provided by AppSeed Web App Generator.