Pre-Built Extensions

High-level ready and write functions with built-in pre/post-processing for common standards.

Prebuilt read extensions

Extensions let you do more with less code. High level functions with simple API that do pre and post processing for all common standards.

Code

import { getContract } from "thirdweb";
import { ethereum } from "thirdweb/chains";
import {
  MediaRenderer,
  useReadContract,
} from "thirdweb/react";

const nftContract = getContract({
  address: "0xbc4ca0eda7647a8ab7c2061c2e118a18a936f13d",
  chain: ethereum,
  client: THIRDWEB_CLIENT,
});

function App() {
  const { data } = useReadContract(getNFT, {
    contract: nftContract,
    tokenId: 458n,
  });

  return (
    <MediaRenderer
      client={THIRDWEB_CLIENT}
      src={data?.metadata.image}
    />
  );
}

Preview

Prebuilt write extensions

Extensions let you do more with less code. High level functions with simple API that do pre and post processing for all common standards.

Code

import { getContract } from "thirdweb";
import { sepolia } from "thirdweb/chains";
import { claimTo } from "thirdweb/extensions/erc20";

const tw_coin = getContract({
  address: "0xACf072b740a23D48ECd302C9052fbeb3813b60a6",
  chain: sepolia,
  client: THIRDWEB_CLIENT,
});

function App() {
  return (
    <TransactionButton
      transaction={() =>
        claimTo({
          contract: twCoinContract,
          to: account.address,
          quantity: "10",
        })
      }
    >
      Claim
    </TransactionButton>
  );
}

Preview