Get Started

The quickest way to setup Bridge in your React app is with the SwapWidget component.

Install the thirdweb SDK in your React project:

First, create a client file for reuse throughout your app:

// thirdwebClient.ts
import { createThirdwebClient } from "thirdweb";
 
export const client = createThirdwebClient({
  clientId: "YOUR_CLIENT_ID", // Get from your thirdweb dashboard
});

Wrap your application with the ThirdwebProvider

// app.tsx / _app.tsx
import { ThirdwebProvider } from "thirdweb/react";
 
function App() {
  return (
    <ThirdwebProvider>
      <YourApp />
    </ThirdwebProvider>
  );
}

Use the SwapWidget to let users swap tokens

import { SwapWidget } from "thirdweb/react";
 
function Example() {
  return <SwapWidget client={client} />;
}