Search the web with Claude AI. Includes result filtering, multiple search types, and language support.
Requirements, wiring steps, and what this pattern adds to your project.
Pick how you want to pull this pattern in. Then wire env vars and routes the same way.
Download → Next.js app
Use Download → Next.js app in the preview toolbar. You get a zip scaffold (Pro downloads rewrite preview `/view/.../api/*` paths to `/api/*` automatically).
Extract the zip and install dependencies
Unzip the archive, then run `pnpm install` (or npm / yarn) in the project folder.
Fill .env.local
The download includes .env.local placeholders when needed. Add real values for: CLAUDE_API_KEY.
Customize the agent and tool files
Adapt prompts, tools, and stop conditions in the generated project for your product.
Run the app and open the pattern route
Run `pnpm dev`, open the setup/checklist page if present, then navigate to the generated pattern route and verify responses.
CLAUDE_API_KEYGet keyAI SDK APIs
streamTexttoolconvertToModelMessagesgenerateTextProviders
app/page.tsxapp/layout.tsxapp/api/websearch-claude/route.tscomponents/websearch-demo.tsxlib/request-utils.tsREADME.mdnpm packages
6
Registry components
websearch-claude/route.tsAPI route demonstrating Claude's built-in web search tool via anthropic.tools.webSearch. Shows the provider-native tool integration pattern with streamText and sendSources.
Search the web with Claude AI. Includes result filtering, multiple search types, and language support.
Requirements, wiring steps, and what this pattern adds to your project.
Pick how you want to pull this pattern in. Then wire env vars and routes the same way.
Download → Next.js app
Use Download → Next.js app in the preview toolbar. You get a zip scaffold (Pro downloads rewrite preview `/view/.../api/*` paths to `/api/*` automatically).
Extract the zip and install dependencies
Unzip the archive, then run `pnpm install` (or npm / yarn) in the project folder.
Fill .env.local
The download includes .env.local placeholders when needed. Add real values for: CLAUDE_API_KEY.
Customize the agent and tool files
Adapt prompts, tools, and stop conditions in the generated project for your product.
Run the app and open the pattern route
Run `pnpm dev`, open the setup/checklist page if present, then navigate to the generated pattern route and verify responses.
CLAUDE_API_KEYGet keyAI SDK APIs
streamTexttoolconvertToModelMessagesgenerateTextProviders
app/page.tsxapp/layout.tsxapp/api/websearch-claude/route.tscomponents/websearch-demo.tsxlib/request-utils.tsREADME.mdnpm packages
6
Registry components
websearch-claude/route.tsAPI route demonstrating Claude's built-in web search tool via anthropic.tools.webSearch. Shows the provider-native tool integration pattern with streamText and sendSources.

Unlock the live preview and source
Locked on free (high token spend). Pro runs the live demo and includes the source.
Early-bird pricing — limited time

Open on desktop for the interactive preview.
Search the web with Claude AI. Includes result filtering, multiple search types, and language support.
Unlock the live preview and source
Locked on free (high token spend). Pro runs the live demo and includes the source.

Unlock the live preview and source
Locked on free (high token spend). Pro runs the live demo and includes the source.
Early-bird pricing — limited time

Open on desktop for the interactive preview.
Search the web with Claude AI. Includes result filtering, multiple search types, and language support.
Unlock the live preview and source
Locked on free (high token spend). Pro runs the live demo and includes the source.