Interactive Playground

Run a real agent in your browser — no local install, no cloning, no CLI setup. Powered by StackBlitz WebContainers, which runs Node.js entirely in-browser.

Prefer a full-screen editor?

This page embeds each scenario at a fixed height. For a real full-viewport editor with the same three scenarios, open the full-page playground →.

Quick setup

Edit .env directly in the editor

Each playground has a .env file open in the editor. Paste your key after the = (for example GOOGLE_API_KEY=AIza...), then click the terminal restart button (↺).

Get a free Gemini API key at ai.google.dev — no credit card required.

Provider	Free tier?	.env variable
Google Gemini ← recommended	✅ Yes — generous free tier	GOOGLE_API_KEY
Anthropic Claude	❌ Pay-as-you-go	ANTHROPIC_API_KEY
OpenAI	❌ Pay-as-you-go	OPENAI_API_KEY
Groq	✅ Yes — generous free tier	GROQ_API_KEY
xAI (Grok)	❌ Pay-as-you-go	XAI_API_KEY
Local Ollama	✅ Free	PROVIDER=ollama + OLLAMA_ENDPOINT (HTTPS tunnel — see below)

Note

Why not Secrets? The embedded iframe hides the Stackblitz Secrets panel. Editing .env directly in the editor is the reliable alternative — keys stay in your browser session only.

---

Scenarios

Hello Agent

The simplest possible agent. One question, one answer. Start here to see the core API in action.

Set QUESTION in Secrets to ask anything you like.

Tool Integration

Agent with built-in tools. The agent uses crypto-price and code-execute — a live crypto quote plus sandboxed math — then saves the result with the recall meta-tool. No extra API keys needed.

Set TASK in Secrets to give the agent a custom challenge.

Strategy Demo

Three strategies, same task. See how reactive, plan-execute-reflect, and adaptive differ in steps, tokens, and style. Set STRATEGIES=reactive,tree-of-thought to try any other combination.

---

Using local Ollama

Caution

http://localhost:11434 does NOT work in the embed. The StackBlitz WebContainer routes localhost to its own sandbox, not your machine — and a plain LAN IP is blocked as mixed content on this HTTPS page. The only way to reach your local Ollama from the hosted playground is an HTTPS tunnel (Chrome only). Bare localhost works solely if you clone this repo and run the scenario on your own machine, outside the browser sandbox.

1. Start Ollama with CORS open (it must accept the tunnel origin):

   Mac/Linux:

   OLLAMA_ORIGINS=* ollama serve

   Windows:

   set OLLAMA_ORIGINS=* && ollama serve

2. Pull a model if you haven’t already:

   ollama pull llama3.2

3. Expose Ollama over HTTPS with a tunnel:

   cloudflared tunnel --url http://localhost:11434
   # or:  ngrok http 11434

   Copy the https://… URL it prints.

4. In the .env tab, set:

   PROVIDER        = ollama
   OLLAMA_ENDPOINT = https://YOUR-TUNNEL.trycloudflare.com
   MODEL           = llama3.2

5. Click the terminal restart button (↺) to re-run with the new env vars.

Note

This tunnel hop is the gap the v0.12 browser-extension Ollama bridge will close. Until then, the zero-setup path is a cloud key (Gemini free tier).

---

Troubleshooting

npm error code EIO: '<package>' not found in cache

A WebContainer install can fail with:

npm error code EIO
npm error EIO: '@reactive-agents/<pkg>@<version>' not found in cache, try running install again

This is a StackBlitz WebContainer cache-corruption issue in the browser profile, not a problem with the package named in the message. The named package is simply whichever one the corrupted cache trips over; it exists on npm and installs cleanly in a fresh environment.

It is often profile-wide: the same embed works in a different browser, a different Chrome profile, or a private window while failing in the original one. npm cache clean --force and deleting node_modules frequently do not clear it, because the stale state lives in the persisted WebContainer snapshot, not just npm’s cache directory.

Recovery, in order of reliability:

1. Open the playground in a different browser profile (or a private/ guest window, or a different browser). This is the fix that reliably works.
2. If you are on the embed’s own tab, use StackBlitz’s fork to get a fresh container.
3. As a last resort, clear site data for stackblitz.com in your browser settings, then reload.

There is nothing to change in the demo project to fix this, it is a StackBlitz-side cache state. See facebook/docusaurus#11615 for the same failure and confirmation that a fresh profile resolves it.

Other issues

• No API key message — expected; paste a key into the .env tab (see Quick setup above) and click the terminal restart (↺) button.
• Model returns no tool calls — set MODEL in .env to a tool-calling model for your provider (for example MODEL=gemini-2.5-flash), or clear it to fall back to the provider default.