6. Frontend Code | TariqLabs Academy

Autoplay
Autocomplete

Previous Lesson Complete and Continue

AI Agent Engineering

Introduction

Welcome to the course (4:29)
Who is this course for? (1:11)
Programming Language (1:25)
Coding Methodology (1:57)
Install Code (5:15)
Curriculum Tour (5:58)

Source Code

Full Source Code

Downloadables

AI Agent Engineering | Roadmap
AI Agent Engineering | Curriculum
AI Agent Engineering | Glossary
AI Agent Tech Stack | Cheat Sheet
AI Agent Engineering Handbook

Module 1 | Intro to AI Agents

Intro to AI Agents Module (1:13)
1. AI Pyramid (6:05)
2. What are AI Agents? (3:58)
3. RAG vs Agentic RAG (5:44)
4. AI Agent Tech Stack (8:05)
5. What we'll build? (Demo) (6:22)
6. System Design (4:07)
7. Tools Setup (8:12)
8. Frontend Code Overview | React.js (8:46)
9. Backend Code Overview | Node.js | Ingest API (16:49)
10. Backend Code Overview | Node.js | Chat API (14:45)
11. Langsmith | Observability (18:11)
12. Run App (0:59)

Module 2 | Deploy Local LLM (Ollama)

Intro to Ollama Module (1:20)
1. System Design with Ollama changes (1:08)
2. Setup Ollama (1:29)
3. Download local LLM (9:44)
4. How to use Ollama API? (4:24)
5. Code changes (4:49)
6. Run app after changes (3:37)

Module 3 | Model Context Protocol (MCP)

Intro to MCP Module (0:53)
1. The problem MCP is solving (4:11)
2. MCP is the solution (9:15)
3. MCP Capabilities (3:42)
4. What is a Protocol? (5:58)
5. Transport modes (8:07)
6. MCP Messages (1:07)
7. MCP Conversation (6:28)
8. App Demo (8:26)
9. Frontend Code Changes for MCP (2:12)
10. Backend Code Overview | MCP Client (15:52)
11. MCP Server | Streamable HTTP (13:16)
12. MCP Server | STDIO (3:11)
13. MCP Client-Server Architecture (2:17)
14. Using API vs MCP Server (12:44)
15. Web Search API Setup (0:45)
16. Run App (6:04)

Module 4 | Multi-Agent Systems | LangGraph

Intro to Multi-Agent Systems Module (0:43)
1. Intro to LangGraph (14:20)
2. Demo App: AI Trip Assistant (5:15)
3. Frontend Code | Part 1 (7:58)
4. Frontend Code | Event Source (19:38)
5. Backend Code | Server File (14:04)
6. Backend Code | Agents File (30:17)
7. Setup App: AI Trip Assistant (3:03)

Module 5 | Multi-Agent Systems | Agent2Agent

Intro to Agent2Agent Module (1:05)
1. Intro to Agent2Agent Protocol (8:11)
2. A2A Definition (9:47)
3. LangGraph vs A2A (6:10)
4. Demo App: AI Trip Assistant (A2A) (6:50)
5. System Design (4:30)
6. Frontend Code (11:37)
7. Backend Code | Orchestrator (26:02)
8. Backend Code | Agents Files (12:49)
9. Setup App: AI Trip Assistant (A2A) (6:33)

Module 6 | Multi-Agent Systems | Career Assistant

Intro to Career Assistant App Module (0:46)
1. Demo App: AI Career Assistant (7:36)
2. Frontend Code (23:20)
3. Backend Code | Server File (9:43)
4. Backend Code | Agents File (19:29)
5. Setup App: AI Career Assistant (3:50)

Congratulations

Congratulations and Thank you (1:16)

Teach online with

6. Frontend Code

Lesson content locked

If you're already enrolled, you'll need to login.

Enroll in Course to Unlock