LogoLogo
  • Introduction to the Muse DAO
  • Developer Vision
  • DAPPS
    • Fast Dapp
      • Tutorials
        • Getting started
          • Make an ERC20 transfer app
      • Components
        • Contract Read
        • Contract Write
        • APICall
        • Events
        • Address Display
        • Block Number
        • Ethereum Balance
        • PleaseConnect (Request user connection)
        • Token Balance (ERC20)
        • WatchEvents
        • AirStack
        • Sweep NFT floor
        • Token amount (ERC20)
        • Token name (ERC20)
        • Uniswap tradebox
        • Moment (display date/time)
      • Variables
        • userAddress
        • ABIs
        • connectedChain
        • Passing arbitrary data in query URL parameters
        • location
        • Toast
      • Templates
        • ERC20 Token transfer
        • Nouns Auction
        • AAVE V3
        • Lido Staking page
        • DAI Saving Rate
        • ERC6551
        • Popular NFT collections buy button
        • Non Fungible Message
        • No Shit Sherlock
      • Style
    • Launch
      • How to Launch a project
      • How to buy from a Launch
      • How to sell into a Launch
      • FAQ
    • NFT20
      • Use Cases
      • Liquidity Incentives
      • Guides
        • Adding a project
          • Create Pool
      • Contracts
        • NFT20Factory
          • Source
        • NFT20Pair
          • Source
      • API
      • Fees
    • ETHCMD
    • RolodETH
    • The Very Nifty Gallery
    • CUDL Game
      • Pets
      • $CUDL
      • MILK
      • Bazaar
      • Battles and weapons
    • Feather NFT
    • Dreams of EVM NFT
    • Sudoswap,js
    • The Quest (Sword & Shield)
    • Royal Game
    • Space Goo
    • NFT API
    • Pepesea NFT Marketplace
  • Tokenomics
    • $MUSE
    • Treasury
  • Other resources
    • Governance
    • Links
Powered by GitBook
On this page
  • Props​
  • Simple example
  • Example with Reservoir API
  1. DAPPS
  2. Fast Dapp
  3. Components

APICall

Get some data from an external API.

PreviousContract WriteNextEvents

Last updated 1 year ago

Props

  • url

  • params ()

  • renderFunction

Simple example

<APICall url="https://min-api.cryptocompare.com/data/price?fsym=ETH&tsyms=BTC,USD,EUR"
renderFunction={
    (res) => (
        <div>The price of ETH is: ${res.USD}</div>
    )
}
 />

Example with Reservoir API

<APICall
  url="https://api.reservoir.tools/collections/v5"
  params={{
    headers: {
      "x-api-key": "demo-api-key",
    },
  }}
  renderFunction={(collections) => (
    <div class="grid grid-flow-row gap-2 sm:grid-cols-1 md:grid-cols-1 lg:grid-cols-2 xl:grid-cols-3">
      {collections.collections.map((collection) => (
        <div
          key={collection.id}
          class="card w-full p-4  bg-base-100 shadow-xl image-full"
        >
          <figure class="h-full w-full m-0 p-0">
            <img
              class="h-full w-full object-contains"
              src={collection.banner}
            />
          </figure>
          <div class="card-body">
            <h2 class="card-title text-white">{collection.name}</h2>
            <p>
              {collection.description != null
                ? collection.description.substring(0, 150) + "..."
                : ""}
            </p>
            <div class="card-actions justify-end">
              <ReservoirSweep
                collectionAddress={collection.id}
                buttonText={"Buy a " + collection.name}
              />
            </div>
          </div>
        </div>
      ))}
    </div>
  )}
/>
​
axios request config