Dash by Plotly App Template

This is a template project for creating web applications using Dash by Plotly. Dash is a powerful Python framework for building interactive web applications with ease. This template provides a basic structure to get you started quickly.

The purpose of this project is to demonstrate different aspects of App Development using Dash by Plotly in an end-to-end manner. The project is structured in a way that it can be used as a template for creating new projects.

Use the final app as a reference / DEMO for presentation in prospect clients.

Resources

1. Dash by Plotly

2. Dash Mantine Components

3. Structuring a large Dash application - best practices to follow

4. Dash App Structure

5. Mantine UI Library https://mantine.dev/, https://ui.mantine.dev/

---

Features

1. How to structure a complex multipage Dash by Plotly App

2. How to use PyEnv + Poetry for dependency management

3. How to write and run tests using pytest

4. How to use Dash Mantine Components and CSS to style a Dash App

5. How to setup User Authenication

6. How to setup and use a Database

7. How to Dockerize the app and deploy to GCP

8. How to setup CI/CD using GitHub Actions

9. How to use Pre-commit, Black, Flake and Isort for code formatting.

Use cases

The repository includes sample pages for the following uses cases:

1. Analytics Dashboard
2. Machine Learning Prediction UI
3. Chatbot
4. About Page
5. Contact Page
6. Notifications Functionality

UI Inspiration

1. Clean Dashboard
2. Info List
3. Dashboard-example <-- Use it for Water AI.
4. Team Presentation

UI Guidelines

1. Header should be on the top, fixed and have a logo. Can be white or colored.
2. Sidebar should be on the left side. It can stay open or closed.
3. The main content should be on the middle-right side of the screen and have a lightgrey background.
4. Use cards and light color for the main content to distinguish from the background and make it more readable.

---

Getting Started

Using Poetry and Pyenv for Python Dependency Management

1. Install pyenv https://github.com/pyenv/pyenv and poetry https://python-poetry.org/docs/#installation on your machine.

2. Install the appropriate Python version:

   cd ./dash-app-template
   pyenv install 3.9.16
   pyenv local 3.9.16
   

3. Configure Poetry to create the virtual environment in the project root:

   poetry config virtualenvs.in-project true
   

4. Install all the dependencies with a single command:

   poetry install
   poetry lock
   poetry check
   

5. Activate the virtual environment

   poetry shell
   

Running the App

./run.sh