> ## Documentation Index
> Fetch the complete documentation index at: https://docs.anotherwrapper.com/llms.txt
> Use this file to discover all available pages before exploring further.

# OpenAI

> Set up OpenAI & understand how it's used throughout the app

OpenAI is the Swiss Army knife of this codebase -- it powers chat, image generation, document embeddings, audio summaries, and several structured-output apps. If you're only going to set up one provider first, this is still the smoothest default.

## Get your API key

<Steps>
  <Step title="Create or sign into your OpenAI account">
    Head to [platform.openai.com](https://platform.openai.com/signup) and sign up or log in.
  </Step>

  <Step title="Generate a secret key">
    Go to the [API keys page](https://platform.openai.com/account/api-keys) and click **Create new secret key**. Give it a name you'll recognize.
  </Step>

  <Step title="Add it to your env">
    Paste the key in your `.env.local` file:

    ```env theme={null}
    OPENAI_API_KEY=your_openai_api_key
    ```
  </Step>
</Steps>

<Warning>
  Save your API key somewhere safe right away -- OpenAI only shows it once. If you lose it, you'll need to create a new one.
</Warning>

## Available models

All models are defined in the unified model registry at `lib/ai/models.ts`. Every OpenAI model supports vision and internet access.

| Model      | ID           | Features                    |
| ---------- | ------------ | --------------------------- |
| GPT-5      | `gpt-5`      | Vision, Internet            |
| GPT-5 Mini | `gpt-5-mini` | Vision, Internet            |
| GPT-5 Nano | `gpt-5-nano` | Vision, Internet            |
| GPT-4o     | `gpt-4o`     | Vision, Internet            |
| o3         | `o3`         | Vision, Internet, Reasoning |

Here's the shape used in the shared registry:

```typescript theme={null}
{
  "gpt-5": {
    name: "GPT-5",
    provider: "openai",
    vision: true,
    hasInternet: true,
  }
}
```

## Apps using OpenAI

OpenAI shows up through two paths in this repo: shared text/vision models go through the Vercel AI SDK and `lib/ai/ai-utils.ts`, while Image Studio uses the direct OpenAI image API.

<CardGroup cols={2}>
  <Card title="Chat" icon="comments" href="/apps/chat">
    Multi-provider chat app -- OpenAI is a primary LLM provider
  </Card>

  <Card title="Image Studio" icon="image-landscape" href="/apps/image-studio">
    Generate images using the GPT-Image model
  </Card>

  <Card title="Audio" icon="file-audio" href="/apps/audio">
    Record audio and summarize transcriptions using GPT-5 Mini
  </Card>

  <Card title="Vector RAG" icon="database" href="/services/vector-rag">
    OpenAI embeddings power the PDF/document workflow
  </Card>

  <Card title="Marketing Plan" icon="chart-line" href="/apps/marketing-plan">
    Generate structured marketing plans
  </Card>

  <Card title="Launch Simulator" icon="sparkles" href="/apps/launch-simulator">
    Generate Product Hunt launch simulations
  </Card>
</CardGroup>

## How it works

The codebase uses Vercel AI SDK 6.0 with a unified model registry -- no direct OpenAI API calls for chat-based interactions.

Here's the typical flow for an AI request:

1. You select a model from the unified registry
2. The request goes through `getModelInstance()` in `lib/ai/ai-utils.ts`
3. The provider is determined via `getProviderFromModelId()`
4. The model is instantiated with `customModel()`
5. The response is streamed back to you
6. Results are stored in PostgreSQL

<Card title="Structure" icon="folder" href="/setup/structure">
  Understand the full project structure of the codebase.
</Card>
