Startseite>PHP-Quellcode>Andere Kategorien
Herunterladen

Flask Dashboard AdminKit

Von AppSeed generiertes Open-Source -Flask-Dashboard mit modernem Design. AdminKit ist ein professionelles Paket, das Hunderte von UI-Komponenten, Formularen, Tabellen, Diagrammen, Seiten und Symbolen enthält – basierend auf Bootstrap 5 .

  • Flask Dashboard AdminKit – Demo – LIVE-Bereitstellung
  • Flask-Tutorial – Erste Schritte mit Flask

Merkmale

  • DBMS: SQLite, PostgreSQL (Produktion)
  • DB-Tools: SQLAlchemy ORM, Alembic (Schemamigrationen)
  • Modulares Design mit Blueprints , einfache Codebasis
  • Sitzungsbasierte Authentifizierung (über flask_login ), Formularvalidierung
  • Bereitstellungsskripte: Docker, Gunicorn / Nginx, Heroku
  • Unterstützung über Github und Discord.


Wie man es benutzt 

$ # Get the code
$ git clone https://github.com/app-generator/flask-adminkit.git
$ cd flask-adminkit
$
$ # Virtualenv modules installation (Unix based systems)
$ virtualenv env
$ source env/bin/activate
$
$ # Virtualenv modules installation (Windows based systems)
$ # virtualenv env
$ # .envScriptsactivate
$
$ # Install modules - SQLite Database
$ pip3 install -r requirements.txt
$
$ # OR with PostgreSQL connector
$ # pip install -r requirements-pgsql.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"
$
$ # Start the application (development mode)
$ # --host=0.0.0.0 - expose the app on all network interfaces (default 127.0.0.1)
$ # --port=5000    - specify the app port (default 5000)  
$ flask run --host=0.0.0.0 --port=5000
$
$ # Access the dashboard in browser: http://127.0.0.1:5000/

Hinweis: Um die App zu nutzen, rufen Sie bitte die Registrierungsseite auf und erstellen Sie einen neuen Benutzer. Nach der Authentifizierung entsperrt die App die privaten Seiten.


Code-Basisstruktur

Das Projekt wird mithilfe von Blaupausen, einem App-Factory-Muster, einem dualen Konfigurationsprofil (Entwicklung und Produktion) und einer intuitiven Struktur codiert, die unten dargestellt wird:

Vereinfachte Version 

 < PROJECT ROOT >
   |
   | -- app/                      # Implements app logic
   |    | -- base/                # Base Blueprint - handles the authentication
   |    | -- home/                # Home Blueprint - serve UI Kit pages
   |    |
   |   __init__.py               # Initialize the app
   |
   | -- requirements.txt          # Development modules - SQLite storage
   | -- requirements-mysql.txt    # Production modules  - Mysql DMBS
   | -- requirements-pqsql.txt    # Production modules  - PostgreSql DMBS
   |
   | -- .env                      # Inject Configuration via Environment
   | -- config.py                 # Set up the app
   | -- run.py                    # Start the app - WSGI gateway
   |
   | -- ************************************************************************

Der Bootstrap-Flow

  • run.py lädt die .env Datei
  • Initialisieren Sie die App mit dem angegebenen Profil: Debug oder Produktion
    • Wenn env.DEBUG auf True gesetzt ist, wird der SQLite-Speicher verwendet
    • Wenn env.DEBUG auf False gesetzt ist, wird der angegebene DB-Treiber verwendet (MySql, PostgreSQL).
  • Rufen Sie die App-Factory-Methode create_app auf, die in app/ init.py definiert ist
  • Leiten Sie die Gastbenutzer zur Anmeldeseite weiter
  • Schalten Sie die von Home Blueprint bereitgestellten Seiten für authentifizierte Benutzer frei

App/Basis-Blueprint

Der Base- Blueprint übernimmt die Authentifizierung (Routen und Formulare) und die Vermögensverwaltung. Die Struktur ist unten dargestellt: 

 < PROJECT ROOT >
   |
   | -- app/
   |    | -- home/                                # Home Blueprint - serve app pages (private area)
   |    | -- base/                                # Base Blueprint - handles the authentication
   |         | -- static/
   |         |    | -- < css, JS, images >          # CSS files, Javascripts files
   |         |
   |         | -- templates/                      # Templates used to render pages
   |              |
   |              | -- includes/                  #
   |              |    | -- 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         # Registration page
   |
   | -- requirements.txt                          # Development modules - SQLite storage
   | -- requirements-mysql.txt                    # Production modules  - Mysql DMBS
   | -- requirements-pqsql.txt                    # Production modules  - PostgreSql DMBS
   |
   | -- .env                                      # Inject Configuration via Environment
   | -- config.py                                 # Set up the app
   | -- run.py                                    # Start the app - WSGI gateway
   |
   | -- ************************************************************************

App/Home-Blueprint

Der Home -Blueprint verwaltet UI-Kit-Seiten für authentifizierte Benutzer. Dies ist die private Zone der App – die Struktur ist unten dargestellt: 

 < PROJECT ROOT >
   |
   | -- app/
   |    | -- base/                     # Base Blueprint - handles the authentication
   |    | -- home/                     # Home Blueprint - serve app pages (private area)
   |         |
   |         | -- templates/           # UI Kit Pages
   |              |
   |              | -- index.html      # Default page
   |              | -- page-404.html   # Error 404 - mandatory page
   |              | -- page-500.html   # Error 500 - mandatory page
   |              | -- page-403.html   # Error 403 - mandatory page
   |              | -- * .html          # All other HTML pages
   |
   | -- requirements.txt               # Development modules - SQLite storage
   | -- requirements-mysql.txt         # Production modules  - Mysql DMBS
   | -- requirements-pqsql.txt         # Production modules  - PostgreSql DMBS
   |
   | -- .env                           # Inject Configuration via Environment
   | -- config.py                      # Set up the app
   | -- run.py                         # Start the app - WSGI gateway
   |
   | -- ************************************************************************

Einsatz

Die App verfügt über eine Grundkonfiguration zur Ausführung in Docker, Heroku, Gunicorn und Waitress.


Docker-Ausführung

Die Anwendung kann einfach in einem Docker-Container ausgeführt werden. Die Schritte:

Holen Sie sich den Code 

$ git clone https://github.com/app-generator/flask-adminkit.git
$ cd flask-adminkit

Starten Sie die App in Docker 

$ sudo docker-compose pull && sudo docker-compose build && sudo docker-compose up -d

Besuchen Sie http://localhost:5005 in Ihrem Browser. Die App sollte betriebsbereit sein.


Heroku

Schritte zur Bereitstellung auf Heroku

  • Erstellen Sie ein KOSTENLOSES Konto auf der Heroku-Plattform
  • Installieren Sie die Heroku-CLI, die zu Ihrem Betriebssystem passt: Mac, Unix oder Windows
  • Öffnen Sie ein Terminalfenster und authentifizieren Sie sich über heroku login Anmeldebefehl
  • Klonen Sie die Quellen und pushen Sie das Projekt für die LIVE-Bereitstellung 
$ # Clone the source code:
$ git clone https://github.com/app-generator/flask-adminkit.git
$ cd flask-adminkit
$
$ # Check Heroku CLI is installed
$ heroku -v
heroku/7.25.0 win32-x64 node-v12.13.0 # <-- All good
$
$ # Check Heroku CLI is installed
$ heroku login
$ # this commaond will open a browser window - click the login button (in browser)
$
$ # Create the Heroku project
$ heroku create
$
$ # Trigger the LIVE deploy
$ git push heroku master
$
$ # Open the LIVE app in browser
$ heroku open

Gunicorn

Gunicorn „Green Unicorn“ ist ein Python-WSGI-HTTP-Server für UNIX.

Mit pip installieren 

$ pip install gunicorn

Starten Sie die App mit der Gunicorn-Binärdatei 

$ gunicorn --bind 0.0.0.0:8001 run:app
Serving on http://localhost:8001

Besuchen Sie http://localhost:8001 in Ihrem Browser. Die App sollte betriebsbereit sein.


Kellnerin

Waitress (Gunicorn-Äquivalent für Windows) soll ein reiner Python-WSGI-Server in Produktionsqualität mit sehr akzeptabler Leistung sein. Es gibt keine Abhängigkeiten außer denen, die in der Python-Standardbibliothek vorhanden sind.

Mit pip installieren 

$ pip install waitress

Starten Sie die App mit waitress-serve 

$ waitress-serve --port=8001 run:app
Serving on http://localhost:8001

Besuchen Sie http://localhost:8001 in Ihrem Browser. Die App sollte betriebsbereit sein.


Credits und Links

  • Flask Framework – Die offizielle Website
  • Boilerplate-Code – Index bereitgestellt von AppSeed
  • Boilerplate-Code – Index veröffentlicht auf Github

Flask Dashboard AdminKit – bereitgestellt von AppSeed App Generator .

Expandieren
Zusätzliche Informationen
Ähnliche Anwendungen
Empfohlen für Sie
Ähnliche Nachrichten Alle