# Authentication quickstart

> Get started with the authentication provider

> For the complete documentation index, see [llms.txt](/docs/llms.txt).

<Tip>
  Using React? Follow [this](/docs/wallets/react/quickstart) quickstart guide instead
  for easy-to-use React hooks and integration with Wallet APIs.
</Tip>

If you're not using React, use the `@account-kit/signer` package to create and use Wallet APIs.

## Get your API key and create an account config

1. Get your **API key** by creating a new app in your [dashboard](https://dashboard.alchemy.com/apps)
   <Warning>
     Make sure **your desired network** is enabled for your app under the
     Networks tab.
   </Warning>

2. Activate **smart wallets** for your app in your [dashboard](https://dashboard.alchemy.com/apps/latest/services/smart-wallets)

   1. Apply the config to your app from step 1

      <img src="https://alchemyapi-res.cloudinary.com/image/upload/v1764187298/docs/aa-sdk/images/getting-started/apply-config-to-app.png" alt="apply the config to the app from the first step" style={{ width: "50%" }} />

   2. Enable authentication methods you want to support.

      <br />

      <u>**Email auth**</u>

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

      * For testing, use [http://localhost:3000](http://localhost:3000/)
        as the **Redirect URL** (Note **http** not https)
      * The **Redirect URL** is where redirection occurs when using the magic link email flow
      * Optionally stylize the email with your brand color and logo.

      <img src="https://alchemyapi-res.cloudinary.com/image/upload/v1764187299/docs/aa-sdk/images/getting-started/email-auth-setup.png" alt="configure email auth" style={{ width: "50%" }} />

      <br />

      <u>**Social auth**</u>

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

      * For testing, add [http://localhost:3000](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 the defaults

        <img src="https://alchemyapi-res.cloudinary.com/image/upload/v1764187309/docs/aa-sdk/images/getting-started/social-auth-setup.png" alt="configure social auth" style={{ width: "50%" }} />

3. Create the config and copy the **API key**
   <img src="https://alchemyapi-res.cloudinary.com/image/upload/v1764187307/docs/aa-sdk/images/getting-started/get-api-key.png" alt="how to copy the api key" style={{ width: "50%" }} />


## Install the authentication package

**Prerequisites**

* minimum Typescript version of 5

**Installation**

<CodeBlocks>
  ```bash yarn
  yarn add @account-kit/signer
  ```

  ```bash npm
  yarn add @account-kit/signer
  ```
</CodeBlocks>

## Create an authentication provider instance

```ts signer.ts
import { AlchemyWebSigner } from "@account-kit/signer";

export const signer = new AlchemyWebSigner({
  client: {
    connection: {
      apiKey: "API_KEY",
    },
    iframeConfig: {
      iframeContainerId: "alchemy-signer-iframe-container",
    },
  },
});
```


## Authenticate a user

Next, authenticate your user before you can use it as an owner on the account.

<Tip>
  In this example, email auth is used, but a number of other auth
  methods are supported. See the other guides for more examples.
</Tip>

<CodeBlocks>
  ```ts example.ts
  import { signer } from "./signer";

  const result = await signer.authenticate({
    type: "email",
    email: "example@mail.com",
  });
  ```

  ```ts signer.ts
import { AlchemyWebSigner } from "@account-kit/signer";

export const signer = new AlchemyWebSigner({
  client: {
    connection: {
      apiKey: "API_KEY",
    },
    iframeConfig: {
      iframeContainerId: "alchemy-signer-iframe-container",
    },
  },
});
```

</CodeBlocks>

## Use as owner on smart wallet

Now that you have authenticated your user, use the authentication provider as an owner on a smart wallet.

<CodeBlocks>
  ```ts example.ts
  import { createLightAccount } from "@account-kit/smart-contracts";
  import { sepolia } from "@account-kit/infra";
  import { http } from "viem";
  import { signer } from "./signer";

  const account = await createLightAccount({
    signer,
    chain: sepolia,
    transport: http(`${sepolia.rpcUrls.alchemy.http[0]}/API_KEY`),
  });
  ```

  ```ts signer.ts
import { AlchemyWebSigner } from "@account-kit/signer";

export const signer = new AlchemyWebSigner({
  client: {
    connection: {
      apiKey: "API_KEY",
    },
    iframeConfig: {
      iframeContainerId: "alchemy-signer-iframe-container",
    },
  },
});
```

</CodeBlocks>