Finage | Blog Create your own currency converter page with Python (Flask)

Products

Docs

Pricing

Charts

Resources

Status

Products

Docs

Pricing

Charts

Resources

Status

Back to Blog

by Finage at July 19, 2020 3 MIN READ

Stocks

Create your own currency converter page with Python (Flask)

Today, we will create a simple currency converter widget for our website. We will use Python and Flask together to build this simple widget. Let’s start.

HTTPS://GITHUB.COM/FINAGELTD/FINAGE-EXAMPLE-WIDGET

Flask Installation

Firstly, you need to create a folder and a venv folder inside this folder:

$ mkdir currencyconverter
$ cd currencyconverter
$ python3 -m venv venv

If you are using Windows, then you should use this command

$ py -3 -m venv venv

We will use Python3 for this project but if you want to continue with Python2, you need to use these commands;

$ python2 -m virtualenv venv

for Windows;

\Python27\Scripts\virtualenv.exe venv

After these steps, active your environment;

$ . venv/bin/activate

for Windows;

> venv\Scripts\activate

At least, install the Flask.

$ pip install Flask

Let’s start to build a currency converter

I’ll continue with MacOS, if you do not know how to use Flask on Windows. Please visit https://flask.palletsprojects.com/en/1.1.x/quickstart/

I’ll create an app.py and export it;

$ export FLASK_APP=app.py

Then, you should create a folder that named templates. Your architecture will look like this;

/app.py
/templates
    /index.html

app.py and the index.html files will look like this.

from flask import Flask
from flask import render_template
app = Flask(__name__)
 
@app.route('/convert/')
@app.route('/convert/<base>/<to>/<amount>')
def convert(base=None, to=None, amount=None):
  return render_template('index.html', base=base, to=to, value = value)

view raw app.py hosted with ❤ by GitHub

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
 
{{ base + to }}
 
</body>
</html>

view raw index.html hosted with ❤ by GitHub

Run,

flask run

and open the browser and go to http://127.0.0.1:5000/convert/gbp/usd/1 , you will see your index.html file here.

If you can see “gbpusd” in the output of this URL, then everything is okay.

Let’s continue. We will use the “Requests” library to make API requests. You can install “requests” with the given command below.

pip install requests

Also, we need to parse the requested JSON data. So, we need to import “json”.

import json

We are ready to make an API request to get latest currency value.

r = req.get('https://api.finage.co.uk/last?currencies='+currency+'&apikey=YOUR_API_KEY')

This line will make an API request. We will get “currency” from the URL and calculate the amount. URL will fill the link that given above and it will look like this.

https://api.finage.co.uk/last?currencies=USDGBP&apikey=YOUR_API_KEY

Response

{"currencies":[{"name":"GBPUSD","value":1.29303,"change":0.0053,"difference":0.41}],"lastUpdate":"2020-07-28T20:31:34","lastUpdate_Timestamp":"1595968294"}

In this project, we will get the base currency and the second currency from the URL. After that, our application will make an API request to get the latest values from the Finage. Also, we get the amount from the URL. Check the last status of the index.html and app.py below;

from flask import Flask
from flask import render_template
import requests as req
import json
app = Flask(__name__)
 
@app.route('/convert/')
@app.route('/convert/<base>/<to>/<amount>')
 
def convert(base=None, to=None, amount=None):
currency = base + to
r = req.get('https://api.finage.co.uk/last?currencies='+currency+'&apikey=YOUR_API_KEY')
response = json.loads(r.text)
calculation = "%.2f" % (response["currencies"][0]["value"] * float(amount))
value = response["currencies"][0]["value"]
change = "%.2f" % (response["currencies"][0]["change"])
difference = "%.2f" % (response["currencies"][0]["difference"])
last_update = response["lastUpdate"]
 
return render_template('index.html', base=base.upper(), to=to.upper(), value = value, calculation = calculation, amount=amount, change=change, difference = difference, last_update=last_update)

view raw app.py hosted with ❤ by GitHub

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> Currency Page </title>
</head>
<body>
 
 
<style>
html, body { background-color: #2A2B2A; font-family: Helvetica; }
div { -webkit-box-shadow: -5px 2px 42px -4px rgba(0,0,0,0.75); -moz-box-shadow: -5px 2px 42px -4px rgba(0,0,0,0.75); box-shadow: -5px 2px 42px -4px rgba(0,0,0,0.75); }
.converter { position: relative; display: block; margin: 50px auto; background: #E5446D; color: #fff; padding: 40px 20px; border-radius: 10px; width: 325px; }
.converter #base, #to { text-align: center; display: inline-block; font-size: 18px; padding-top: 15px; }
.converter .item { width: 45%; }
.converter #amount, #calculation { display: inline-block; text-align: center; font-size: 34px; vertical-align: sub; }
.converter #last_update { position: absolute; right: 10px; bottom: 7px; font-size: 11px; }
.currency-information { background-color: #FF8966; width: 325px; color: #fff; min-height: 100px; margin: 0 auto; padding: 20px; border-radius: 10px;}
.currency-information h4 { font-size: 28px; width: 100%; text-align: center; margin: 0; padding-bottom: 10px;}
.currency-information span { display: block; padding: 5px 0; text-align: center; }
</style>
 
<div class="converter">
 
<span class="item" id="amount">{{amount}}</span>
<span class="item">→</span>
<span class="item" id="calculation">{{ calculation }}</span>
 
<span class="item" id="base">{{base}}</span>
<span class="item">→</span>
<span class="item" id="to">{{to}}</span>
<span id="last_update">{{last_update}}</span>
</div>
 
<div class="currency-information">
<h4> {{ base + to }} </h4>
<span>1 {{ base }} = {{ value }} {{ to }} </span>
<span><b>Daily Difference:</b> {{difference}}</span>
<span><b>Daily Change:</b> {{change}}%</span>
</div>
 
</body>
</html>

view raw index.html hosted with ❤ by GitHub

If you make a request like http://localhost:5000/convert/usd/gbp/100

You’ll see something like this;

You can check the available currency list from here

https://docs.finage.co.uk/#/symbols/

If you want to try Finage’s API, you can get your FREE API with the link given below.

Visit Github to access this project.

https://github.com/FinageLTD/finage-example-widget

If you have any questions, please feel free to ask. Also, you can contact with our support team on the live chat section.

Join Us

You can test all data feeds today!

Start Free Trial

If you need more information about data feeds, feel free to ask our team.

Request Consultation

Back to Blog

Request a consultation

Products

Company

Apply for Partnership

Resources

Apps

Blog

How to Use WebSocket for Real-Time Financial Data: Benefits and Implementation Guide

In the competitive landscape of financial trading, access to real-time data is paramount. Traders, investors, and financial platforms all depend on the ability to get immediate updates on market conditions to make timely and well-informed decisions. While traditional HTTP APIs have served this pur

Predicting Market Trends Using Quantum Finance

The financial market is notoriously volatile and navigating it requires innovation and a suitable toolkit. The use of something like a Historical data market API is a way of going about it and with AI coming into the fray, the ability to not only make predictions but analyze data has only increase

Please note that all data provided under Finage and on this website, including the prices displayed on the ticker and charts pages, are not necessarily real-time or accurate. They are strictly intended for informational purposes and should not be relied upon for investing or trading decisions. Redistribution of the information displayed on or provided by Finage is strictly prohibited. Please be aware that the data types offered are not sourced directly or indirectly from any exchanges, but rather from over-the-counter, peer-to-peer, and market makers. Therefore, the prices may not be accurate and could differ from the actual market prices. We want to emphasize that we are not liable for any trading or investing losses that you may incur. By using the data, charts, or any related information, you accept all responsibility for any risks involved. Finage will not accept any liability for losses or damages arising from the use of our data or related services. By accessing our website or using our services, all users/visitors are deemed to have accepted these conditions.

Finage LTD 2024

	from flask import Flask
	from flask import render_template
	app = Flask(__name__)

	@app.route('/convert/')
	@app.route('/convert/<base>/<to>/<amount>')
	def convert(base=None, to=None, amount=None):
	return render_template('index.html', base=base, to=to, value = value)

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
	</head>
	<body>

	{{ base + to }}

	</body>
	</html>

	from flask import Flask
	from flask import render_template
	import requests as req
	import json
	app = Flask(__name__)

	@app.route('/convert/')
	@app.route('/convert/<base>/<to>/<amount>')

	def convert(base=None, to=None, amount=None):
	currency = base + to
	r = req.get('https://api.finage.co.uk/last?currencies='+currency+'&apikey=YOUR_API_KEY')
	response = json.loads(r.text)
	calculation = "%.2f" % (response["currencies"][0]["value"] * float(amount))
	value = response["currencies"][0]["value"]
	change = "%.2f" % (response["currencies"][0]["change"])
	difference = "%.2f" % (response["currencies"][0]["difference"])
	last_update = response["lastUpdate"]

	return render_template('index.html', base=base.upper(), to=to.upper(), value = value, calculation = calculation, amount=amount, change=change, difference = difference, last_update=last_update)