evm-wallet-integration_skill

Overview

This skill shows how to integrate wallet connection libraries into Celo dApps, covering Reown AppKit (formerly WalletConnect), Dynamic, and custom wagmi setups. It focuses on practical configuration, provider setup, and UI patterns for connect buttons and account states. The goal is to help developers add robust wallet flows and support multiple Celo networks quickly.

How this skill works

The skill walks through installing adapters and SDKs, obtaining required project IDs, and wiring providers into React apps. It demonstrates using Reown AppKit for a turnkey wallet UI, Dynamic for authentication and user management, and a custom wagmi approach for fine-grained connector control. Examples include provider configuration, connect buttons, and using wagmi hooks for account and balance information.

When to use it

• Adding wallet connection and authentication to a Celo dApp
• Supporting multiple wallet types and mobile wallets
• Needing a production-ready UI with minimal custom code (use Reown AppKit)
• Building user management and auth flows with built-in dashboard (use Dynamic)
• Requiring full control over connectors and transports (use custom wagmi)

Best practices

• Support multiple connectors (injected, WalletConnect, MetaMask) to maximize user reach
• Prompt and guide users to switch to the correct Celo network when needed
• Expose clear connection state and actions (connect, disconnect, account view)
• Store required project IDs in environment variables and never hard-code them
• Test wallet flows on desktop and mobile, including deep links and wallet apps

Example use cases

• A Celo marketplace using Reown AppKit to provide a polished connect modal and wide wallet compatibility
• A subscription app using Dynamic to manage user profiles, sessions, and authentication
• A custom DeFi dashboard using wagmi directly to configure specific connectors and transports
• A mobile-first dApp verifying balances and handling WalletConnect sessions across devices