How to Use JavaScript with AI — Libraries, APIs, and Best Practices
Two years ago, if you wanted to build AI applications, everyone told you to learn Python. That made sense when AI meant training models. But AI engineering in 2025 looks very different — you’re building on top of foundation models through APIs, wiring them into UIs, and making them reliable in production. That’s just web development. And JavaScript is very good at web development.
Here’s a practical rundown of how to actually connect JavaScript to AI — what libraries to use, which APIs to call, and how to avoid the common mistakes.
Calling AI APIs Directly
All the major AI providers expose REST APIs you can call with a plain fetch. No library needed to get started.
OpenAI API
POST to https://api.openai.com/v1/chat/completions with your API key in the Authorization header. You get GPT-4o, DALL-E for images, Whisper for speech-to-text, and embeddings for semantic search. The most widely supported API in the ecosystem.
Anthropic (Claude) API
POST to https://api.anthropic.com/v1/messages with x-api-key and anthropic-version headers. Claude is strong for reasoning, long documents, and structured outputs. Good choice when accuracy and nuance matter more than raw speed.
Google Gemini API
Available via REST or the official Google AI JavaScript client. Multimodal out of the box — handles text, images, code, and audio in the same model. Good option if you’re already in the Google ecosystem.
Libraries Worth Using
Vercel AI SDK
If you’re only going to learn one AI library for JavaScript, make it this one. It gives you a single unified API across OpenAI, Anthropic, Google, Mistral, and most other providers — switch models with one line of code without changing anything else. It handles streaming, tool calling, structured output, error recovery, and has framework-specific hooks for React, Next.js, Svelte, and Vue.
npm install ai @ai-sdk/openai @ai-sdk/anthropic
openai (official Node.js SDK)
The official OpenAI client for Node.js and the browser. Clean API, well-documented, supports streaming and all OpenAI endpoints. Good if you’re exclusively on OpenAI and don’t need the abstraction layer the Vercel SDK provides.
npm install openai
@anthropic-ai/sdk
The official Anthropic SDK for TypeScript and JavaScript. Covers the full Claude API — messages, streaming, tool use, vision, and batches. If you’re building Claude-first, start here.
npm install @anthropic-ai/sdk
LangChain.js
The JavaScript port of the popular Python framework. Useful when you’re building more complex workflows — chains, agents, RAG pipelines, memory, and tool integrations. More powerful than a direct API client but also more opinionated and heavier. Good for teams coming from the Python LangChain world.
npm install langchain @langchain/openai
LlamaIndex.TS
The JavaScript version of LlamaIndex, focused on RAG — ingesting documents, building vector indexes, and querying them intelligently. If you’re building anything that needs to search through your own content and give grounded answers, this is the tool for that job.
npm install llamaindex
Mastra
A newer framework built on top of the Vercel AI SDK for teams building more complex AI applications — agents, multi-step workflows, memory, tracing, and evals. Works with any model provider. If the Vercel AI SDK feels like building blocks and you want more structure, Mastra adds that layer without hiding what’s underneath.
npm install @mastra/core
Langfuse
Observability for LLM applications — think Datadog but for AI. Tracks every prompt, response, latency, cost, and error. Open-source core with a cloud option. Once you’re running AI features in production, flying blind on what’s actually happening gets painful fast. Langfuse fixes that.
npm install langfuse
AI Tools for JavaScript Development
Cursor
A VS Code fork with AI built in at the codebase level — not just autocomplete, but agent mode that can write across multiple files, run commands, and debug. If you spend most of your time in JavaScript or TypeScript, Cursor is the tool most developers are reaching for right now. Set up a .cursorrules file with your project conventions and it becomes noticeably more useful.
GitHub Copilot
Works across VS Code, JetBrains, and other editors. Good autocomplete and inline suggestions, easier to set up than Cursor. Less context-aware across large codebases but a solid starting point if you want AI assistance without changing your editor.
Claude Code
Anthropic’s terminal-based coding agent. Runs in your terminal, understands your whole project, and can make changes across files autonomously. Works well alongside editors rather than replacing them. Good for larger refactors or tasks you want to run while doing something else.
Best Practices
Never expose API keys on the client side
All AI API calls that use secret keys should go through your backend — a Next.js API route, an Express server, an edge function. A key exposed in frontend JavaScript is a key anyone can use and charge to your account. Use environment variables and keep them server-side only.
Use streaming for chat and long responses
If you’re building anything conversational or generating long content, streaming is almost always better than waiting for the full response. It makes the UI feel fast even when the model is slow. The Vercel AI SDK makes streaming nearly trivial — the streamText function and the useChat hook handle most of the plumbing.
Use generateObject for structured output
When you need JSON back from a model — a structured response, a list of items, a typed object — use structured output rather than prompting the model to “return JSON” and hoping for the best. The Vercel AI SDK’s generateObject with a Zod schema is the cleanest way to do this. It validates the response and retries if the model returns something malformed.
Handle rate limits and errors with retries
AI APIs return 429s when you hit rate limits. They time out. They occasionally return errors for no obvious reason. Wrap your API calls in retry logic with exponential backoff. The official SDKs handle some of this automatically, but it’s worth understanding what’s happening and configuring it for your use case.
Cache aggressively where you can
If you’re calling the same prompt with the same input more than once, cache the result. AI calls are slow and cost money. A Redis cache or even a simple in-memory cache can eliminate a huge percentage of redundant API calls for things like summaries, translations, or generated tags that don’t change.
Log inputs, outputs, and costs in production
Once AI features are live, you need visibility into what’s actually happening. How many tokens are you using? Which prompts are failing? What does the latency look like? Langfuse handles this well. Without this kind of observability, debugging AI issues in production is a nightmare — you’re guessing at prompts that worked in development but behave differently at scale.
Keep prompts out of your code
Hardcoding prompts in your JavaScript files means every prompt change requires a code deploy. As your AI features mature, you’ll want to iterate on prompts without touching the codebase. Move prompts to environment variables, a config file, or a prompt management system. It feels like over-engineering at first and then saves you an enormous amount of pain.
Pick the right model for the job
GPT-4o and Claude Opus are expensive. For simple tasks — classification, summarisation, extraction from short text — a smaller, cheaper model like GPT-4o mini or Claude Haiku is usually perfectly capable at a fraction of the cost. Start with a cheaper model and only step up when you’re actually hitting quality limits.
Where to Go From Here
- Vercel AI SDK docs: sdk.vercel.ai/docs
- OpenAI Node.js SDK: github.com/openai/openai-node
- Anthropic TypeScript SDK: github.com/anthropics/anthropic-sdk-typescript
- LangChain.js: js.langchain.com
- LlamaIndex.TS: ts.llamaindex.ai
- Mastra: mastra.ai
- Langfuse: langfuse.com
- OpenAI API docs: platform.openai.com/docs
- Anthropic API docs: docs.anthropic.com