1. Create a new project

Create a new React or React Native project using the thirdweb CLI.

npx thirdweb create app --legacy-peer-deps

Select your preferences when prompted by the CLI, or use the recommended setup below.

Change directory into the newly created project:

cd my-abstract-app

(Replace my-abstract-app with your created project name.)

2. Set up a Thirdweb API key

On the thirdweb dashboard, create your account (or sign in), and go to the API keys page.

Create a new API key with localhost included in the allowed domains, then copy your client ID.

Create a .env file and add your client ID as an environment variable:

NEXT_PUBLIC_TEMPLATE_CLIENT_ID=your-client-id-here

Start the development server and navigate to http://localhost:3000 in your browser to view the application.

npm run dev

3. Connect the app to Abstract

Import abstractTestnet from the thirdweb/chains package:

import { abstractTestnet } from "thirdweb/chains";

Use the abstractTestnet import as the value for the chain property wherever required.

<ConnectButton client={client} chain={abstractTestnet} />

Learn more on the official thirdweb documentation.