> ## Documentation Index
> Fetch the complete documentation index at: https://docs.abs.xyz/llms.txt
> Use this file to discover all available pages before exploring further.

# Thirdweb

> Learn how to use thirdweb to build applications on Abstract.

<Accordion title="Prerequisites">
  Ensure you have the following installed on your machine:

  * [Node.js](https://nodejs.org/en/download/) v18.0.0 or later.
</Accordion>

## 1. Create a new project

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

```bash theme={null}
npx thirdweb create app --legacy-peer-deps
```

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

<Accordion title="Recommended application setup">
  We recommend selecting the following options when prompted by the thirdweb CLI:

  ```bash theme={null}
  ✔ What type of project do you want to create? › App
  ✔ What is your project named? … my-abstract-app
  ✔ What framework do you want to use? › Next.js
  ```
</Accordion>

Change directory into the newly created project:

```bash theme={null}
cd my-abstract-app
```

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

## 2. Set up a Thirdweb API key

On the [thirdweb dashboard](https://thirdweb.com/dashboard), create your
account (or sign in), and copy your project’s **Client ID** from the
**Settings** section. Ensure that `localhost` is included in the allowed domains.

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

```bash theme={null}
NEXT_PUBLIC_TEMPLATE_CLIENT_ID=your-client-id-here
```

Start the development server and navigate to [`http://localhost:3000`](http://localhost:3000) in your browser to view the application.

```bash theme={null}
npm run dev
```

## 3. Connect the app to Abstract

Import the Abstract chain from the `thirdweb/chains` package:

<CodeGroup>
  ```javascript Testnet theme={null}
  import { abstractTestnet } from "thirdweb/chains";
  ```

  ```javascript Mainnet theme={null}
  import { abstract } from "thirdweb/chains";
  ```
</CodeGroup>

Use the Abstract chain import as the value for the `chain` property wherever required.

```javascript theme={null}
<ConnectButton client={client} chain={abstractTestnet} />
```

Learn more on the official [thirdweb documentation](https://portal.thirdweb.com/react/v5).