🤔 Got questions? Schedule an office hours session.
Node RPC
Dapp UI Libraries
Dynamic

Dynamic - Node RPC Integration

Dynamic is a platform that provides seamless authentication solutions for Web3 applications, offering smart login flows, easy onboarding processes, and developer tools for enhanced user experience and functionality.

Define EVM Networks

Create a list of networks configuration with Node RPC RPC.

tenderlyEvemNetworks.ts
export function tenderlyEvmNetworks(){
  // Setting up list of evmNetworks
  return [
    {
      blockExplorerUrls: ['https://etherscan.io/'],
      chainId: 1,
      chainName: 'Ethereum Mainnet',
      iconUrls: ['https://app.dynamic.xyz/images/networks/eth.svg'],
      name: 'Ethereum',
      nativeCurrency: {
        decimals: 18,
        name: 'Ether',
        symbol: 'ETH',
      },
      networkId: 1,
 
      rpcUrls: [`https://mainnet.gateway.tenderly.co/${process.env.NEXT_TENDERLY_ACCESS_KEY_MAINNET}`],
      vanityName: 'ETH Mainnet',
    },
  {
      blockExplorerUrls: ['https://basescan.org/'],
      chainId: 8453,
      chainName: 'Base',
      iconUrls: ['https://app.dynamic.xyz/images/networks/base.svg'],
      name: 'Base',
      nativeCurrency: {
        decimals: 18,
        name: 'Ether',
        symbol: 'ETH',
      },
      networkId: 8453,
      rpcUrls: [`https://base.gateway.tenderly.co/${process.env.NEXT_TENDERLY_ACCESS_KEY_BASE}`],
 
      vanityName: 'Base',
    },
    {
      blockExplorerUrls: ['https://polygonscan.com/'],
      chainId: 137,
      chainName: 'Matic Mainnet',
      iconUrls: ["https://app.dynamic.xyz/images/networks/polygon.svg"],
      name: 'Polygon',
      nativeCurrency: {
        decimals: 18,
        name: 'MATIC',
        symbol: 'MATIC',
      },
      networkId: 137,
      rpcUrls: [`https://mainnet.gateway.tenderly.co/${process.env.NEXT_TENDERLY_ACCESS_KEY_POLYGON}`],
      vanityName: 'Polygon',
    },
  ];
}

Configure Dynamic Context Provider

Configure a DynamicContextProvider with evmNetworks from step 1.

Web3Provider.tsx
import { EthereumWalletConnectors } from "@dynamic-labs/ethereum";
import { tenderlyEvmNetworks } from './tenderlyEvmNetworks.ts';
import { Home } from "./Home";
 
export const App = () => {
  return (
    <DynamicContextProvider
      settings={{
        // Find your environment id at https://app.dynamic.xyz/dashboard/developer
        environmentId: "REPLACE-WITH-YOUR-ENVIRONMENT-ID",
        walletConnectors: [EthereumWalletConnectors],
        evmNetworks: tenderlyEvmNetworks()
      }}
    >
      <Home />
    </DynamicContextProvider>
  );
};
Connect KitRainbowKit