Deploy a Flask App with the Heroku CLI and a Procfile

Deploying our Stock Quote application using Heroku

Project Source Code

Get the project source code below, and follow along with the lesson material.

Download Project Source Code

To set up the project on your local machine, please follow the directions provided in the README.md file. If you run into any issues with running the project source code, then feel free to reach out to the author in the course's Discord channel.

Table of Contents

Deploying to production
#

Now that we have an application that works, we can put it up on the internet. This book will cover a few different deployment methods later on, but for now, we're going to use Heroku, a commonly used Platform as a Service host were we can directly upload our application to take care of a lot of the behind the scenes infrastructure level work.

We're going to need to tell Heroku what command to run our Flask application. To date, we've been using the bundled server that comes with Flask to view the application within our own browser, however using it to serve real traffic is discouraged. What we'll do instead is use a production grade server library to serve our application (which Heroku will route end users to).

Herkou is going to look at our requirements.txt file to see what libraries to install, so we'll need to add our server library called gunicorn to this file.

stock-app/requirements.txt
flask
requests
gunicorn

Then we're going to need to tell Heroku how to run our web application. To use gunicorn, we need to point it to the python file that hosts our Flask application and what variable references the Flask application object.

In addition, we'll want to tell it to listen on the IP address and port 0.0.0.0:5000 which means that it'll be listening and respond on port 5000. Heroku uses that port by default to talk to our application.

Heroku uses a file called a Procfile (which is short for Process File) and we can define commands under each kind of "worker". To serve a web application, we'll want to define a "web" worker with the gunicorn command. The $PORT environment variable will be specified by Heroku and is what it'll be expecting that our Flask application is serving on.

stock-app/Procfile
web: gunicorn --bind 0.0.0.0:$PORT server:app --log-level "debug"

To install the Heroku command line interface, you can go to the download page available at the Heroku website and walk through the installer for your operating system. The full setup instructions for Python applications is available at Heroku's Pytho n Documentation

After following the Heroku CLI setup, the next step to do deploy is run heroku create within our application folder and then push to a git repository hosted on Heroku.

(env) $ heroku create
Creating app... done, β¬’ cryptic-reef-51053
https://cryptic-reef-51053.herokuapp.com/ | https://git.heroku.com/crypt
ic-reef-51053.git
(env) $ git init .
Initialized empty Git repository in [your folder]/.git/
(env) $ git add .
(env) $ git commit -m 'Add untracked files'
[master (root-commit) 109b1d4] Add untracked files
 6 files changed, 47 insertions(+)
 create mode 100644 Procfile
 create mode 100644 requirements.txt
 create mode 100644 server.py
(env) $ git remote add heroku https://git.heroku.com/cryptic-reef-51053.git
(env) $ git push heroku master
Enumerating objects: 10, done.
Counting objects: 100% (10/10), done.
Delta compression using up to 4 threads
Compressing objects: 100% (7/7), done.
Writing objects: 100% (10/10), 1.79 KiB | 917.00 KiB/s, done.
Total 10 (delta 0), reused 0 (delta 0), pack-reused 0
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Python app detected
remote: -----> Installing python-3.6.10
remote: -----> Installing pip
...
remote: -----> Discovering process types
remote:        Procfile declares types -> web
remote:
remote: -----> Compressing...
remote:        Done: 45.9M
remote: -----> Launching...
remote:        Released v3
remote:        https://cryptic-reef-51053.herokuapp.com/ deployed to Heroku
remote:
remote: Verifying deploy... done.
To https://git.heroku.com/cryptic-reef-51053.git
 * [new branch]      master -> master

You'll get a URL back which now your own web application serving live on the internet!

Live on the internet
Live on the internet

In the next few chapters, we're going to extend this application to support more pages and learn more about Flask on the way.

  • |

Lesson Transcript

  • [00:00 - 00:14] Now that we have a semi-working flask application that renders stock prices like this, let's think about how we can get this up and running on the internet. To do that, we're going to use Heroku.

  • [00:15 - 00:35] Heroku is a platform as a service that allows us to easily spin up and launch applications without worrying about the underlying hosting. You can learn more about them and register for an account at their website.

  • [00:36 - 00:45] And there's a lot of other similar services. For this case, we're going to use Heroku as a quick way to launch a test application.

  • [00:46 - 01:02] So our very first thing is going to go ahead and be installing Heroku. I'm going to go and run the script that will install Heroku in my environment here, but you can find information for your own environment on the Heroku website as well .

  • [01:03 - 01:14] Once we've installed Heroku, we're going to have to go ahead and log in to Her oku. And the command to do that is essentially just Heroku log in.

  • [01:15 - 01:25] Once you've done that, you're going to be prompted for your application credentials. So let's see if we do this, and this is going to open up my browser and it's going to ask me to log in.

  • [01:26 - 01:29] So I'm going to go ahead and do that. All right, I'm it.

  • [01:30 - 01:42] So now that we're here, we're going to have to create a file that tells Heroku how we want our application to be deployed. And to do that, we're going to create a file called a proc file.

  • [01:43 - 01:55] And the proc file essentially tells Heroku what command it needs to run. So let's go back in our VS code editor and go ahead and create that file.

  • [01:56 - 02:06] What we want to do is run a production version of our server. To date, we've been running using the Flask development server, but that's not really suited for a production use case.

  • [02:07 - 02:18] So we're going to have to install another server called the unicorn that's more designed for production use cases. We'll go into more details about why it's useful later.

  • [02:19 - 02:30] So now that we've been set up unicorn, let's go and create a file called a proc file. And the proc file essentially gives this command that we want to run.

  • [02:31 - 02:56] So we're telling Heroku that in order to run our web server named web here, which is what Heroku looks for by default, it's going to have to run this command called unicorn bind to all port to like have listen on this part server and with this log level. This part is telling that the our flask applications defined in the server module with that variable name app.

  • [02:57 - 03:03] Let's kind of try this on our own terminal. The very first that we're going to have to do is we're going to have to install our requirements.

  • [03:04 - 03:08] We just added a new one there. So we're going to want to add unicorn to our requirements.

  • [03:09 - 03:15] Okay, then the next one is let's just set a port here. So let's say our port is going to be five thousand one.

  • [03:16 - 03:24] So let's try this out. If I run this command, unicorn is now listening at five thousand one.

  • [03:25 - 03:38] So we can go back into Firefox and check out what's going on our localist five thousand one. There's our application and then we can check that it's running here.

  • [03:39 - 03:53] And our application is no longer running localist five thousand. That page just won't load because we've told unicorn to listen on five thousand one and look for our app inside of the stock module or the server module.

  • [03:54 - 03:57] All right. So here we have our file.

  • [03:58 - 04:05] Once we have this proc file, that's basically it. Heroku will auto detect everything else and then we'll be good to go.

  • [04:06 - 04:14] All right, let's go back in our terminal. Let's run the next few steps to get Heroku going here.

  • [04:15 - 04:23] All right. So hit control C to get a unicorn server and let's go run Heroku create what this does.

  • [04:24 - 04:31] It'll create a quick application for us. And then we can initialize what's called a git repository here.

  • [04:32 - 04:44] So we get to get it here and get status. So we want to get add proc file or requirements and server.txt.

  • [04:45 - 04:50] We don't want to commit the cache file or that in files. That's not really important.

  • [04:51 - 05:00] And then we can do get status and then we want to do git commit dash M. Ah, our first commit.

  • [05:01 - 05:05] Okay. What we want to do is we want to go and say git push Heroku.

  • [05:06 - 05:08] Actually, let's check if that. Okay.

  • [05:09 - 05:18] So we don't have any remotes yet. So we're going to copy this URL that Heroku gave us and add that as a remote.

  • [05:19 - 05:23] So we're going to say git remote add Heroku. And so that's the name of the remote we're adding.

  • [05:24 - 05:26] Then we're going to paste that git URL that gave us. All right.

  • [05:27 - 05:34] Now that we had that, now we can run git push Heroku master. So we're pushing the name of the current branch onto Heroku.

  • [05:35 - 05:48] And we're basically telling Heroku what we want is it to deploy this current repository so out until everything we've committed. And you can tell that it automatically detects that we're using Python.

  • [05:49 - 06:05] We never told it we're using Python, but Heroku figured that out. And it's installing everything specified in our requirements.txt file because that's a convention and so Heroku knows well enough that we need to be installing that to run our application.

  • [06:06 - 06:10] So all right. So it's told us that it's done.

  • [06:11 - 06:19] So let's go ahead and go into Firefox and try load this page. So I'm here and it looks like we have everything running.

  • [06:20 - 06:21] So let's try stock. AAPL.

  • [06:22 - 06:30] Awesome. So we now have our very first production application running on Heroku.

  • [06:31 - 06:45] And you can actually share this with your friends or anyone else that you now have a production application running on the internet using Flask. In the next few videos, we're going to continue to build out the functionality here.