Signer Quickstart

If you’re not using React, use the @account-kit/signer package to create and use Smart Wallets.

Get your API key and create an account config

1. Get your API key by creating a new app in your Alchemy Dashboard

   Make sure Ethereum is enabled for your app under the Networks tab

2. Create a new account config in your Account Kit Dashboard

   1. Apply the config to your app from step 1

      

   2. Enable authentication methods you want to support.

      
      Email auth

      If you want to use email auth, toggle on email.

      • For testing, use http://localhost:3000 as the Redirect URL (Note http not https)
      • The user will be redirected to the Redirect URL if you use the magic link email flow
      • Optionally stylize ✨ the email with your brand color and logo!
      
      Social auth

      If you want to enable social login, toggle which auth providers you want to support.

      • For testing, add http://localhost:3000 as a whitelisted origin

      • Add the link that your dapp will be running on to the whitelisted origin list

      • Optionally enter your own OAuth credentials or use our defaults

        

3. Create the config and copy the API Key

   

Install the Signer package

Prerequisites

• minimum Typescript version of 5
• pin viem to 2.20.0 (yarn add [email protected])

Installation

$
yarn add @account-kit/signer

Create a signer instance

1
import { AlchemyWebSigner } from "@account-kit/signer";
2
3
export const signer = new AlchemyWebSigner({
4
  client: {
5
    connection: {
6
      apiKey: "API_KEY",
7
    },
8
    iframeConfig: {
9
      iframeContainerId: "alchemy-signer-iframe-container",
10
    },
11
  },
12
});

Authenticate a user

Next, you’ll need to authenticate your user before you can use the Signer as an owner on the account.

1
import { signer } from "./signer";
2
3
const result = await signer.authenticate({
4
  type: "email",
5
  email: "[email protected]",
6
});

Use signer as owner on Smart Account

Now that you have authenticated your user, you can use the signer as an owner on a Smart Contract Account.

1
import { createLightAccount } from "@account-kit/smart-contracts";
2
import { sepolia } from "@account-kit/infra";
3
import { http } from "viem";
4
import { signer } from "./signer";
5
6
const account = await createLightAccount({
7
  signer,
8
  chain: sepolia,
9
  transport: http(`${sepolia.rpcUrls.alchemy.http[0]}/API_KEY`),
10
});