How to Get the Price of Any Ethereum Token in 3 Steps

Ethereum is undoubtedly the largest blockchain when it comes to dApp (decentralized application) and token development. In fact, the chain is home to a vast ecosystem of dApps you know, and new tokens are created daily. With a staggering amount of new tokens continuously under construction, it can be a cumbersome task to keep track of the different token prices, especially when you need to implement functionality such as getting the price of any Ethereum token into your code. Therefore, developers naturally choose to utilize Moralis and its convenient platform where you can implement this functionality with ease. That’s what we’re going to focus on now and show how you can get the price of any Ethereum token in three simple steps.

The Web3 development space has, from a conventional perspective, been lacking fundamental development tools and platforms. However, with Moralis and its powerful platform, this is no longer the case. The platform provides a great competitive advantage for its users, making it possible to shorten the time to market for all blockchain projects significantly. As such, the platform allows users to develop dApps and tokens quickly and efficiently, enabling companies and developers to cut costs. 

Moralis offers a selection of great development tools such as Moralis Speedy Nodes, the Moralis NFT API, real-time alerts, etc. Furthermore, Moralis also provides the Moralis Web3 API. We’ll use the Moralis Web3 API tool in this article as we show you how to get the price of an Ethereum token. The Moralis Web3 API is formerly known as the Moralis Deep Index API. We still use the Moralis Deep Index API URL to initialize the Moralis Web3 API, as shown in the examples further down in this article.

So, if you’re looking to become a dApp or token developer, we recommend signing up with Moralis today. The possibilities are endless with the platform, and it’s possible to save both significant time and resources throughout the complete development process.

What is an Ethereum ERC-20 Token?

Before diving deeper into the process of how we can get the price of an Ethereum token, we’re going to take a brief detour to better understand what an Ethereum ERC-20 token is. Tokens are a powerful and essential feature of the Ethereum ecosystem, and they are widely used. Furthermore, as it’s becoming significantly easier to create tokens, new ones are created every day. 

ERC-20 tokens have the ability to represent all sorts of things virtually. As such, their use cases range from representing everything from fiat currencies to skill points in a game. This means that the opportunities for these tokens are limitless and are also workable in many different scenarios. 

As they are such a prominent feature of the Ethereum ecosystem, it’s highly beneficial to have a regulating standard. This is precisely where the ERC-20 token standard comes into play. The standard ensures that all tokens have the same characteristics and properties. As such, the tokens following the standard have the same value and type, which makes them interchangeable. This makes these tokens, unlike NFTs (Non-Fungible Tokens), fungible. Which in turn means that we can measure the value of one token to another with ease. 

Moreover, the ERC-20 standard is closely related to the Ethereum blockchain. However, the standard is used for other chains as well. All chains utilizing EVM (Ethereum Virtual Machine) are compatible with tokens using this standard. 

The standard also implements an API for tokens with smart contracts. This means that the standard implements some functionality such as setting a total supply, transferring the token from one account to another, and fetching token balances of specific accounts. Furthermore, all ERC-20 tokens must implement the following events and methods:

How to Get Any Ethereum Token Price

The process of getting the price of an Ethereum token doesn’t have to be hard. In fact, with Moralis, it becomes quite easy. The Moralis platform provides all the necessary tools and supplies users with commands ready to use out of the box. To demonstrate the power of Moralis, we’re in this article going to make a simple application where users can query the price of an Ethereum token. 

The application we are about to create will have three different elements: an input field, a button, and another field where the result will display ttt. To fetch the USD price of a token, users need to provide the token address and then press the ”Get USD Price” button. As such, this is what the application will look like when they’re done:

This simple application consists of three main files that we are going to look closer at in this guide. Along with these files, there are a few others, such as a ”” file that initiates the entire application. However, there isn’t much to analyze regarding these files, which is why they aren’t included in this tutorial. If you want to take a closer look, you’ll be able to find the complete application in the GitHub repository

As the application consists of three files, we’ll break down the process of how to get any Ethereum token price into three simple steps: 

  1. Create an HTML index file.
  2. Set up a views file.
  3. Write the frontend logic.

All these steps are pretty straightforward, but to make the process even more convenient, we’ll go through each of the steps, starting with creating the HTML index file. However, if you prefer watching a video tutorial that explains the process, then check out this one from the Moralis YouTube channel

Step 1: How to Get the Price of Any Ethereum Token — Create an HTML Index File

Making an HTML index file is the first step in creating our own dApp for querying the USD price of any Ethereum token. The file contains all the HTML code which implements the fields and buttons for our UI (User Interface). As such, this is partly what the code looks like: 

As you might have noticed, the image from above is incomplete. The reason for this is that the picture can’t fit the entire code. However, for a closer look, you can find the rest of the code in the GitHub repository

Moreover, from analyzing the code, we can see that it contains three elements. First, we have a field in which the users can input the token address. Second, we have the ”Get USD Price” button. This button contains an ”onclick” event which triggers the ”getPrice()” function in JavaScript. As such, when the users click this button, they’ll receive the USD price of the token. They will present the price in the third element, which is also a field. However, you’re able to disable this field by default as the users never interact with this element. 

With all the fields and buttons established, we can move on and take a closer look at the next file in our directory, which will be the ”” file. 

Step 2: How to Get the Price of Any Ethereum Token — Set Up a Views File

As we’ve completed the first step, we can move on to create some of the logic of the application. The file contains the code for loading the templates of our dApp. This means that this code is responsible for loading the HTML file we created in the previous step. This is what it looks like: 

Furthermore, we also decided to include some of the logic in this file. One example is that we created the wrapper for the Moralis API with a route and a function. We first made the route, which is what we call the ”request-price” request on the frontend. Then we make a function called ”moralis_query()” that’ll take three arguments: address, chain, and name. This function is also part of the logic wrapping the call to the Moralis API. So, let’s analyze these two elements starting with the route.

Above you can see the route in its entirety, and the first thing we do in the code is to determine which kind of request the route will accept and for which endpoint. This is done with the following line of code ”methods=[”POST”]”, which only enables POST requests. This means that if we were to send a GET request instead, the endpoint wouldn’t accept the call, and the application wouldn’t work as intended.

The following line of the code creates a new variable and parses the incoming data along with returning it, upon which you call the ”moralis_query()” function. This function will return a JSON variable which in turn is used in the next line that ultimately returns the “res” variable.

The ”moralis_query()” Function

Next, we have the ”moralis_query()” function that creates two different variables: a URL that we want to query and a header field. The URL variable consists of four different elements: the broader URL for the API followed along with the address, chain, and chain name, making the URL more specific to the type of token. The variable for the header field is the value of our authorization key from Moralis. The next line of code executes a GET request with the variables as parameters. Finally, the function then returns the variable ”r” in JSON format.

Step 3: How to Get the Price of Any Ethereum Token — Write the Frontend Logic

Once we have established both the HTML file and the logic for wrapping the Moralis API, we can move on and create the frontend logic of our application. The frontend is quite simple, and it consists of two basic functions: ”getPrice()” and ”convert_populate(_response)”. In its entirety, the frontend looks like this: 

Let’s break down these two functions to better understand how they work, starting with ”getPrice()”. 

The first thing we do in this code is to create a new object with the address that users provide. Once we have the address object, we can make a call to our own server using the route that we made earlier. We make a ”request-price” request where we define the method, body, and headers. If the request returns a 200 response code, the code will execute the ”convert_populate” function, which is the second part of the code. If the request returns anything other than a 200, then an error message will be displayed. 

The ”convert_populate” function simply creates a variable with the USD price of the token for which the user provided the address and sets the ”amountUSD” element from our HTML file to the value of ”result”.

How to Get the Price of Any Ethereum Token — Summary

Acquiring the price for Ethereum tokens does not have to be a difficult task. With the right tools, it’s possible to design a simple application that allows users to continuously query the price for Ethereum tokens by simply providing the token’s address. The best tool for this task, and Web3 development in general, is Moralis.  

Moralis provides a fully managed backend infrastructure allowing users to save both valuable time and resources. Along with this, Moralis also provides tools and features such as native support for MetaMask, IPFS, real-time alerts, token balances, and, the Moralis Web3 API, which we need to make our applications work. 

To create an application that will allow us to get the price of any Ethereum token, all we need to do is follow these three steps:

  1. Create an HTML index file. 
  2. Create a ”” file containing the logic for wrapping the call to the Moralis API.
  3. Write the frontend logic for the dApp.

With Moralis, we can create this simple application for getting the price of Ethereum tokens in a matter of minutes using the platform’s tools. Furthermore, with Moralis, you can create all kinds of dApps, and there are excellent guides on how to build BSC dApps and how to build ETH dApps if interested. Furthermore, the Moralis blog offers a vast selection of articles allowing you to expand your Web3 development skills. 

So, if you’re looking to become a Web3 developer, we highly recommend signing up with Moralis right away. Joining the platform is entirely free, and it provides users with immediate access to all the platform’s tools.

Share on facebook
Share on twitter
Share on linkedin
Moralis Blog
Moralis Blog

Related Articles

The latest in Blockchain

Subscribe to the Moralis Magazine, and be the first to find out about the latest Web3 tech!