Abstract Global Wallet with WalletConnect

This example showcases how to use the Abstract Global Wallet react SDK with WalletConnect inside a Next.js application.

Local Development

1. Follow the Reown installation instructions to configure your Reown project and get a Reown APP ID.

2. Add your Reown APP ID to the .env.local file:

   # .env.local
   NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID=your-reown-app-id

3. Get a copy of the agw-walletconnect-nextjs example directory from the Abstract Examples repository:

   mkdir -p agw-walletconnect-nextjs && curl -L https://codeload.github.com/Abstract-Foundation/examples/tar.gz/main | tar -xz --strip=2 -C agw-walletconnect-nextjs examples-main/agw-walletconnect-nextjs && cd agw-walletconnect-nextjs

4. Install dependencies

   pnpm install

5. Run the development server

   pnpm run dev

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

How It Works

This example demonstrates how to:

• Connect to Abstract Global Wallet via WalletConnect
• Approve transactions from within the Abstract Portal
• Configure Abstract or Abstract Testnet as the chain in your AppKit configuration

Useful Links

• Docs
• Official Site
• GitHub
• X
• Discord