![flask.jpg](https://res.cloudinary.com/hpiynhbhq/image/upload/v1516679016/bjq75jmbz4nu6fbe5knk.jpg) [Image Source](http://flask.pocoo.org/static/logo/flask.png) If you want to create a lightweight and fast web app, Flask is the best solution. Flask is written in Python and one of the most widely used Python web frameworks for start-ups, and is becoming commonly accepted as the perfect tool for quick and simple solutions in most businesses. At its core, it provides a set of powerful libraries. #### What Will I Learn? - Combine python with Flask - Implement Login Flask-SQLAlchemy with PostgreSQL #### Requirements - Install Python3.6 - Install pip - Install virtualenv - Install Flask - Install PostgreSQL - Install Flask SQLALchemy - Browser(Chrome, IE, FireFox) #### Difficulty - Basic #### Tutorial Contents Flask is written in Python so we have to install python. Instructions for installing Python can be found [here](http://www.python.org). If we want to know python version installed just type: ```python``` ![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1516641430/f2f8dopszgegkvjulntj.png) The first thing to do is create the environment in our folder to isolate python systems and third party packages. Open command line then locate the python version file in system. After you found the version, type: ```python -m venv E:\Learn\Flask\flask_bootstrap\venv``` ![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1516642833/xvi7bod5ks3mxraj9yen.png) We have to enable virtual environment that we created in our previous folder: ```E:\Learn\Flask\flask_bootstrap>cd venv/Scripts``` and then type activate ![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1516643183/hxeisx4zsc8jnbqzczvo.png) Install flask with pip with command ```pip install flask``` The goal is to install the project flask package in the environment we have created in our folder ![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1516643826/q07trpa19qhb0etffezd.png) Install flask_sqlalchemy with the command ```pip install flask_sqlalchemy ``` The purpose is installing it as an extension of flask to support SQLAlchemy in application ![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1516644268/v42y02eeo56xfqg52nan.png) Install psycopg2 as PostgreSQL database adapter for the Python programming language. Type: ```pip install psycopg2``` ![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1516644453/rbzguin8ptfllp6ijnzu.png) Create a new file in the directory flaskbootstrap named app.py. Enter the following code: ``` from flask import Flask from flask_sqlalchemy import SQLAlchemy from flask import render_template,request, redirect, url_for app = Flask(__name__) app.config['SQLALCHEMY_DATABASE_URI'] = 'postgresql://postgres:Amazing@localhost/flaskbootstrap' app.debug = True db = SQLAlchemy(app) class User(db.Model): id = db.Column(db.Integer, primary_key=True) username = db.Column(db.String(80), unique=True) email = db.Column(db.String(120), unique=True) def __init__(self, username, email): self.username = username self.email = email def __repr__(self): return '' % self.username @app.route('/') def index(): myUser = User.query.all() oneItem = User.query.filter_by(username="test1").first() return render_template('add_user.html', myUser=myUser, oneItem=oneItem) @app.route('/post_user', methods=['POST']) def post_user(): user = User(request.form['username'], request.form['email']) db.session.add(user) db.session.commit() return redirect(url_for('index')) if __name__ == "__main__": app.run() ``` Create a directory static and templates in flask_bootsrap . After that create a new file in templates name add_user.html Enter the following code: ``` {% for user in myUser %}

{{ user.id }} {{ user.username }} - {{ user.email }}

{% endfor %} ``` if all is installed, you can type typing python app.py command ![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1516676703/ejfhippaqynswyafbnro.png) Open your favorite web-browser and navigate to the URL displayed ```http://localhost:5000``` ![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1516670604/bfmea8houlrbkshix8d7.png) ![image.png](https://res.cloudinary.com/hpiynhbhq/image/upload/v1516651801/dfoze0lobacv6ftxpukz.png)

Posted on Utopian.io - Rewarding Open Source Contributors

elingmeyatmaja