Guides/Advanced Topics
advancedintermediate

AI Integrations

How to connect AI tools into your workflow

Integrating AI Into Your Stack

Beyond coding assistants, AI can be integrated directly into your applications. Here's how to add AI capabilities to your prototypes.

It's often best to start AI integrations by creating a chat page to ensure the model is set up properly before creating your actual feature.

API-Based Integrations

The most common way to add AI is through APIs. You send text, get intelligent responses back.

Using OpenAI API (Node.js)
import OpenAI from 'openai';

const openai = new OpenAI({
  apiKey: process.env.OPENAI_API_KEY
});

const response = await openai.chat.completions.create({
  model: 'gpt-4',
  messages: [
    { role: 'user', content: 'Summarize this text...' }
  ]
});
Using Anthropic API (Node.js)
import Anthropic from '@anthropic-ai/sdk';

const anthropic = new Anthropic({
  apiKey: process.env.ANTHROPIC_API_KEY
});

const response = await anthropic.messages.create({
  model: 'claude-3-sonnet-20240229',
  max_tokens: 1024,
  messages: [
    { role: 'user', content: 'Analyze this data...' }
  ]
});

Using Vercel AI SDK

Vercel provides and maintains the AI SDK code, and you just plug in the model. It's always a good idea to have more than one model available.

No-Code AI Integrations

Add AI without writing code:

  • Zapier AI — AI actions in your automation workflows
  • Make (Integromat) — Visual AI integration builder
  • Voiceflow — Build AI chatbots visually
  • Typeform + AI — Smart form responses

Common Use Cases

Use CaseBest ToolComplexity
ChatbotOpenAI + Vercel AI SDKMedium
Content generationAnthropic Claude APILow
Image generationReplicate / DALL-ELow
Voice transcriptionWhisper APILow
Semantic searchPinecone + OpenAIHigh

For prototypes, start with pre-built solutions like Vercel's AI SDK. Only build custom integrations when you have specific requirements.