# @faustine-ai/web-agent

`@faustine-ai/web-agent` is the npm loader for a Web Agent. Your app imports it, calls `init` with the agent's ID, and the widget mounts on the page.

| | |
| --- | --- |
| Version | 0.2.5 |
| Size | About 9 KB gzipped |
| License | MIT |
| npm | [@faustine-ai/web-agent](https://www.npmjs.com/package/@faustine-ai/web-agent) |

## How it works

The package is a loader. It does not contain the widget or your agent's actions. Both are fetched from Faustine when the page loads, so the page runs the version that is deployed to the environment at that moment. Publishing, deploying or rolling back a version in the portal reaches your users without a new build of your app.

The package is safe to import in code that also runs on a server. Outside a browser, importing it does nothing and `init` returns a handle whose methods do nothing.

A page holds one agent. A second `init` with another ID logs a warning and returns the first instance.

## Install

**npm**

```bash
npm install @faustine-ai/web-agent
```

**pnpm**

```bash
pnpm add @faustine-ai/web-agent
```

**yarn**

```bash
yarn add @faustine-ai/web-agent
```

**bun**

```bash
bun add @faustine-ai/web-agent
```

```ts filename="src/faustine.ts"
import Faustine from '@faustine-ai/web-agent';

export const agent = Faustine.init({
  agentId: '<AGENT_ID>',
});
```

`<AGENT_ID>` is in the **Install the assistant** card of the agent's **Overview** tab. For every option and method, see the [JavaScript API](https://docs.faustine.ai/reference/javascript-api/).

## When to use it

Use the package when your app has a bundler and you want types, or when you decide in code when the agent starts, for example after sign-in. An app with no build step loads the same code from a script tag. See [Installation](https://docs.faustine.ai/web-agents/installation/) for the install modes.

In a Next.js app, install [@faustine-ai/next](https://docs.faustine.ai/packages/next/) as well. Its component calls this package for you.

## Next steps

- [React quickstart](https://docs.faustine.ai/technologies/react/): start the agent and identify the user in a React app.
- [Install from npm](https://docs.faustine.ai/web-agents/npm/): the steps for any app with a bundler.
- [JavaScript API](https://docs.faustine.ai/reference/javascript-api/): `init`, `identify`, `logout` and the panel controls.
- [Verify your users with a signed token](https://docs.faustine.ai/web-agents/verify-users/): pass a token your backend signs.