Use ISO4217 Currency Code API for your next fintech application

An overview of ISO4217 Currency Code

Do you know nearly 300 different currencies are used every day by people around the world in business? It is really important to have a standardised system to communicate currency with each other. That’s where ISO4217 Currency Code kick in. ISO4217 Currency Codes are the agreed alphabetic and numeric codes aiming for representing currencies. When you transmit overseas payments, read the news about currency values, or search for conversion rates online, you’ll notice currency codes. Though they common in use, few people know the best way to the full This API tutorial covers how standard ISO currency codes work, a list of currency codes for major currencies, and a hand-to-hand tutorial on how to build a custom ISO4217 Currency Code API with detailed steps. Read on!

What exactly is ISO4217 Currency Code?

ISO4217 Currency Code is an internationally recognised system established by International Organisation for Standardisation to give currencies a unique three-character code known as the ISO3 Country Code or “SWIFT” currency codes. The system aims to simplify matters and eliminate errors for currency trading and international trade.

Is it free to use ISO4217 Currency Code?

According to the official statement from International Organisation for Standardisation, the authority allows free-of-charge use of its ISO3166 Country Code, ISO4217 Currency Code and ISO639 Language codes.

Even though, users of ISO country codes have the choice to subscribe to a paid service that automatically gives updates and supplies the data in formats like .csv, .xml or .xls formats which are ready-to-use for various softwares and applications.

A break down on ISO4217 Currency Code

What is included in a ISO4217 Currency Code? In fact, every currency is denoted by three characters. In general, the first two characters represent the country and the last character identifies the currency itself. Let’s look at an example here: For the 3-character code for dollars in the United States is USD (the United States and dollars).

However, there are exceptional cases for the rule above. Like Euro (European Union’s official currency) and RUB (official currency of the Russian Federation) are named differently. Some might also starts with the letter “X” to indicate that the currency are reserved for special purposes such as when trading gold (XAU) and platinum (XPT).

Advantage of using ISO4217 Currency Code

Certainly, ISO4217 Currency Code has brought us convenience in daily uses. It is also handy for the automated systems thanks to numerical codes. They can ensure that currency codes are comprehensible for computers and nations that without Latin scripts. The numeric code is, whenever feasible, the same as ISO3166 Country Code.

What is “our” Currency Code?

You must be curious about the code for the currency in your region. Here we provide a list of codes for major currencies. Check this out and find the currency you are currently using!

Currency nameCode
Australian dollarsAUD
Belize dollarsBZR
Canadian dollarsCAD
Swiss francsCHF
Chinese yuanCNY
EuroEUR
Hong Kong dollarsHKD
Indian rupeeINR
Japanese yenJPY
Mexican pesoMXN
New Zealand dollarsNZD
US dollarsUSD
South African randZAR

What is an API?

We all know that there are somethings we just don’t want do it manually. That’s where APIs come in. An API, or application programming interface, is a set of rules and specifications that allow two software programs to communicate with each other. Developers can build applications that work seamlessly together and make it possible for end-users to complete complex tasks with just a few clicks. By using an API, you can save yourself time and effort of having to write your own code from scratch. Let’s take a closer look at what an API is and how you can use it in your own development projects. If you want to know more about what an API is, check this link out.

For example, imagine being able to book a flight, hotel, and rental car all in one place by using just a few taps on your smartphone. This would not be possible without APIs! As the world becomes increasingly interconnected, the importance of well-designed APIs will only continue to grow.

Create a sample ISO4217 Currency Code API

Why should you choose this server?

The ISO4217 Currency Code API is supported by OpenAPIHub, an All-in-one API Platform that supports API Needs and it is certified as “AWS Qualified Software” since 2022. You can register for an API portal for free, share and monetise APIs easily on the trustable platform certified by ISO27001.

Features

Using this tool, you can get currency and the country data.

1. Countries data

The data currently provided for each country is:

2. Currencies data

It is not that useful to just have the currency code(s) for a country, so included is currency data too:

  • name The english name for the currency
  • code The ISO 4217 code
  • number The ISO 4217 number
  • decimals The number of decimal digits conventionally shown
  • symbol The currency symbol for the currency (e.g. ¥, $ etc.). Some symbols are not available, in which case
    symbol contains the ISO 4217 code. Credit to bengourley/currency-symbol-map
    for the symbol database.

Prerequisites

You will need a suitable QR Code API provider. Using ISO APIs’ ISO4217 Currency Code API you can proceed easily as follows :

1. OpenAPIHub Developer Account

You need to sign up for an OpenAPIHub developer account in order to subscribe and access this API. For more information, please refer to “Register as a Developer“.

2. Active API Subscription

You need to subscribe to this API before consuming it. Many APIs come with a free trial plan so that you can experience the API functions provided free of charge. For more information, please refer to “Subscribe to APIs“.

3. API Credential

An API Key is required to access the API. It can be obtained in the Developer Admin Portal once you have completed the signup to OpenAPIHub. For more information, please refer to “Create API Key“.

You may check out the full API documentation here in the OpenAPIHub.

Create an easy-to-use User Interface

We are here to guide you with detailed step. Let’s get into first part – creating an user interface for users to enter their desired data for the API. 

ISO4217 Currency Code API_UI

Try this HTML yourself!

<div id="app">
  <div class="demo-description">
    <h2>ISO4217 Currency Code</h2>
    <span>To protect your credentials.</span>
    <br>
    <span>DO NOT save this API Key in the code sandbox!!</span>
  </div>
  <div class="test-area">
    <div class="input-area">
      <span>API Key</span>
      <input
        type="text"
        placeholder="Input your key here"
        v-model="apikey"
      >
      <br>
      
      <span>Mode</span>
        <select v-model="mode">
          <option value="code">Currency by Code</option>
          <option value="name">Currency by Name</option>
        </select>
      <br>
      
      <template v-if="isCode">
      <span>Code</span>
      <input
             type="text"
             placeholder="Code"
             v-model="code"
             >
      <br>
      </template>
      <template v-else>
      <span>Name</span>
      <input
             type="text"
             placeholder="Name"
             v-model="name"
             >
      <br>
      </template>
      
           
      <button v-on:click="convert">Get Currency</button>
    </div>

    <div class="output-area">
      <template v-if="error">
        <span v-html="error" />
      </template>
      <template v-else-if="!result">
        Fill in the API Key and select mode, then fill in the needed information and press "Get Currency".
      </template>
      <template v-else>
        <div v-html="result" />
      </template>
    </div>
  </div>
</div>

Integrate CSS on your Frontend Design

After creating the basic structure to get user input for the parameters, we need to add the following CSS to decorate our UI to make it more attractive!

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600&display=swap');
body {
  background: #20262E;
  padding: 20px;
  font-family: 'Open Sans', sans-serif;
}
 
#app {
  background: #fff;
  border-radius: 4px;
  padding: 20px;
  transition: all 0.2s;
  /* height: 400px; */
}
 
.demo-description {
  text-align: center;
  margin-bottom: 20px;
}
 
.demo-description h2 {
  font-weight: semibold;
  margin-bottom: 5px;
}
 
.demo-description span {
  color: #999999;
}
 
.test-area {
  display: flex;
}
 
.input-area {
  text-align: right;
}
 
.input-area span {
  display: inline-block;
  line-height: 48px;
  margin-right: 8px;
  text-align: right;
  width: 150px;
}
 
.input-area input, select {
  border: 1px solid #999999;
  border-radius: 3px;
  height: 30px;
  width: 150px;
  padding: 0 7px;
}

.input-area select {
  height: 32px;
  width: 166px;
}
 
.input-area input::placeholder {
  color: #d0d0d0;
}
 
.input-area button {
  background-color: #57abf0;
  border: 0;
  border-radius: 4px;
  color: #ffffff;
  font-weight: 600;
  margin-top: 15px;
  width: 166px;
  padding: 15px 10px;
}
 
.output-area {
  color: #505050;
  font-size: 14px;
  margin: 20px;
  margin-right: 0px;
  width: calc(100% - 350px);
}
 
@media screen and (max-width: 616px) {
  .input-area {
    text-align: center;
  }

  .input-area span {
    text-align: left;
  }
   
  .output-area {
    width: calc(100% - 150px);
  }
   
  .input-area button {
    width: 140px;
    padding: 10px 7px;
  }
}
 
.output-area svg {
  transform: scale(0.7) translateX(-30px) translateY(-95px);
}

Interact your UI with Vue.js

Now, you can add the following Vue.js script to get currency code and related information.

const endpoint = 'https://trial-api-iso-7217-currency-code-4xdd.gw.openapihub.com/iso7217-currency-code/currency-by-';

new Vue({
  el: '#app',
  data() {
    return {
      apikey: '',
      mode: 'code',
      name: '',
      code: '',
      isCode: true,
			result: '',
      error: ''
    }
  },
  watch: {
  	mode: function(newMode) {
    	if(newMode === 'code') {
      	this.isCode = true
      } else {
      	this.isCode = false
      }
    }
  },
  methods: {
    convert: function() {
      const axiosConfig = {
        headers: {
          'content-type': 'application/json',
          'x-openapihub-key': this.apikey
        }
      }
			
      const params = this.isCode ? { code: this.code } : { name: this.name };
      axios.get(`${endpoint}${this.mode}`, {
        params: params,
        headers: axiosConfig.headers
      })
        .then(res => {
        this.error = ''
        this.result = `Result -<br>${JSON.stringify(res.data).replaceAll(',',',<br>&nbsp;&nbsp;&nbsp;&nbsp;').replaceAll('{','{<br>&nbsp;&nbsp;&nbsp;&nbsp;').replaceAll('}','<br>}')}`
      }).catch(err => {
        this.error = `Error occurred -<br>${err.response.data.message}`
        console.log('Error', err.response.data.message)
      })
    }
  }
})

Now that we have all the materials prepared. Let’s take a look at getting a currency code information with our API. 

Simply Fill in the API Key and select mode, then fill in the needed information and press “Get Currency”. Swiftly, you can get what all you need!

The output would be shown as follows:

Conclusion

While ISO4217 Currency Code brings benefits to manual users, it is also a powerful tool works with your automation that drive traffic and sales to your website or product. By understanding how it works and how to create ISO4217 Currency Code API, you can obtain the up-to-date currency information for any needs.

Next Steps?

Enjoy the above tutorial and want to learn of more useful API? Explore more on OpenAPIHub!

OpenAPIHub is an API Platform that help you define API subscription and enable API Monetization with ease. Check the following 2-min What is OpenAPIHub video for more and try OpenAPIHub for Free!

Ready to Start Your API Journey?

Join OpenAPIHub and connect to the fast growing API Hub Community to grow your API Business today!

Start for Free

Discover more from OpenAPIHub Community

Subscribe now to keep reading and get access to the full archive.

Continue reading