Giter Site home page Giter Site logo

app-generator / flask-material-kit Goto Github PK

View Code? Open in Web Editor NEW
65.0 5.0 31.0 12.55 MB

Flask Boilerplate - Material Kit Design | AppSeed

Home Page: https://appseed.us/product/material-kit/flask/

License: Other

Shell 0.01% Dockerfile 0.02% Python 0.74% CSS 27.38% JavaScript 1.54% SCSS 37.57% HTML 32.74%
material-design flask-app flask-template

flask-material-kit's Introduction

Open-Source Flask App crafted on top of a modern Bootstrap 5 UI. Designed for those who like bold elements and beautiful websites, Material Kit 2 is ready to help you create stunning websites and web apps. Material Kit 2 is built with over 60 frontend individual elements, like buttons, inputs, navbars, nav tabs, cards, or alerts, giving you the freedom of choosing and combining.


Features

Have questions? Contact Support (Email & Discord) provided by AppSeed

Free Version PRO Version Custom Development
โœ“ Up-to-date dependencies Everything in Free, plus: Everything in PRO, plus:
โœ“ Best Practices โœ… Premium Bootstrap 5 Design โœ… 1mo Custom Development
โœ“ DB: SQLite, MySql โœ… PRO Support - Email & Discord โœ… Team: PM, Developer, Tester
โœ“ DB Tools: ORM, Flask-Migrate โœ… Private REPO Access โœ… Weekly Sprints
โœ“ Session-Based authentication - โœ… Technical SPECS
โœ“ Docker - โœ… Documentation
โœ“ CI/CD Flow via Render - โœ… 30 days Delivery Warranty
โœ“ Free Support - -
--------------------------------- --------------------------------- ---------------------------------
โœ“ LIVE Demo ๐Ÿš€ LIVE Demo PRO ๐Ÿ›’ Order: $3,999 (GUMROAD)

Material Kit - Starter generated by AppSeed.


Start with Docker

๐Ÿ‘‰ Step 1 - Download the code from the GH repository (using GIT)

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

๐Ÿ‘‰ Step 2 - Start the APP in Docker

$ docker-compose up --build 

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


โœจ How to use it

Download the code

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

๐Ÿ‘‰ 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

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

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


๐Ÿ‘‰ 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

โœจ Go LIVE via LIVE Deployer

This video explains how to deploy the product LIVE using a Drag & Drop gesture.


live-deployer-flask-material-kit.mp4

Codebase 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
   |
   |-- ************************************************************************

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

Material Kit 2 is a premium design crafted by the Creative-Tim agency on top of Bootstrap 5 Framework. Designed for those who like bold elements and beautiful websites, Material Kit 2 is made of hundreds of elements, designed blocks, and fully coded pages built with an impressive level of quality.

  • ๐Ÿ‘‰ Flask Material Kit2 PRO - product page
    • โœ… Enhanced UI - more pages and components
    • โœ… Priority on support

Mk2 PRO - Premium Seed project by AppSeed.



Flask Material Kit - Open-source starter generated by App Generator.

flask-material-kit's People

Contributors

app-generator avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.