Deploying a Flask App on Heroku

Hello, welcome back to the 10th post of my Flask series, this post would be a continuation of my previous post, please click on any link below to view any post you missed

OUTLINE OF FLASK SERIES

At the end of this post, you will learn the following

  • Set up the Heroku cloud platform
  • Install and configure Heroku Postgres
  • Use the Heroku command-line interface (Heroku CLI) to deploy an application

 

In this post, we would discuss how we can deploy our application to the Heroku cloud server.

Apart from Heroku, there are other cloud service providers. Some of them are Amazon Web Services (AWS), Google Cloud Platform (GCP), IBM Cloud, Microsoft Azure, and Rackspace Cloud, but for the purpose of this post, we would be using Heroku.

deploying to heroku

To work with Heroku, your application must be hosted in a remote Git server, such as GitHub or Bitbucket.

  • Visit the Heroku website, and click Sign up and Log into your dashboard.

 

Click New button and select create new app

  • Type in the app name, and then select the server region (right now, the only options are the United States and Europe; please select the one that is closer to your target users). Then, click Create app to continue:

NOTE

The app name will be used in the application URL provided by Heroku, for example, https://diarynoteapp.herokuapp.com/

 

  • Heroku has a rich add-ons library. Add-ons are like plugins, which provide tools and services for developing, extending, and operating your apps, including database, monitoring, logging, analytics, and security.

Switch to the Resources tab in Heroku, and then right-click on the Find more add-ons button

 

  • In the Add-ons page, click on Data Stores and select Heroku Postgres

  • click on Install Heroku Postgres to install the add-on in our cloud server

  • Select the default, Hobby Dev – Free Plan. This plan is free. In-App to provision to, put in the app name we used (diaryappnote) and then click Provision add-on

 

  • Once that is done, we can check whether Heroku Postgres is installed on the Add-ons page.

  • Then, click on Heroku Postgres  to view the management page

 

Heroku Postgres management page

  • The Overview allows us to check the database status, utilization rate, and so on.
  • Durability allows us to manage data security and backup.
  • Settings stores the database credentials and other advanced settings.
  • Data clips allow you to query the database data using the SQL command online.

Setting Up Environment Variables for the Heroku App

Go to the Settings tab, click Reveal Config Vars

Add your environment variable

 

DEPLOYMENT USING HEROKU GIT

  • Install the Heroku CLI, this is a command-line client that manages the interactions with the Heroku service, follow the guide here.
  • After installation login into the Heroku CLI by running this command in your terminal.
heroku login

You will be prompted to enter your email address and password. You will only be logged in if these details match the credentials you signed up with on the Heroku platform.

  • Create a new file with Procfile the name and do not add any extension.

Procfile is a file that will be executed during the app start-up process in Heroku. We will put in the commands we want Heroku to run during the app start-up process.

The first line is to ask Heroku to run flask db upgrade after every deployment. This is designed to ensure that our database schema is always up to date. The second line is to have Heroku recognize it as the task that starts the webserver

release: flask db upgrade
web: gunicorn main:app

  • We would install our gunicorn extension
pip install gunicorn
pip freeze > requirements.txt

Gunicorn is a Python WSGI HTTP powerful and fast HTTP server that is compatible with various web applications. It can be used as an interface between web servers and web applications. Gunicorn can communicate with multiple web servers or start multiple web applications.

  • Deploy your application

The -a parameter tells Git to stage files that have been modified or deleted. The -m parameter is for incorporating the commit.

heroku git:remote -a diarynoteapp
git commit -am "updated requirements.txt"
git push heroku master
heroku open

Our app is live

 

 

I prefer using the terminal to deploy,  all the steps we performed above can be done this way.

  • Login into Heroku create an application
heroku login
heroku create <appname>
  • Set environment variable
    heroku config:set FLASK_APP=main.py
    heroku config:set FLASK_CONFIG=production
    heroku config:set SECRET_KEY=d6865e8************8jbbb&
    heroku config:set MAIL_SERVER=smtp.sendgrid.net
    heroku config:set MAIL_PORT=587
    heroku config:set MAIL_USE_TLS=True
    heroku config:set MAIL_USERNAME=apikey  
    heroku config:set MAIL_PASSWORD=SG.nbX2T_l************************
    heroku config:set SENDGRID_API_KEY=SG.*************
    heroku config:set SECURITY_PASSWORD_SALT=gfgh*******
    heroku config:set MAIL_DEFAULT_SENDER=**********
  • Provision a database
heroku addons:create heroku-postgresql:hobby-dev
  • Deploying with git push
git push heroku master
  • The application is now deployed. Ensure that at least one instance of the app is running:
heroku ps:scale web=1
  • After the database tables are created and configured, the application can be restarted so that it starts cleanly with an updated database:
heroku restart

 

WHAT NEXT?

In the future, when there is a new update to your app, just run the following command

heroku maintenance:on
git add .
git commit -am "your comments"
git push heroku master
heroku restart
heroku maintenance:off

The maintenance will take the application offline during the upgrade and will show a static page that informs users that the site will be coming back soon. This prevents users from accessing the application while it is going through the upgrade process.

 

I hope you enjoyed the learning journey with me. Thank you!

The app URL hosted on Heroku is  HERE

The link to the Github project here

 

 

 

 

 

 

 

 

 

 

 

 

 

Leave a Reply

Your email address will not be published. Required fields are marked *