Skip to content
Docs
/
Getting Started

Getting Started

Installation

Install wagmi and its ethers peer dependency.

npm install wagmi ethers

Quick Start

First, create a wagmi Client instance using createClient.

import { createClient } from 'wagmi'

const client = createClient()
💡

You can pass a configuration object to createClient to customize the Client's properties. Properties, like auto-connect, wallet connectors, ethers provider, and more, are all configurable.

Next, wrap your app with the WagmiProvider component, passing client to it.

import { WagmiProvider, createClient } from 'wagmi'

const client = createClient()

function App() {
  return (
    <WagmiProvider client={client}>
      <YourRoutes />
    </WagmiProvider>
  )
}

Finally, use hooks! Every component inside the WagmiProvider is now set up to use the wagmi hooks.

import { useAccount, useConnect, useEnsName } from 'wagmi'
import { InjectedConnector } from 'wagmi/connectors/injected'

function Profile() {
  const { data: account } = useAccount()
  const { data: ensName } = useEnsName({ address: account.address })
  const { connect } = useConnect({
    connector: new InjectedConnector(),
  })

  if (account) return <div>Connected to {ensName ?? account.address}</div>
  return <button onClick={() => connect()}>Connect Wallet</button>
}

Want to learn more? Check out the examples to learn how to use wagmi in real-world scenarios or continue on reading the documentation.