• Stars
    star
    163
  • Rank 224,038 (Top 5 %)
  • Language SCSS
  • License
    Other
  • Created about 3 years ago
  • Updated 2 months ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Soft UI Dashboard - Open-source Flask Dashboard | AppSeed

Soft UI Dashboard Flask

Open-source Flask Dashboard generated by AppSeed op top of a modern design. Designed for those who like bold elements and beautiful websites, Soft UI Dashboard is ready to help you create stunning websites and webapps - Design from Creative-Tim.


Roadmap & Features

Status Item info
✅ Up-to-date Dependencies
✅ UI Kit Bootstrap 5, Dark-Mode (persistent)
✅ Persistence SQLite, MySql
✅ Authentication Basic, OAuth via AllAuth for Github
✅ API Generator Secure API via Flask-restX
✅ Deployment Docker, Page Compression
🚀 CI/CD via Render Flask SOFT Dashboard - Go LIVE (video)

Soft UI Dashboard - Full-Stack Starter generated by AppSeed.


✨ Start the app in Docker

👉 Step 1 - Download the code from the GH repository (using GIT)

$ git clone https://github.com/app-generator/flask-soft-ui-dashboard.git
$ cd flask-soft-ui-dashboard

👉 Step 2 - Start the APP in Docker

$ docker-compose up --build 

Visit http://localhost:5085 in your browser. The app should be up & running.


✨ Create a new .env file using sample env.sample

The meaning of each variable can be found below:

  • DEBUG: if True the app runs in develoment mode
    • For production value False should be used
  • ASSETS_ROOT: used in assets management
    • default value: /static/assets
  • OAuth via Github
    • GITHUB_ID=<GITHUB_ID_HERE>
    • GITHUB_SECRET=<GITHUB_SECRET_HERE>

✨ Manual Build

👉 Download the code

$ git clone https://github.com/app-generator/flask-soft-ui-dashboard.git
$ cd flask-soft-ui-dashboard

👉 Set Up for Unix, MacOS

Install modules via VENV

$ virtualenv env
$ source env/bin/activate
$ pip3 install -r requirements.txt

Set Up Flask Environment

$ export FLASK_APP=run.py
$ export FLASK_ENV=development

Start the app

$ flask run
// OR
$ flask run --cert=adhoc # For HTTPS server

At this point, the app runs at http://127.0.0.1:5000/.


👉 Set Up for Windows

Install modules via VENV (windows)

$ virtualenv env
$ .\env\Scripts\activate
$ pip3 install -r requirements.txt

Set Up Flask Environment

$ # CMD 
$ set FLASK_APP=run.py
$ set FLASK_ENV=development
$
$ # Powershell
$ $env:FLASK_APP = ".\run.py"
$ $env:FLASK_ENV = "development"

Start the app

$ flask run
// OR
$ flask run --cert=adhoc # For HTTPS server

At this point, the app runs at http://127.0.0.1:5000/.


API Generator

This module helps to generate secure APIs using Flask-restX via a simple workflow:

  • Edit/add your model in apps/models.py
  • Migrate the database:
$ flask db init     # this should be executed only once
$ flask db migrate  # Generates the SQL 
$ flask db upgrade  # Apply changes 
  • Update Configuration:
    • apps/config .py, section API_GENERATOR
  • Generate the API code:
    • $ flask gen_api # the new code is saved in apps/api
  • Access the API in the browser:
    • /api/MODEL_NAME/

The API is secured using the JWT tocken provided by /login/jwt/ request (username & password should be provided).

  • GET requests are public (GET all, get Item)
  • Mutating requests are protected by token generated based on the user credentials (username, pass).

Two POSTMAN Collections are provided in the media directory:

  • Books API - that uses PORT *5000 for the api
  • Books API 2 - that uses PORT *5085 for the api (default port in Docker)

In case both port are unusable in your environment, feel free to edit the files before POSTMAN import.


👉 Create Users

By default, the app redirects guest users to authenticate. In order to access the private pages, follow this set up:

  • Start the app via flask run
  • Access the registration page and create a new user:
    • http://127.0.0.1:5000/register
  • Access the sign in page and authenticate
    • http://127.0.0.1:5000/login

✨ Code-base structure

The project is coded using blueprints, app factory pattern, dual configuration profile (development and production) and an intuitive structure presented bellow:

< PROJECT ROOT >
   |
   |-- apps/
   |    |
   |    |-- home/                           # A simple app that serve HTML files
   |    |    |-- routes.py                  # Define app routes
   |    |
   |    |-- authentication/                 # Handles auth routes (login and register)
   |    |    |-- routes.py                  # Define authentication routes  
   |    |    |-- models.py                  # Defines models  
   |    |    |-- forms.py                   # Define auth forms (login and register) 
   |    |
   |    |-- static/
   |    |    |-- <css, JS, images>          # CSS files, Javascripts files
   |    |
   |    |-- templates/                      # Templates used to render pages
   |    |    |-- includes/                  # HTML chunks and components
   |    |    |    |-- navigation.html       # Top menu component
   |    |    |    |-- sidebar.html          # Sidebar component
   |    |    |    |-- footer.html           # App Footer
   |    |    |    |-- scripts.html          # Scripts common to all pages
   |    |    |
   |    |    |-- layouts/                   # Master pages
   |    |    |    |-- base-fullscreen.html  # Used by Authentication pages
   |    |    |    |-- base.html             # Used by common pages
   |    |    |
   |    |    |-- accounts/                  # Authentication pages
   |    |    |    |-- login.html            # Login page
   |    |    |    |-- register.html         # Register page
   |    |    |
   |    |    |-- home/                      # UI Kit Pages
   |    |         |-- index.html            # Index page
   |    |         |-- 404-page.html         # 404 page
   |    |         |-- *.html                # All other pages
   |    |    
   |  config.py                             # Set up the app
   |    __init__.py                         # Initialize the app
   |
   |-- requirements.txt                     # App Dependencies
   |
   |-- .env                                 # Inject Configuration via Environment
   |-- run.py                               # Start the app - WSGI gateway
   |
   |-- ************************************************************************

Flask Soft Dashboard PRO

For more components, pages and priority on support, feel free to take a look at this starter:

Soft UI Dashboard is a premium Bootstrap 5 Design now available for download in Flask. Made of hundred of elements, designed blocks, and fully coded pages, Soft UI Dashboard PRO is ready to help you create stunning websites and web apps.


Soft UI Dashboard PRO - Starter generated by AppSeed.



Soft UI Dashboard Flask - Open-source starter crafted by AppSeed.

More Repositories

1

django-datta-able

Datta Able - Open-Source Django Dashboard | AppSeed
CSS
504
star
2

admin-dashboards

Admin Dashboards - Open-Source and Free | AppSeed
358
star
3

flask-black-dashboard

Flask Black Dashboard - Open-source seed project | AppSeed
CSS
313
star
4

free-site-builder

Free Site Builder - Open-Source Tool | Simpllo
HTML
275
star
5

django-black-dashboard

Django Dashboard Black - Open-source Seed Project | AppSeed
CSS
266
star
6

django-admin-dashboards

Django Dashboards - Admin Panels coded in Django | AppSeed
257
star
7

flask-adminlte

AdminLTE Flask - Open-source Seed Project | AppSeed
JavaScript
241
star
8

api-server-nodejs

Nodejs API Server - Express / SQLite / TypeORM | AppSeed
TypeScript
216
star
9

django-volt-dashboard

Django Bootstrap 5 - Volt Dashboard | AppSeed
Python
216
star
10

react-soft-ui-dashboard

React Dashboard - Soft UI Dashboard | AppSeed
JavaScript
199
star
11

django-material-dashboard

Django Dashboard - Material Design | AppSeed
CSS
198
star
12

flask-volt-dashboard

Flask Bootstrap 5 - Volt Dashboard | AppSeed
CSS
183
star
13

flask-material-dashboard

Flask Dashboard - Material Design | AppSeed
SCSS
178
star
14

flask-datta-able

Datta Able - Open-Source Flask Dashboard | AppSeed
CSS
178
star
15

django-adminlte

AdminLTE Django - Open-source seed project | AppSeed
Python
171
star
16

django-soft-ui-dashboard

Soft UI Dashboard - Open-source Django Dashboard | AppSeed
SCSS
171
star
17

flask-argon-dashboard

Flask Dashboard - Argon Design | AppSeed
SCSS
133
star
18

flask-atlantis-dark

Atlantis Lite - Flask (Dark Version) | AppSeed
HTML
128
star
19

django-admin-volt

Django Admin Volt - Free template for Django Admin Interface | AppSeed
CSS
127
star
20

django-argon-dashboard

Argon Dashboard - Open-Source Django Seed Project | AppSeed
Python
122
star
21

flask-apps

Flask Apps - Open-Source And Paid | AppSeed
120
star
22

django-atlantis-dark

Django Dashboard - Atlantis Lite (Dark Version) | AppSeed
Python
117
star
23

django-react-soft-dashboard

Django React - Soft UI Dashboard (Free Product) | AppSeed
Python
111
star
24

flask-pixel

Flask Pixel UI Kit - Open-Source web app coded in Flask | AppSeed
CSS
100
star
25

jinja-template

Jinja Template - Free & commercial projects | AppSeed
97
star
26

api-server-flask

Flask API Server - Open-Source API Server | AppSeed
Python
94
star
27

rocket-django

Django Rocket - Free Starter styled with Tailwind/Flowbite | AppSeed
HTML
89
star
28

flask-paper-kit

Flask Boilerplate - Paper Kit Design | AppSeed
SCSS
86
star
29

react-berry-dashboard-old

React Berry Dashboard - Full-Stack Product | AppSeed
JavaScript
86
star
30

django-coreui

CoreUI - Django Dashboard (Free Product) | AppSeed
HTML
84
star
31

sample-django-extended-user-profile

Django User Profile - Open-source Django Sample | AppSeed
CSS
84
star
32

django-pixel

Django Pixel UI Kit - Open-Source Django Starter | AppSeed
HTML
78
star
33

ecommerce-fastapi-stripe

FastAPI Stripe Sample - Soft UI Design (Free Sample) | AppSeed
HTML
75
star
34

bulmaplay

Flask/Jinja Starter - BulmaPlay (Styled with Bulma CSS) | AppSeed
JavaScript
74
star
35

sample-django-datatables

Django - Datatables Sample | AppSeed
CSS
74
star
36

gatsbyjs-starter-tailwindplay

GatsbyJS Tailwind Starter - TailwindPlay
JavaScript
70
star
37

django-soft-ui-design

Soft UI Design System - Django Starter | AppSeed
HTML
69
star
38

react-purity-dashboard

React Dashboard - Purity UI Dashboard | AppSeed
JavaScript
65
star
39

tailwind-css-components

Tailwind CSS Components - Free and Open-Source Tailwind Components | AppSeed
Pug
61
star
40

django-admin-black

Django Admin Black - Free template for Django Admin Interface | AppSeed
CSS
60
star
41

flask-gradient-able

Gradient Able - Open-Source Flask Dashboard | AppSeed
CSS
60
star
42

react-datta-able

React Node JS - Datta Able (Free Product) | AppSeed
SCSS
58
star
43

flask-light-bootstrap

Flask Dashboard - Light Bootstrap | AppSeed
HTML
58
star
44

flask-dashboard-modular-admin

Flask Dashboard - Modular Admin Design | AppSeed
CSS
57
star
45

react-horizon-ui-chakra

React Horizon UI - Full-Stack Open-Source Starter | AppSeed.us
JavaScript
57
star
46

django-material-kit

Django Boilerplate - Material Kit Design | AppSeed
HTML
56
star
47

flask-dashboard-gradientable

Gradient Able - Open-Source Flask Dashboard | AppSeed
CSS
55
star
48

django-star-admin

Star Admin - Open-Source Django Dashboard | AppSeed
Python
52
star
49

tutorial-flask

Flask Tutorial - Learn to code in Flask | AppSeed
51
star
50

flask-bulma-css

Flask App - Styled with Bulma | AppSeed
CSS
50
star
51

react-flask-authentication

React Flask Authentication - Open-Source Full-stack Project | AppSeed
Python
50
star
52

flask-material-kit

Flask Boilerplate - Material Kit Design | AppSeed
SCSS
50
star
53

ecommerce-django-stripe

Django Stripe Sample - Soft UI Design (Free Sample) | AppSeed
HTML
48
star
54

flask-corona-dark

Flask Dashboard - Corona Dark Design | AppSeed
CSS
48
star
55

ecommerce-flask-stripe

Flask Stripe Sample - Soft UI Design (Free Sample) | AppSeed
HTML
47
star
56

jamstack

JAMstack - Paid and Open-Source Boilerplate code | AppSeed
45
star
57

flask-now-ui-dashboard

Flask Dashboard - Now UI Design | AppSeed
SCSS
45
star
58

django-soft-dashboard-tailwind-old

Django Soft UI Dashboard - Tailwind CSS (Open-Source) | AppSeed
HTML
43
star
59

html-parser

Html Parser - Html to Pug, Jinja2, Blade Converter | AppSeed
CSS
42
star
60

app-generator

App Generator - Deliver your projects faster | AppSeed
42
star
61

django-dynamic-datatb

Django Dynamic Datatables - Open-Source Library | AppSeed
JavaScript
41
star
62

django-tabler

Django Dashboard - Tabler Design | AppSeed
Python
41
star
63

api-server-django

Django API Server - Open-Source API Server | AppSeed
Python
39
star
64

flask-soft-ui-design

Soft UI Design System - Flask Starter | AppSeed
HTML
39
star
65

vuejs-argon-design-system

Vuejs Argon Design - Built with Automation Tools | AppSeed App Generator
Vue
37
star
66

flask-admin-dashboards

Flask Dashboards - Admin Panels coded in Flask | AppSeed
36
star
67

flask-adminator

Flask Dashboard - Adminator Design | AppSeed
JavaScript
36
star
68

laravel-react-purity-dashboard

React Laravel - Purity Dashboard (Open-Source) | AppSeed
PHP
36
star
69

django-admin-soft-dashboard

Django Admin Soft - Free template for Django Admin UI | AppSeed
SCSS
36
star
70

django-admin-argon-dashboard

Django Admin Argon Dashboard - Open-Source PyPi Library | AppSeed
CSS
36
star
71

django-api-generator

API Generator for Django - Open-Source Library | AppSeed
Python
36
star
72

fastapi-soft-ui-dashboard

FastAPI Soft Dashboard - Open-Source Starter | AppSeed
SCSS
34
star
73

django-adminator

Django Dashboard - Adminator Design | AppSeed
JavaScript
34
star
74

flask-star-admin

Star Admin - Open-Source Flask Dashboard | AppSeed
CSS
33
star
75

flask-coreui

CoreUI - Flask Dashboard (Free Product) | AppSeed
HTML
33
star
76

bulma-css

Bulma CSS - Open-source components | AppSeed
TypeScript
32
star
77

django-gradient-able

Gradient Able - Open-Source Django Dashboard | AppSeed
HTML
31
star
78

jinja-soft-ui-dashboard-old

Jinja Template - Soft UI Dashboard | AppSeed
SCSS
30
star
79

django-dashboard-shards

Django Dashboard - Shards Design | AppSeed
CSS
30
star
80

gatsbyjs

GatsbyJS - Paid and Open-Source Starters | AppSeed
30
star
81

django-admin-material-dashboard

Django Admin Material Dashboard - Open-Source PyPi Library | AppSeed
CSS
29
star
82

eleventy-soft-ui-design

Eleventy (11ty) - Soft UI Design | AppSeed
Nunjucks
27
star
83

django-react-purity-dashboard

Django React - Purity Dashboard (Open-Source) | AppSeed
Python
27
star
84

flask-sb-admin

Flask Dashboard - SB Admin | AppSeed
SCSS
26
star
85

jinja-paper-dashboard

Jinja Template - Paper Dashboard | AppSeed
CSS
26
star
86

fullstack-flask-react-material-design

Flask React - Built with Automation Tools | AppSeed App Generator
26
star
87

flask-dashboard-sleek

Flask Dashboard - Sleek Design | AppSeed
JavaScript
25
star
88

flask-illustrations-iradesign

Flask App - Illustrations by IraDesign | AppSeed
JavaScript
25
star
89

django-sb-admin

Django Dashboard - SB Admin | AppSeed
SCSS
24
star
90

flask-react-soft-dashboard

Flask React - Soft Dashboard (Open-source) | AppSeed.us
Python
24
star
91

sample-django-charts-argon

Django Argon Charts - Open-source Django Sample | AppSeed
CSS
24
star
92

jinja-adminlte

Jinja Template - AdminLTE Design | AppSeed
JavaScript
24
star
93

django-corona-dark

Django Dashboard - Corona Dark | AppSeed
CSS
23
star
94

flask-tabler

Flask Dashboard - Tabler Design | AppSeed
CSS
23
star
95

sample-django-celery

Django & Celery Integration - Open-Source Sample | AppSeed.us
SCSS
23
star
96

flask-soft-dashboard-tailwind

Flask Soft UI Dashboard - Tailwind CSS (Open-Source) | AppSeed
HTML
23
star
97

flask-neumorphism-uikit

Flask Web App - Neumorphism UI Kit | AppSeed
CSS
22
star
98

fullstack-express-vuejs-argon-design

Express Vuejs - Built with Automation Tools | AppSeed App Generator
22
star
99

jinja-swipe-bootstrap-5

Jinja Template - Swipe One Page Bootstrap 5 | AppSeed
CSS
21
star
100

react-material-kit

React Material Kit - Built with Automation Tools | AppSeed App Generator
JavaScript
21
star