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

# Dynamic

> Use a Dynamic embedded wallet as the owner of a Rhinestone smart account.

Dynamic supplies authentication, wallet connections, and a wagmi-compatible wallet client. Convert the connected client to a viem account before passing it to Rhinestone.

## Prerequisites

* A Dynamic project and environment ID
* A React application
* A backend that issues short-lived Rhinestone JWTs

<Steps>
  <Step title="Install the dependencies">
    ```bash theme={null}
    npm install @dynamic-labs/sdk-react-core @dynamic-labs/ethereum @dynamic-labs/wagmi-connector @tanstack/react-query @rhinestone/sdk viem wagmi@2
    ```
  </Step>

  <Step title="Configure Dynamic and wagmi">
    ```tsx theme={null}
    'use client'

    import { DynamicContextProvider } from '@dynamic-labs/sdk-react-core'
    import { EthereumWalletConnectors } from '@dynamic-labs/ethereum'
    import { DynamicWagmiConnector } from '@dynamic-labs/wagmi-connector'
    import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
    import { createConfig, WagmiProvider } from 'wagmi'
    import { http } from 'viem'
    import { arbitrum, base } from 'viem/chains'

    const queryClient = new QueryClient()
    const wagmiConfig = createConfig({
      chains: [arbitrum, base],
      multiInjectedProviderDiscovery: false,
      transports: {
        [arbitrum.id]: http(),
        [base.id]: http(),
      },
    })

    export function Providers({ children }: { children: React.ReactNode }) {
      return (
        <DynamicContextProvider
          settings={{
            environmentId: process.env.NEXT_PUBLIC_DYNAMIC_ENVIRONMENT_ID!,
            walletConnectors: [EthereumWalletConnectors],
          }}
        >
          <WagmiProvider config={wagmiConfig}>
            <QueryClientProvider client={queryClient}>
              <DynamicWagmiConnector>{children}</DynamicWagmiConnector>
            </QueryClientProvider>
          </WagmiProvider>
        </DynamicContextProvider>
      )
    }
    ```
  </Step>

  <Step title="Configure browser authentication">
    Keep the Rhinestone API key on your server. Configure a browser SDK instance with short-lived JWTs instead:

    ```ts theme={null}
    import { RhinestoneSDK } from '@rhinestone/sdk'

    export const rhinestone = new RhinestoneSDK({
      auth: {
        mode: 'experimental_jwt',
        accessToken: async () => {
          const response = await fetch('/api/auth/access-token', {
            credentials: 'include',
          })
          if (!response.ok) throw new Error('Unable to authenticate with Rhinestone')
          return ((await response.json()) as { token: string }).token
        },
      },
    })
    ```

    See [security](/wallets/custom-signer/integration/security) for backend setup and sponsored-intent extension tokens.
  </Step>

  <Step title="Create the Rhinestone account">
    Dynamic populates wagmi after the user connects. Wait for `useWalletClient` to return a client with an active account.

    ```tsx theme={null}
    import { useDynamicContext } from '@dynamic-labs/sdk-react-core'
    import { useWalletClient } from 'wagmi'
    import { walletClientToAccount } from '@rhinestone/sdk/utils'
    import { rhinestone } from './rhinestone'

    export function ConnectRhinestoneButton() {
      const { setShowAuthFlow } = useDynamicContext()
      const { data: walletClient } = useWalletClient()

      async function connect() {
        if (!walletClient) {
          setShowAuthFlow(true)
          return
        }

        const owner = walletClientToAccount(walletClient)
        const account = await rhinestone.createAccount({
          owners: { type: 'ecdsa', accounts: [owner] },
        })

        console.log(account.getAddress())
      }

      return <button onClick={connect}>Connect with Dynamic</button>
    }
    ```

    You can also call `primaryWallet.getWalletClient()` when your integration already uses Dynamic's wallet object directly.
  </Step>
</Steps>

For sponsored transactions, follow [sponsorship setup](/transactions/sponsorship/set-up). For the transaction lifecycle, continue to [send a transaction](/transactions/multichain/send-a-transaction).

See the [Dynamic documentation](https://docs.dynamic.xyz/) for authentication and wallet configuration.
