Configuración de la cartera

Configurar tu cartera para interactuar con tu appchain es fácil. La forma más sencilla es usar el explorador de bloques de tu appchain, que proporciona una opción de un solo clic para añadir la red a MetaMask o cualquier cartera compatible con EVM.

Añade tu Appchain a MetaMask u otras carteras

1. Visita el explorador de bloques de tu appchain (por ejemplo, https://explorer.your-appchain.syndicate.io).
2. Conecta tu cartera.
3. Haz clic en el botón "Añadir a MetaMask" o "Añadir red".
4. Aprueba la adición de la red en tu cartera.
5. Cambia entre redes en MetaMask haciendo clic en el menú desplegable de redes en la parte superior de la cartera. MetaMask utilizará automáticamente el RPC correcto, el ID de cadena y el símbolo de moneda para la red seleccionada.
6. Puedes ver y gestionar tus redes en la configuración de MetaMask bajo "Redes".

Para más información sobre la configuración de redes en MetaMask, consulta la Guía de configuración de redes de MetaMask.

Diseña la experiencia de usuario de la cartera para el usuario final

1. Utiliza las carteras existentes de los usuarios (WalletConnect, carteras inyectadas como MetaMask, extensión de Coinbase Wallet)
2. Abstrae completamente las carteras de los usuarios utilizando un proveedor de cartera integrado (por ejemplo, Para), como hacemos en la aplicación de ejemplo

1. Conecta carteras existentes

A continuación se muestra una configuración mínima utilizando wagmi con WalletConnect y carteras inyectadas. Reemplaza rpcUrl, chainId y currency con los valores de tu appchain.

const appchain = {
  id: 12345, // your appchain id
  name: "Your Appchain",
  nativeCurrency: { name: "Token", symbol: "TOK", decimals: 18 },
  rpcUrls: { default: { http: ["https://rpc.your-appchain.syndicate.io"] } },
};

const wagmiConfig = createConfig({
  chains: [appchain],
  transports: { [appchain.id]: http("https://rpc.your-appchain.syndicate.io") },
  connectors: [
    injected({ shimDisconnect: true }),
    walletConnect({ projectId: "YOUR_WC_PROJECT_ID" }),
  ],
  ssr: true,
});

2. Carteras integradas

Si prefieres una incorporación fluida sin extensiones, utiliza carteras integradas (por ejemplo, Para). Así es como la aplicación de ejemplo (Adrift) incorpora a los usuarios.

const appchain = {
  id: 12345, // your appchain id
  name: 'Your Appchain',
  nativeCurrency: { name: 'Token', symbol: 'TOK', decimals: 18 },
  rpcUrls: { default: { http: ['https://rpc.your-appchain.syndicate.io'] } },
}

<ParaProviderBase
  config={{ appName: 'Your App' }}
  externalWalletConfig={{
    wallets: [],
    evmConnector: { config: { chains: [appchain], ssr: true } },
  }}
  paraClientConfig={{ apiKey: process.env.NEXT_PUBLIC_PARA_API_KEY, env: 'production' }}
>
  {children}
</ParaProviderBase>

Una vez conectado, utiliza los clientes viem de Para para firmar y enviar transacciones a tu appchain.

Consulta una guía completa en la guía de la aplicación de ejemplo: Configuración de la cartera (aplicación de ejemplo)