# Quickstart

> Install sideagent, mount the agent on one route and render the chat in React.

Source: https://sideagent.dev/docs/quickstart

Install the package:

```bash
npm i sideagent
```

Create the agent on your server and mount its handler on one route:

```ts
import { createAgent, honoHandler } from "sideagent/server";

const agent = await createAgent({
  spec: "https://api.example.com/openapi.json",
  baseUrl: "https://api.example.com",
  llm: { baseUrl: "https://api.openai.com/v1", apiKey: process.env.LLM_API_KEY!, model: "gpt-4o-mini" },
  allow: ["listInvoices", "createInvoice"],
  allowedOrigins: ["https://app.example.com"],
  getAuth: (req) => ({
    userId: "user-123",
    headers: { authorization: req.headers.get("authorization")! },
  }),
});

app.on(["POST", "OPTIONS"], "/agent", honoHandler(agent));
```

Render the chat in your React app:

```tsx
import { AgentChat } from "sideagent";

<AgentChat endpoint="/agent" mode="floating" />
```

## Try it without an API key

Clone the repo and run `pnpm demo`. It starts a fake invoices API, an agent with a mock LLM, and the UI.

## Next steps

- Tune the options: [Server](https://sideagent.dev/docs/server.md).
- Choose what the model may call: [Operations and allowlist](https://sideagent.dev/docs/operations.md).
- Replace the hard-coded `userId`: [User authentication](https://sideagent.dev/docs/auth.md).
- Skip the server: [sideagent Cloud](https://sideagent.dev/docs/cloud.md).