Adalo Crypto Price API & Widget using coinmarketcap

The Adalo Guy
7 Feb 202206:24

TLDRIn this informative video, the presenter explores two methods to integrate cryptocurrency prices into an Adalo app. The first method involves using a free ticker from CoinMarketCap, which is displayed in a web view. The second method offers more control and customization by utilizing the CoinMarketCap API and setting up an external collection for data accessibility. The presenter guides viewers through the process of obtaining an API key, creating a custom action with an endpoint, and adding a results key to fetch cryptocurrency listings. The video concludes with a preview of the app displaying the latest crypto listings, providing a helpful introduction to using the CoinMarketCap API for app development.

Takeaways

  • 📈 **Use CoinMarketCap for Crypto Prices**: The video discusses two methods to integrate cryptocurrency prices into an Adalo app.
  • 🎟️ **Simple Ticker Widget**: The first method is using a ticker from CoinMarketCap, which can be displayed in a web view.
  • 💻 **Pragma Flow WebView**: A component from Pragma Flow is used to display the ticker in the app.
  • 📋 **Customize Your Ticker**: You can customize the ticker on CoinMarketCap's widget page by selecting the cryptocurrencies you're interested in.
  • 📄 **HTML Code for Widget**: After customizing, you get the widget's HTML code which you then encode and insert into the Pragma Flow WebView component.
  • 🆓 **Free to Use**: The widget is free and does not require signing up for an account.
  • 🔑 **CoinMarketCap API**: The second method involves using the CoinMarketCap API for more control and customization options.
  • 📈 **API Account and Key**: You need to create a free account on CoinMarketCap to obtain an API key for authentication.
  • 📚 **Documentation and Endpoints**: The video guides through looking at the API documentation and setting up an external collection with a specific endpoint.
  • 🔗 **Authorization Header**: When setting up the API connection, an authorization header with the API key is required for authentication.
  • 📊 **Data Structure**: The video explains how to set the 'data' as the results key to match the structure of the API response.
  • 📱 **Custom List Creation**: After setting up the collection, you can create a custom list to display cryptocurrency names and USD prices.
  • 💵 **Formatting for Currency**: It's suggested to add a dollar prefix for the price to display it as a currency.
  • 📘 **Explore More Endpoints**: The video mentions that CoinMarketCap offers many different endpoints, some available on the basic plan and others on paid plans.

Q & A

  • What are the two methods discussed in the video for integrating cryptocurrency prices into an Adalo app?

    -The two methods discussed are using a ticker from CoinMarketCap displayed in a WebView and using the CoinMarketCap API to set up an external collection for more control over the data.

  • How can you display a cryptocurrency ticker from CoinMarketCap in an Adalo app?

    -You can use a WebView with a component from Pragma Flow, then go to CoinMarketCap's widget page, customize your ticker, copy the HTML code, encode it, and insert it into the WebView component.

  • What is the advantage of using the CoinMarketCap API over the ticker method?

    -The API provides more power and control over the data, allowing for different functionalities and customization within the Adalo app.

  • How many API calls are included in the free plan on CoinMarketCap?

    -The free plan on CoinMarketCap includes 10,000 API calls per month.

  • What is required to use the CoinMarketCap API?

    -To use the CoinMarketCap API, you need to create an account, obtain an API key, and set up an external collection in Adalo with the base URL and authorization header using the API key.

  • What is the purpose of the 'results key' when setting up an external collection with the CoinMarketCap API?

    -The 'results key' is used to specify the key in the API response under which the data is nested. For the 'get all' endpoint, the results key is 'data'.

  • How can you customize the display of cryptocurrency prices in the Adalo app?

    -You can customize the display by adding a custom list, specifying the name of the cryptocurrency, and setting a subtitle for the US dollar price. You can also add a dollar prefix for the price display.

  • What is the benefit of using a widget ticker for displaying cryptocurrency prices?

    -The widget ticker is an easy and free option that doesn't require signing up for additional services. It allows for quick integration of cryptocurrency prices into the Adalo app.

  • What are some of the limitations of the free CoinMarketCap account?

    -The free CoinMarketCap account has a limit of 10,000 API calls per month. Some endpoints may only be available on paid plans.

  • How can one get started with using the CoinMarketCap API?

    -To get started, sign up for a CoinMarketCap account to obtain an API key, then refer to the API documentation to understand the different endpoints and how to use them.

  • What is the purpose of encoding the HTML code for the CoinMarketCap widget?

    -Encoding the HTML code is necessary to ensure that it is properly formatted and can be correctly interpreted by the WebView component in the Adalo app.

  • What are some of the different endpoints provided by CoinMarketCap for accessing cryptocurrency data?

    -CoinMarketCap provides various endpoints, including the latest listings, cryptocurrency information, market data, and historical data, which can be used for different functionalities in the Adalo app.

Outlines

00:00

🌐 Introducing Cryptocurrency Price Integration Methods

This paragraph introduces viewers to two methods of integrating cryptocurrency prices into an Adalo app. The first method is a simple and easy-to-implement ticker from Coin Market Cap, displayed in a web view. The second method involves using the Coin Market Cap API and setting up an external collection, allowing for more control and usage of the data within the app. The paragraph provides a step-by-step guide on how to use the Pragma Flow component and Coin Market Cap's widget to embed a cryptocurrency ticker in the app. It emphasizes the ease and the free nature of this option, requiring no sign-up or additional steps.

05:03

💡 Advanced Data Control with Coin Market Cap API

The second paragraph delves into the more advanced method of using the Coin Market Cap API for greater control over cryptocurrency data. It explains the process of creating an account, obtaining an API key, and setting up an external collection in the app. The paragraph provides a detailed walkthrough on how to access different endpoints, with a focus on the 'latest' endpoint for cryptocurrency listings. It also covers the importance of the results key and how to structure the API call to extract the necessary data. The paragraph concludes by showcasing a custom list of Coin Market Cap listings with cryptocurrency names and USD prices, and encourages further exploration of the various endpoints available on Coin Market Cap.

Mindmap

Keywords

💡Adalo App

Adalo is a platform that allows users to create mobile applications without needing to write code. In the video, the creator is discussing how to integrate cryptocurrency prices into an Adalo app, which is the main theme of the video.

💡Cryptocurrency Prices

This refers to the current market values of various digital currencies like Bitcoin, Ethereum, and Cardano. The video focuses on methods to display these prices within an Adalo app, which is essential for users interested in tracking the value of their digital assets.

💡Coin Market Cap

Coin Market Cap is a website that provides data on cryptocurrency prices, market capitalizations, and other related information. It is mentioned in the video as the source for both a ticker widget and API data to be integrated into the Adalo app.

💡Ticker

A ticker is a real-time display of the latest prices for stocks, cryptocurrencies, or other assets. In the video, the ticker from Coin Market Cap is used as an easy way to show cryptocurrency prices in a web view within the Adalo app.

💡Web View

A web view is a component within an app that displays web content. In the context of the video, a web view is used to display the Coin Market Cap ticker widget, allowing users to see cryptocurrency prices directly within the Adalo app.

💡Pragma Flow Component

Pragma Flow is a tool that allows users to integrate web content into their mobile applications. In the video, a Pragma Flow component is used to embed the Coin Market Cap ticker widget into the Adalo app.

💡API (Application Programming Interface)

An API is a set of rules and protocols that allows different software applications to communicate with each other. The video discusses using the Coin Market Cap API to fetch cryptocurrency price data for more control and customization within the Adalo app.

💡API Key

An API key is a unique identifier used to authenticate a user, device, or application with an API. In the video, the creator instructs viewers to obtain an API key from their Coin Market Cap account to access the API data.

💡External Collection

In the context of the Adalo platform, an external collection is a way to store and manage data that is retrieved from an external source, such as an API. The video demonstrates setting up an external collection to store cryptocurrency data fetched from the Coin Market Cap API.

💡Custom List

A custom list in Adalo is a user-defined list that can be populated with data from various sources, including external collections. The video shows how to create a custom list to display cryptocurrency names and their USD prices, leveraging the data from the Coin Market Cap API.

💡Authorization

Authorization is the process of verifying and granting permissions to access a resource or service. In the video, the creator discusses how to set up authorization by adding an API key as a header to the API request, which is necessary to use the Coin Market Cap API.

Highlights

Explore different ways to integrate cryptocurrency prices into your Adalo app.

Two methods presented: using a CoinMarketCap ticker and utilizing the CoinMarketCap API.

Easy ticker integration through a WebView and the Pragma Flow component.

Customize the ticker on CoinMarketCap's widget page to include desired cryptocurrencies.

Obtain the widget HTML code and encode it for use in the app.

Free widget option requires no sign-up and is simple to implement.

For more control, use the CoinMarketCap API with a free account offering 10,000 API calls per month.

Create an account on CoinMarketCap to receive an API key for authorization.

Set up an external collection in Adalo using the CoinMarketCap API endpoint.

Add a header for authorization using the API key as the value.

Specify the results key as 'data' to match the API response structure.

Test the external collection to ensure successful data retrieval.

Create a custom list in Adalo to display cryptocurrency names and USD prices.

Add a dollar prefix for proper currency display in the custom list.

Preview the app to view the latest crypto listings from CoinMarketCap.

Introduction to using the CoinMarketCap API, including authorization and documentation review.

CoinMarketCap provides various endpoints for different use cases, some available only on paid plans.

The video aims to help users get started with integrating cryptocurrency data into their Adalo apps.