AI Agent with MCP tools using LangChain.js

⭐ If you like this sample, star it on GitHub — it helps a lot!

Overview • Architecture • Getting started • Deploy to Azure • Run locally • MCP tools • Resources

[!IMPORTANT] 👉 Follow the full-length workshop to learn how we built this sample.

Overview

This project demonstrates how to build AI agents that can interact with real-world APIs using the Model Context Protocol (MCP). It features a complete burger ordering system with a serverless API, web interfaces, and an MCP server that enables AI agents to browse menus, place orders, and track order status. The agent uses LangChain.js to handle LLM reasoning and tool calling. The system consists of multiple interconnected services, as detailed in the Architecture section below.

The system is hosted on Azure Static Web Apps (web apps) and Azure Functions (API and MCP servers), with Azure Cosmos DB for NoSQL for data storage. You can use it as a starting point for building your own AI agents.

[!TIP] You can test this application locally without deployment needed or any cloud costs. The MCP server also works with popular AI tools like GitHub Copilot, Claude, and other MCP-compatible clients. Follow the instructions in the Local Development section to get started.

Key features

• LangChain.js agent with tool calling via MCP (Streamable HTTP transport)
• Multi-service, end‑to‑end architecture (web UIs, APIs, MCP server)
• User authentication with sessions history
• 100% serverless architecture, for cost-effective scaling
• Single-command deployment using Infrastructure as Code (IaC)

Architecture

Building AI applications can be complex and time-consuming, but using LangChain.js and Azure serverless technologies allows to greatly simplify the process. This application is a AI agent that can be access through different interfaces (web app, CLI) and that can call tools through MCP to interact with a burger ordering API.

The application is made from these main components:

Component	Folder	Purpose
Agent Web App	packages/agent-webapp	Chat interface + conversation rendering
Agent API	packages/agent-api	LangChain.js agent + chat state + MCP client
Burger API	packages/burger-api	Core burger & order management web API
Burger MCP Server	packages/burger-mcp	Exposes burger API as MCP tools
Burger Web App	packages/burger-webapp	Live orders visualization
Infrastructure	infra	Bicep templates (IaC)