This tutorial guides you through using Dynamic as a signer for Circle Smart Accounts. You can refer to this doc to learn more about Circle’s Modular Wallets offering.
Register a Circle Developer account. In the Configurator section of the Circle Developer Console under Modular Wallets, grab your Client URL, and create a new Client Key.
Register a Dynamic account. Grab your environment ID from the SDK & API keys page of the Dynamic Dashboard.
In the Chains and Networks page of the Dynamic Dashboard, enable the EVM network(s) you want to use with Circle. In this example we use Polygon Amoy, so please make sure that’s enabled.
For this guide, we’ll be using React and typescript, but this can easily be adapted to other frameworks. If you don’t already have an app created, check out our Quickstart guide or Create dynamic app.
.env
file in the project directory and add the following environment variables:Note: If you’re using Next.js, replace REACT_APP_
with NEXT_PUBLIC_
and for Vite, use VITE_
.
In src/App.js
, replace the value for the environmentId
with your own Dynamic environment ID.
Navigate to src/Main.js
, and replace the current contents with the following:
Check out the UI; once you sign up/login, you should see the following:
Problem: Execution reverted for an unknown reason
Solution: This is most likely due to the account not having enough ETH to pay for the transfer, make sure your smart wallet is funded!
This tutorial guides you through using Dynamic as a signer for Circle Smart Accounts. You can refer to this doc to learn more about Circle’s Modular Wallets offering.
Register a Circle Developer account. In the Configurator section of the Circle Developer Console under Modular Wallets, grab your Client URL, and create a new Client Key.
Register a Dynamic account. Grab your environment ID from the SDK & API keys page of the Dynamic Dashboard.
In the Chains and Networks page of the Dynamic Dashboard, enable the EVM network(s) you want to use with Circle. In this example we use Polygon Amoy, so please make sure that’s enabled.
For this guide, we’ll be using React and typescript, but this can easily be adapted to other frameworks. If you don’t already have an app created, check out our Quickstart guide or Create dynamic app.
.env
file in the project directory and add the following environment variables:Note: If you’re using Next.js, replace REACT_APP_
with NEXT_PUBLIC_
and for Vite, use VITE_
.
In src/App.js
, replace the value for the environmentId
with your own Dynamic environment ID.
Navigate to src/Main.js
, and replace the current contents with the following:
Check out the UI; once you sign up/login, you should see the following:
Problem: Execution reverted for an unknown reason
Solution: This is most likely due to the account not having enough ETH to pay for the transfer, make sure your smart wallet is funded!