Flask App for Exchange Rates
web-devFlask App for Exchange Rates
Objective
All developers in the modern day need to understand web technologies at some level. Whether you're interacting with a Jupyter notebook or querying a web api, understanding how a CLIENT requests information from a SERVER and to see how the SERVER produces its response is incredibly valuable.
Overview
We will make a web app that serves as both a CLIENT to an external api (exchangeratesapi.io). This app will show conversion rates for currencies, and then add some more complex data.
Prerequisites
For this project we recommend all use Atom (or Sublime) to write code and a shell/terminal to execute the program. All instructions will be given assuming a Python 3.6 install.
You should probably have the Flask documentation up as we go through the exercise.
Initial Setup
Create a folder for this project: mkdir mentorship_web && cd mentorship_web
If you are using Linux or OS X, run the following to create a new virtualenv
python3 -m venv venv source venv/bin/activate
On Windows, run the following
python3 -m venv venv venv\Scripts\activate
Install Flask, our main web-app: pip install flask
Create a new file called app.py
from flask import Flask app = Flask(__name__) @app.route('/') def hello_world(): return "Hello World!" if __name__ == '__main__': app.run(debug=True)
Run your flask app: python app.py
It should display a link, paste that in your browser to see the running code.
Display some Exchange Rates
Define a dictionary with three entries like the following inside your hello route:
exchange_rates = { 'EUR': '...', 'GBP': '...', '
Pick any currencies you want! We'll display the values as they convert to USD (because we are in Chicago). Better specify that now for clarity. Add this line just bellow your app =
definition, we'll use it later:
BASE_CURRENCY = 'USD'
Of course, fill in the ...
with real currency values, otherwise our site is pointless! Use a tool like X-Rates to look up the currency conversions.
Now update the return string in the hello route to include the information about these currencies.
Make it Beautiful
Returning strings is fine...I suppose. But I want big, beautiful HTML! Research Flask's render_template
function and add some beautiful looking HTML to format your. Hint: You'll want to create a templates/
folder in the same directory as your app.py
, and if you aren't using a kind of loop in your template...it's going to get real tough for you later!
Test your work by adding another currency to your exchange_rates
dictionary and watch how your page changes.
Refactor
Define a function right under your BASE_CURRENCY
definition that looks like the following:
def exchange_rates(): return # Move your dictionary here
Then replace any references in your code to use the function instead of defining the dictionary in your route!
Automatic Data
Now comes the fun part. What if we could get the exchange rates on a live feed from a third party service? We can with ExchangeRatesAPI.io. This is a free api that runs over simple HTTPS! We'll have something like the following:
def exchange_rates(): response = requests.get('https://api.exchangeratesapi.io/latest') return # What are we going to put here now?
Read up on Requests' built in JSON Parsing and try to extract the data from the API response. Your end goal is to return all of the currencies from this function.
Hint: This problem is a great time to use the Python debugger (pdb
)! Insert the following line before the return
command and interact with your server on the command line. So cool!
import pdb; pdb.set_trace()
Correct Currency
Are we sure the previous step is getting us the currency in our BASE_CURRENCY
variable? Investigate the api docs to find out how you can change the base currency to the one we want.
You DID it! Now what?
From here on out we are trusting that you can use the documentation, look for resources on your own, and come up with clever solutions to these problems. Try each one, and if you get stuck, move on to a different one! Ask for help if you want more clarification or can't think of a way to do it.
Information Overload
Could we provide a form that would let people get only the currency they want? I don't need every currency. We'd probably use some kind of html form. And I bet Flask has some documentation on receiving requests from the client.
e.g. Instead of JPY->*
I only want to see USD->GBP
or I only want to see USD->JPY
.
Order by Value
How could we order the currencies by the value of the currency?
e.g. If something is .00001 USD
, lets list that last, and if something is 987654321 USD
lets list that first.
User-Specified Base Currency
Some users of our product have complained, rightfully, that they can only get the currency listed in USD
. We should let them specify what currency they want.
e.g. Instead of USD->*
I want to see CNY->*
Bonus: Links to each user-specified currency from the currency list
Wouldn't it be great if each currency as it appeared would link to its own currency conversion?
e.g. From the home page I could click on JPY
to find out all of the conversions from JPY->*
.
Caching
Do we really need to use an API request every time we do a call? How could we store the results of each run to avoid API abuse.
Comments
Comments powered by Disqus