Skip to content

Latest commit

 

History

History
81 lines (58 loc) · 1.91 KB

File metadata and controls

81 lines (58 loc) · 1.91 KB

Wallet Connect Kit

Open-source Next.js starter for Ethereum wallet connections — built with wagmi, viem, and WalletConnect.

From SolveMotive.

Features

  • Injected wallets, MetaMask, and WalletConnect (QR / mobile)
  • Chains: Ethereum Mainnet, Base, Sepolia
  • App Router + SSR-safe session via cookie storage
  • Balance display and chain switching
  • Clean UI you can fork into client dApps

Stack

Layer Choice
Framework Next.js (App Router)
Wallet wagmi + viem
Mobile / QR WalletConnect (Reown Cloud)
Styling Tailwind CSS

Getting started

Prerequisites

  • Node.js 20+
  • npm
  • A free WalletConnect Project ID from cloud.reown.com (optional for injected/MetaMask only)

Setup

git clone https://github.com/solvemotive/wallet-connect-kit.git
cd wallet-connect-kit
cp .env.example .env.local
npm install
npm run dev

Open http://localhost:3000.

Environment

Variable Required Description
NEXT_PUBLIC_WALLETCONNECT_PROJECT_ID for WalletConnect Project ID from Reown Cloud

Without a Project ID, injected and MetaMask connectors still work.

Scripts

Command Purpose
npm run dev Local development
npm run build Production build
npm run start Serve production build
npm run lint Lint

Project layout

src/
  app/                 # App Router pages
  components/
    providers.tsx      # Wagmi + React Query
    connect-wallet.tsx # Connect / disconnect UI
  lib/
    wagmi.ts           # Chains, connectors, transports

Notes

  • Use dedicated RPC URLs (Alchemy, Infura, etc.) before production traffic
  • Never commit private keys or secret RPC tokens
  • This kit is frontend-only; it does not custody funds

License

MIT © SolveMotive