Welcome to Quest 6 of the JS AI Build-a-thon — your fast track to building AI-powered apps with JavaScript and TypeScript. This isn’t just a coding challenge — it’s a full-blown learning experience with practical quests, a buzzing Discord community, and resources to help you go from prompt to product.
So far, you’ve experimented with generative models, created UIs, added your own data and conversation memory. Now it’s time to unlock the next level: building your first AI Agent. Let’s go agentic.
🛠️ What You’ll Build
In this quest, you’ll build and test an AI Agent using the Azure AI Foundry VS Code extension. Then you’ll level it up by adding a tool that grounds it in real-time info (via Grounding with Bing service). You’ll get real code, and finally plug your agent into your app.
Agentic apps are goal-driven, tool-using, and context-aware — this quest shows you exactly how to build them.
Agent Mode - What's the current weather in Spain?⚙️ What You Need
Before you begin, make sure you have:
- A GitHub account
- Visual Studio Code installed
- Node.js installed
- A Pay-as-you-go or paid Azure subscription (to use Bing Search grounding)
- BUT, if you are on a sponsored Azure account (e.g., Azure for Students)? No worries — you can still do the quest, just skip the Bing grounding step.
🎁 Quest 6 Just Got an Upgrade
‼️ IMPORTANT: We’ve shipped fresh updates to Quest 6 with streamlined instructions and a cleaner workflow.
Before starting, make sure you synchronize the latest files into your repo. It’s easy:
Step 1: Download the new files
Windows:
curl.exe -LfO https://raw.githubusercontent.com/Azure-Samples/JS-AI-Build-a-thon/main/.github/steps/6-build-agent.md
curl.exe -LfO https://raw.githubusercontent.com/Azure-Samples/JS-AI-Build-a-thon/main/.github/workflows/6-build-agent.yml
mv -Force 6-build-agent.md .github/steps/
mv -Force 6-build-agent.yml .github/workflows/
MacOS:
curl -LfO https://raw.githubusercontent.com/Azure-Samples/JS-AI-Build-a-thon/main/.github/steps/6-build-agent.md
curl -LfO https://raw.githubusercontent.com/Azure-Samples/JS-AI-Build-a-thon/main/.github/workflows/6-build-agent.yml
mv -f 6-build-agent.md .github/steps/
mv -f 6-build-agent.yml .github/workflows/
Step 2: Push the files
git add .github/steps/6-build-agent.md .github/workflows/6-build-agent.yml
git commit -m "Updated Quest 6 instructions"
git push
Step 3: Reset (If You Already Started Quest 6)
Click Reset Progress in your README, then select Quest 6 – I want to build an AI Agent from the welcome page.
You’re good to go!
🛠️ Concepts You’ll Explore
Agent Creation with AI Foundry Extension
Use VS Code to define and run your own AI agent — no backend setup required. You’ll craft goal-based agents with memory, tools, and personality.
Agent DesignerAgent Playground
Test your agent in a controlled environment before integrating it. It’s like staging for your Agent.
Agent PlaygroundTool Calling: Add Bing Grounding as a Tool
Add Bing as a grounding tool so your agent can answer real-time questions based on the web — not just its training data.
Agent limitationsCode Integration
Grab JavaScript code snippets from AI Foundry and plug your agent into your own app. Use agentMode to make your app fully intelligent and interactive.
Update your app with Agent mode🚀 Additional Resources to Explore
Here’s where to dive deeper:
- Azure AI Agents JavaScript Examples
A repo full of practical, working examples of agents in action. - Your First AI Agent in JS with Azure AI Agent Service
Step-by-step guide for creating, running, and debugging your agent. - Create a New Agent (JS/TS)
Everything you need to configure and deploy your own agent from scratch. - 📹 DEMFP781: From Prompt to Product – Build an AI Agent That Generates UI
A fun, visual session on going from idea to working agent-driven app.
Quest 6 is where you go from reactive chatbots to goal-driven agents that use tools, adapt, and respond with context.
Microsoft
