Optional companion recording: click the image below for a guided walkthrough.
In this quest, you will set up and run a complete end-to-end Burger Ordering Agent system using LangChain.js. Once you have completed the setup, you will start a CodeTour that will guide you through each step of the Agentic solution design and implementation with detailed explanations.
Note
This quest highlights three foundations of an agent system: MCP tool integration for interaction with external systems, structured agent workflows with error handling for consistent behavior, and API-based architecture for controlled access and validation.
-
Fork and Clone the Repository: Start by forking the AI Agent with MCP tools using LangChain.js repository to your GitHub account and then clone it.
git clone https://github.com/<your-username>/mcp-agent-langchainjs.git
Navigate to the project directory:
cd mcp-agent-langchainjs -
Install Dependencies: Install the required project dependencies using:
npm install
-
Start the Application:
Launch the application with:
npm start
Note
Starting the different services may take some time, you need to wait until you see the following message in the terminal: 🚀 All services ready 🚀
This will start:
- Agent Web App: http://localhost:4280
- Agent API: http://localhost:7072
- Burger Web App: http://localhost:5173
- Burger API: http://localhost:7071
- Burger MCP Server: http://localhost:3000
This quest is designed to give you a guided tour of the codebase and its implementation of the complete Agentic solution. Follow these steps to start the CodeTour:
-
Install the CodeTour Extension: If you haven't already, install the CodeTour extension in Visual Studio Code.
-
Open the CodeTour: Open the Command Palette (Ctrl+Shift+P or Cmd+Shift+P on Mac) and type "CodeTour: Start Tour".
There are 6 tours to walk you through the entire agent implementation flow. We recommend going through them in order as they build upon each other.
- Tour 1: Introduction: Understanding AI Agents (7 steps)
- Tour 2: Designing AI Agents (8 steps)
- Tour 3: Building MCP Tools (10 steps)
- Tour 4: Building the Agent API (7 steps)
- Tour 5: Backend API Design (7 steps)
- Tour 6: Scaling with Azure Infrastructure (4 steps)
Warning
Trouble viewing the CodeTour? Try setting comments.maxHeightExceeded to false
Once you have completed the CodeTour and explored the agent implementation, return to the Quest directory to choose what to explore next.
Have a question, project, or insight to share? Join the JavaScript AI community on Discord.
This quest was partially created with the help of AI. The author reviewed and revised the content to ensure accuracy and quality.



