> For the complete documentation index, see [llms.txt](/llms.txt).

Heads up

You've landed on a guide that still uses the MetaMask legacy SDK (`@metamask/sdk`). The MetaMask Connect integration for this library is coming soon. Once ready, it will be linked from the sidebar navigation. In the meantime, this guide is still valid if you're using MetaMask SDK.

# Connect to Solana using Dynamic SDK

This quickstart gets you up and running with MetaMask SDK inside [Dynamic SDK](https://docs.dynamic.xyz/introduction/welcome). Dynamic handles wallet discovery and connection UI, and MetaMask SDK adds reliable cross-platform support for MetaMask. [Download the template](#set-up-using-a-template) to start quickly, or [set up manually](#set-up-manually) in an existing project.

## Prerequisites[​](#prerequisites "Direct link to Prerequisites")

- [Node.js](https://nodejs.org/) version 19 or later installed.
- A package manager installed, such as [npm](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm), [Yarn](https://yarnpkg.com/), [pnpm](https://pnpm.io/installation), or [bun](https://bun.sh/).
- [MetaMask](https://metamask.io/) installed in your browser or on mobile.
- A [Dynamic Environment ID](https://app.dynamic.xyz/).

## Set up using a template[​](#set-up-using-a-template "Direct link to Set up using a template")

1. Download the [MetaMask SDK + Dynamic SDK template](https://github.com/MetaMask/metamask-sdk-examples/tree/main/partners/dynamic):  
```  
npx degit MetaMask/metamask-sdk-examples/partners/dynamic metamask-dynamic  
```
2. Navigate into the repository:  
```  
cd metamask-dynamic  
```  
<details>  
<summary>Degit vs. Git clone</summary>  
`degit` is a tool that enables cloning only the directory structure from a GitHub repository, without retrieving the entire repository.  
Alternatively, use `git clone` to download the entire repository. Clone the MetaMask SDK examples repository and navigate into the `partners/dynamic` directory:  
```  
git clone https://github.com/MetaMask/metamask-sdk-examples  
cd metamask-sdk-examples/partners/dynamic  
```  
</details>
3. Install dependencies:  
```  
pnpm install  
```
4. Create a `.env.local` file:  
```  
touch .env.local  
```
5. In `.env.local`, add a `NEXT_PUBLIC_DYNAMIC_ENVIRONMENT_ID` environment variable, replacing `<YOUR-ENVIRONMENT-ID>` with your Dynamic Environment ID:  
.env.local  
```  
NEXT_PUBLIC_DYNAMIC_ENVIRONMENT_ID=<YOUR-ENVIRONMENT-ID>  
```
6. Run the project:  
```  
pnpm dev  
```

You've successfully set up MetaMask SDK and Dynamic SDK. See how to [use the combined SDKs](#usage).

## Set up manually[​](#set-up-manually "Direct link to Set up manually")

### 1. Install dependencies[​](#1-install-dependencies "Direct link to 1. Install dependencies")

Install Dynamic SDK with the Solana extension and Solana web3.js:

- npm
- Yarn
- pnpm
- Bun

```
npm install @dynamic-labs/client @dynamic-labs/solana-extension @solana/web3.js

```

```
yarn add @dynamic-labs/client @dynamic-labs/solana-extension @solana/web3.js

```

```
pnpm add @dynamic-labs/client @dynamic-labs/solana-extension @solana/web3.js

```

```
bun add @dynamic-labs/client @dynamic-labs/solana-extension @solana/web3.js

```

### 2. Create the Dynamic client[​](#2-create-the-dynamic-client "Direct link to 2. Create the Dynamic client")

Create a Dynamic client extended with Solana support in `lib/dynamic.ts`:

lib/dynamic.ts

```
import { createClient } from '@dynamic-labs/client'
import { SolanaExtension } from '@dynamic-labs/solana-extension'

export const dynamicClient = createClient({
  environmentId: process.env.NEXT_PUBLIC_DYNAMIC_ENVIRONMENT_ID!,
}).extend(SolanaExtension())

```

### 3. Set up environment variables[​](#3-set-up-environment-variables "Direct link to 3. Set up environment variables")

Create a `.env.local` file. In `.env.local`, add a `NEXT_PUBLIC_DYNAMIC_ENVIRONMENT_ID` environment variable, replacing `<YOUR-ENVIRONMENT-ID>` with your Dynamic Environment ID:

.env.local

```
NEXT_PUBLIC_DYNAMIC_ENVIRONMENT_ID=<YOUR-ENVIRONMENT-ID>

```

Test your dapp by running `pnpm run dev`.

## Usage[​](#usage "Direct link to Usage")

### Connect wallet[​](#connect-wallet "Direct link to Connect wallet")

Use the Dynamic Widget in your components:

```
"use client";

import { DynamicWidget } from "@dynamic-labs/sdk-react-core";

export const Navbar = () => {
  return (
    <nav>
      <DynamicWidget />
    </nav>
  );
};

```

### Check wallet status[​](#check-wallet-status "Direct link to Check wallet status")

Use the Dynamic client to check the primary wallet:

```
"use client";

import { dynamicClient } from '@/lib/dynamic'

export const WalletStatus = () => {
  const wallet = dynamicClient.wallets.primary

  return (
    <div>
      {wallet ? (
        <p>Connected: {wallet.address}</p>
      ) : (
        <p>Not connected</p>
      )}
    </div>
  );
};

```

### Send a SOL transfer[​](#send-a-sol-transfer "Direct link to Send a SOL transfer")

Use the Solana extension's `getConnection` and `getSigner` methods to build and send a transaction:

```
"use client";

import { dynamicClient } from '@/lib/dynamic'
import {
  LAMPORTS_PER_SOL,
  PublicKey,
  SystemProgram,
  TransactionMessage,
  VersionedTransaction,
} from '@solana/web3.js'

export const SendSol = () => {
  const send = async () => {
    const wallet = dynamicClient.wallets.primary
    if (!wallet) return

    const connection = dynamicClient.solana.getConnection({
      commitment: 'singleGossip',
    })
    const signer = dynamicClient.solana.getSigner({ wallet })

    const { blockhash } = await connection.getLatestBlockhash()
    const fromKey = new PublicKey(wallet.address)
    const toKey = new PublicKey('DESTINATION_PUBLIC_KEY')

    const instructions = [
      SystemProgram.transfer({
        fromPubkey: fromKey,
        toPubkey: toKey,
        lamports: 0.01 * LAMPORTS_PER_SOL,
      }),
    ]

    const messageV0 = new TransactionMessage({
      payerKey: fromKey,
      recentBlockhash: blockhash,
      instructions,
    }).compileToV0Message()

    const transaction = new VersionedTransaction(messageV0)
    const { signature } = await signer.signAndSendTransaction(transaction)
    console.log('Transaction signature:', signature)
  }

  return <button onClick={send}>Send 0.01 SOL</button>
};

```

## Production readiness[​](#production-readiness "Direct link to Production readiness")

Before deploying your project to production:

1. Update your `next.config.ts` with production domains.
2. Set up proper environment variables.
3. Configure your Dynamic SDK environment ID.
4. Ensure MetaMask SDK is properly initialized.

## Troubleshooting[​](#troubleshooting "Direct link to Troubleshooting")

Common issues and solutions include:

- **SDK initialization error:**  
  - Ensure MetaMask is installed.
  - Check environment variables.
  - Verify network connectivity.
- **TypeScript errors:**  
  - Update type definitions.
  - Check SDK versions compatibility.
- **Mobile experience issues:**  
  - Test on actual mobile devices.
  - Verify redirect URLs.
  - Check MetaMask mobile app installation.

## Live example[​](#live-example "Direct link to Live example")

## Next steps[​](#next-steps "Direct link to Next steps")

- [Send a legacy transaction](/metamask-connect/solana/guides/send-transactions/legacy/) to transfer SOL using MetaMask Connect.
- [Sign messages](/metamask-connect/solana/guides/sign-data/sign-message/) to verify wallet ownership or authorize offchain actions.
- [MetaMask Connect Solana methods](/metamask-connect/solana/reference/methods/) for the full API reference.