Introduction
I’ve been doing a fair amount of mucking around with Python as a tool to create web apps, and I’ve been making some progress in this respect. My latest project has involved me creating a web app for comparison.
These are the tools that I’ve used:
Python 3: For programming the app
Flask: This micro framework allows for the creation of dynamic web sites
Heroku: This is a service that allows yo to host your apps for free.
My code is here on Github, but I should note that it is very similar to this code, which I used as a basis for developing my own app.
Building the App
The app is made up of two files (not including the templates and the css). They are app.py and weather.py.
App.py is relatively simple. It imports flask, and render_template and request (for working with APIs). It also imports functions from weather (which I will describe later). It then creates two routes – both on the index, one as a post. For the post route, it calls the api and then returns the information.
Weather.py has two main functions in build. It gets the local time, and also queries the API using the requests function. The crucial part here is the format that it uses. It returns the data, too, which can then populate the post template.
The styling is handled by Pure CSS. Again, I don’t really know too much about this one. It is worth looking into, as it seems to be working better than Bulma, which is what I used on my previous app.
Building the Templates
THere is only one template, so I haven’t separated it out at all. Instead, it is quite straightforward. The first things is a form, which links with flask is there is an entry made on it. Then it checks to see if there is an error, and prints an error alert if it finds one. If there is no error, it creates a pretty table with two rows, filled with the information.
Getting the API
This is relatively straightforward. You create a free account on open weather map and then generate an API key. This is actually where I had a difference with the tutorial that I used. They suggested creating the API in the environment, but I just hard coded it into my app. I recognize this is perhaps not secure, but it will do for the moment until I learn how to do it better.
Deploying to Heroku
The documentation from Heroku is very good, but I must admit that I have run into a fair few challenges trying to deploy the app to the Heroku service. My understanding is that you can use Git to do this. In this case, you basically create a Heroku branch and push your code to that branch (from your main or master branch on Github). Then you start the app on Heroku. Most of my problems revolved around some older instructions that I found that talked about the master branch, but that has now changed to main. Once I fixed that, it seemed to work.
Another problem related to the use of gunicorn – I hadn’t used this for serving the app before, but every example I found recommended it as the way to go. The syntax is a little bit tricky and confusing at first, but I got that right in the end. This needs to go in the procfile.
There is also, as you would expect, an expectation that you provide a requirements folder. To create this I used freeze, which again, is something that is new.
Once deployed to Heroku, the app seemed to work pretty well. You can see it here: https://young-reaches-34384.herokuapp.com