Enable Gasless Transactions For Your dApp With Gelato Relay!

This is an updated version of a developer tutorial originally posted on Thirdweb.

TL;DR

This guide shows you how to build a gasless app using Gelato Relay SDK and Thirdweb's React SDK. We'll build two React components, CounterApp and GaslessNFTApp, that let users increment a counter or mint an NFT without paying gas fees.

Web3 onboarding is complex due to gas fees. Gelato Relay removes this friction by sponsoring transactions. Combined with 1Balance, developers can cover fees for users across all supported networks. We'll also use Thirdweb’s React SDK for wallet connections and contract interactions.

Initialization & Dependency Installation

Step 1: Clone the repo & install dependencies

git clone https://github.com/gelatodigital/gelato-thirdweb-relay
cd gelato-thirdweb-relay
npm install

Step 2: Run the project

npm start

Visit http://localhost:3000/ to see the app.

Step 3: Connect your wallet and switch to Polygon mainnet. Use Thirdweb's "Connect Wallet" button in the UI.

When you click increment, Gelato Relay’s Status API shows your task ID and progress. You didn’t pay gas or sign an onchain tx — that’s a gasless transaction.

Behind the Scenes

The sendRelayRequest function in CounterApp.tsx instantiates the Gelato Relay SDK, builds a relay request, and submits it:

const relay = new GelatoRelay();
const provider = new ethers.providers.Web3Provider(window.ethereum);
const signer = provider.getSigner();
const contract = new ethers.Contract(target, counterABI.abi, signer);

const { data } = await contract.populateTransaction.increment();

const request: CallWithSyncFeeRequest = {
  chainId,
  target,
  data,
  feeToken,
  isRelayContext: true,
};

const relayResponse = await relay.callWithSyncFee(request);

The ABI builds the payload, which tells Relay what contract function to call. Thirdweb’s useChainId() hook fetches the chain ID.

Sponsor Transactions using 1Balance

To sponsor fees for users across all networks:

1. Log in to relay.gelato.cloud and connect your wallet.

2. Deposit USDC into 1Balance (Polygon) to cover gas for all transactions across networks.

3. Optionally use testnets (Goerli, Optimism Goerli, etc.) for trial runs.

Register your contract (or toggle “Any Contract”). Create your app to get an API key. Use it in your code:

const request: SponsoredCallRequest = { chainId, target, data };
const relayResponse = await relay.sponsoredCall(request, apiKey);

Security note: Don’t expose your API key in frontend code. Use a backend proxy to keep it secret.

How to Build Your dApp

The repo includes GaslessNFTApp.tsx. Enable it in AppContainer.tsx:

import CounterApp from "./apps/CounterApp";
// import GaslessNFTApp from "./apps/GaslessNFTApp";

const AppContainer = () => (
  <div>
    <CounterApp />
    { /* <GaslessNFTApp /> */ }
  </div>
);

export default AppContainer;

Uncomment the import and component, then restart your dev server. The new app will appear at localhost:3000.

Deploy your contract with Thirdweb

Use Thirdweb’s dashboard to deploy the NFTDrop contract. Set free/unlimited claim conditions for demo purposes. Paste your contract address into GaslessNFTApp.tsx:

const target = "PASTE_CONTRACT_ADDRESS_HERE";

Thirdweb’s hooks like useContract() and useNFTs() simplify ABI management and queries:

const { contract } = useContract(target, "nft-drop");
const { data: nfts } = useNFTs(contract, { start: 0, count: 20 });

Paste your 1Balance sponsor API key:

const sponsorAPIkey = "PASTE_SPONSOR_API_KEY_HERE";

Now, when you click “Claim NFT”, Gelato Relay handles the transaction gaslessly.

Conclusion

With Gelato Relay + 1Balance, you can build dApps that sponsor gas for users, creating smooth onboarding. CounterApp shows gasless state updates, while GaslessNFTApp demonstrates gasless NFT minting. Thirdweb’s React SDK simplifies wallet integration and contract queries.

About Gelato

Gelato is Web3’s decentralized backend, empowering builders to create augmented smart contracts that are automated, gasless, and off-chain aware across Ethereum, Arbitrum, Polygon, Optimism, zkSync, and more. 400+ Web3 projects rely on Gelato to power millions of DeFi, NFT, and gaming transactions.

Core Services:

• Web3 Functions: Connect contracts to off-chain data & computation via decentralized cloud functions.

• Automate: Execute smart contracts automatically in a reliable, decentralized way.

• Relay: Provide users with reliable, scalable gasless transactions via API.

• Account Abstraction SDK: Built with Safe, combining Gelato’s gasless infra with secure smart contract wallets.

Subscribe to our newsletter and follow Gelato on Twitter for updates.
Want to join the Gelato team? Explore open positions and apply here.