This article presents two open-source projects that might help developers to build professional admin dashboards on top of AdminKit design, a popular design crafted on top of Bootstrap 5 Framework. Projects can be downloaded directly from Github and the permissive (MIT) license allows the usage for unlimited hobby and commercial projects.
AdminKit - Product Information
Free & Premium Bootstrap 5 Admin Template that comes with hundreds of UI components, forms, tables, charts, pages and icons. Built on top of Bootstrap 5.
Built with Bootstrap 5 - Built on top of the latest version of Bootstrap 5 and HTML5, which means - robust, responsive and easy to customize.
Modern Tooling - Sources are provided using a logical and intuitive structure, with all task (SCSS compilation, JS compression) managed under Webpack.
The project can be compiled and used directly from Github, just be following the instructions provided in the README file.
Note: Make sure you have Node.js and GIT installed before applying this tutorial.
Step #1 - Download the sources
$ # Clone sources $ git clone https://github.com/adminkit/adminkit.git $ cd adminkit
Step #2 - Start for development
$ # Install modules $ yarn $ $ # Start with LIVE update $ # yarn start
AdminKit uses webpack-dev-server to automatically detect file changes and start a local webserver at http://localhost:8080.
Step #3 - Compile for production in dist folder
$ # Production build $ yarn build
Once the sources are compiled, you should see AdminKit running in the browser:
AdminKit - Jinja Version
The Jinja version of AdminKit is basically a simple Flask starter without a database or hard dependencies. The template can be integrated with ease into any Python-based framework like Django, Flask or FastAPI.
How to build the starter - Instructions copied from the README file
$ # Clone the sources $ git clone https://github.com/app-generator/jinja-adminkit.git $ cd jinja-adminkit $ $ # Virtualenv modules installation (Unix based systems) $ virtualenv env $ source env/bin/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" $ $ # Run the Jinja Template $ # --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 UI in browser: http://127.0.0.1:5000/
Once the Jinja starter is compiled successfully and started, we should see something similar to the LIVE Deployment:
Thanks for reading! For more resources please access: