A brief guide to develop a basic flask app and deploying it into Heroku cloud.
Flask is a micro framework written in Python…blah…blah..blah! I’m not gonna waste you time so, more info at flask.pocoo.org!
Developing a Flask app
- Install flask through pip using —
pip install flask
- Running a sample “Hello World!” flask web app
from flask import Flask app = Flask(__name__) def hello(): return "Hello, World!"
Running a flask app is just
flask runaway, just head over to your app location in your command prompt/bash/terminal.
C:/[Path /to your/ app/]>flask run
When you make some changes to your app, you should run flask run again by quitting.
Debug mode is a very useful tool while you’re developing an app and you are in need of frequent reloads. Here’s what you can do in your cmd to activate debug mode in Windows set FLASK_ENV=development
Now you can see the following on your cmd —
* Environment: production WARNING: Do not use the development server in a production environment. Use a production WSGI server instead. * Debug mode: off * Running on [http://127.0.0.1:5000/]( ) (Press CTRL+C to quit)
The above app generates some content in the browser which looks like this —
A Hello World
Now, Let us know what each line in the above code works or does the things
from flask import Flask
More about “Flask” at here.
The 3rd line in the code creates an instance of our WSGI Application.
If you have ever noticed your address bar while visiting websites like Wikipedia, Instagram, Reddit etc., you should have noticed this
In the first image there’s Instagram’s default route. It is always showed up when you navigate to instagram.com. The default route is a “/” (forward slash)
In the second image, when you want to navigate to specific Instagram profile then you need to give the specify like “<username>” after the default route like “/sachintendulkar” for viewing Sachin Tendulkar’s Instagram profile.
The function below the route serves the content to be displayed or served for that route.So that we’re clear how routes work. We can now start adding routes for our web app.
from flask import Flask app = Flask(__name__) def hello(): return "Hello World!" def first(): return "The First Route"
Which results in this —
The First Route
Its achieves our purpose of adding routes but, is that what an actual web app look like? No! There a no HTML pages and no anchor tags and nothing in there. But do not panic we’ll now be dealing with rendering HTML pages rather than generating a simple plain text. For that we need to import a function
render_template from flask.
All the HTML files to be served via
render_templateshould be placed in a folder named templates inside your working directory
from flask import Flask,render_template app = Flask(__name__) def hello(): return render_template("index.html") def first(): return render_template("first.html")
<html> <head> <title>My Web App</title> </head> <body> <h1>This is the first route</h1> <a href="/">back</a> </body> </html>
<html> <head> <title>My Web App</title> </head> <body> <h1>Hello, World!</h1> <a href="/first">first</a> </body> </html>
The navigation functions as —
Deploying the Flask app to Heroku Cloud
Now that the basic app is ready and now its time for deployment. We are now going to deploy it to Heroku Cloud. Why Heroku? It offers a command line interface for configuring and deploying python or any web app with version controlling, which makes it easier to track your files and versions of your web app.
For starting with Heroku you need to create a Heroku account and install Heroku CLI in your local computer. You can download it here
For you to use Heroku, you need to install and configure git. Steps to install git can be found here — https://git-scm.com/book/en/v2/Getting-Started-Installing-Git
After installing Heroku CLI, now use the
heroku logincommand to connect your Heroku account to the CLI in your local computer.
Install a python package
pip install gunicorn. (Wikipedia)
Its time to create a Procfile, which tells the Heroku cloud which server our web app runs on. The Procfile contents for our web app looks like —
web: gunicorn app:app
Now move over to the working directory in the command prompt and generate a
requirements.txtfile which tells about the package dependencies for our web app by running
pip freeze requirements.txt
Now initialize a git repository in the current working directory
adding a .gitignore file is an optional
Next, stage and commit all changes
git add .and
git commit -m 'first commit'.
Create a Heroku app
The result of heroku create command
Let us push all the contents of our repository into the Heroku cloud by
git push heroku master.Its takes some time for the cloud to be configured for our app to be run.
heroku opento open your web app in your browser.
Its done! you’ve now created a basic flask app and deployed it to Heroku cloud.
The app I’ve created is now live at https://safe-waters-62537.herokuapp.com/
Now that you’ve got an idea about developing and deploying basic flask application. You can continue to build some advanced flask applications by learning at Edx.