# Astro
import { Step, Steps } from 'fumadocs-ui/components/steps';
import Link from 'fumadocs-core/link';
# Overview
Use Astro with React islands to render AskAI where you need it, without turning the whole site into React.
The API route lives in `src/pages/api/peam.ts`, keeping server logic clean and scoped.
You get fast pages with a focused, AI-ready experience.
## Install Dependencies
npm
pnpm
yarn
bun
```bash
npm install peam
```
```bash
pnpm add peam
```
```bash
yarn add peam
```
```bash
bun add peam
```
## Add AskAI in the Base Layout
```astro
---
import { AskAI } from 'peam/client';
import '../styles/global.css';
interface Props {
title: string;
description?: string;
}
const { title, description } = Astro.props as Props;
---
```
## Add the API Route
Create `src/pages/api/peam.ts` and add:
```ts
// [!code highlight]
export { POST } from 'peam/server';
export const prerender = false;
```
## Export the OpenAI API Key
Peam uses ChatGPT (OpenAI GPT-4o) by default, so `OPENAI_API_KEY` must be set in your environment.
```bash
export OPENAI_API_KEY="your-api-key"
```
## Examples
Browse the full app in:
*
examples/astro-react
See the [API Reference](/docs/api-reference) for all available options.
## Customize the model
Define your own handler and pass a model to `createChat`. Peam uses the Vercel AI SDK, so import models from the provider package you choose. See the providers and models guide.
```ts
import { createChat } from 'peam/server';
import { openai } from '@ai-sdk/openai';
export const POST = createChat({
model: openai('gpt-4o-mini'),
}).handler;
```
## Sitemap
[Overview of all docs pages](/sitemap.md)