🔴 Let's build an AI Agent that can use Tools in NEXT.JS 15! (LangChain, Clerk, Convex, TS, IBM)

1️⃣ Get Started with Clerk 👉 https://go.clerk.com/R9MPryz 2️⃣ Get Started with Wxflows tool 👉 https://ibm.biz/wxflows-sonny ❗️Get the Complete Source Code for FREE 👉 https://www.papareact.com/ai-agent-build-form 🚨 Join the world’s BEST developer community & course Zero to Full Stack Hero: https://www.papareact.com/course 🛠️ Looking for the Code for this build? (Plus over 50+ others!) https://links.papareact.com/github Join me as I show you how to build a powerful AI Agent with Next.js 15 that can interact with various tools and services. In this comprehensive build, you'll learn: 👉 How to implement Prompt Caching for optimized AI responses using Anthropic's caching feature (Drastically reduces token usage) 👉 How to integrate IBM's wxflows tooling to make any data source a tool in seconds, including YouTube transcripts and Google Books APIs! 👉 How to use LangChain and LangGraph for sophisticated tool usage, including: - State management with StateGraph - Tool orchestration with ToolNode - Memory management with MemorySaver - Intelligent message trimming for context management 👉 Build custom streaming solutions for Next.js 15, working around LangChainAdapter limitations when working with Custom Tools - Real-time token streaming - Tool execution feedback - Proper error handling for failed tool calls 👉 Create a modern chat interface with: - Real-time updates - Message history management - Tool interaction visualization 👉 Implement authentication with Clerk and integrate it with Convex database for: - User management - Chat history persistence - Real-time data synchronization 👉 Leverage Claude 3.5 Sonnet for advanced AI capabilities with: - Tool-augmented responses - Context-aware conversations - Efficient token management (4096 token context window) 👉 Deploy your application to production via Vercel with: - Environment variable management - Production-ready configurations - Performance optimization + MORE! 🎵 WANT TO LISTEN TO THE EXCLUSIVE PAPAFAM PLAYLIST? Sign up for the PAPAFAM Newsletter here 👉 https://links.papareact.com/newsletter 🕐 TIMESTAMPS: 0:00 Introduction 01:05 Build Demo 06:17 Explaining IBM’s Watsonx.ai Engine 10:26 Build Tech Stack 17:08 Build Breakdown (1/2) 27:12 Setting Up Clerk for Authentication 30:17 Initialising the Build 33:04 Build Breakdown (2/2) 42:43 Setting Up IBM’s Watsonx.ai Engine (Wxflows) 49:40 Implementing Clerk for Authentication 52:07 Setting Up Convex 57:51 Implementing Clerk & Convex Together 1:07:33 Building the Landing Page 1:14:33 Implementing Clerk Passkey Functionality (1/2) 1:21:04 Building the Dashboard Page 1:27:02 Building the Header Component 1:30:02 Implementing Clerk Passkey Functionality (2/2) 1:32:16 Adding State management via 'use' hook (React 19) 1:41:57 Building the Sidebar Component 1:48:31 Implementing Convex 1:53:37 Implementing Create & Delete Functionality for Chats 2:02:18 Building the Chat Row Component 2:07:51 Building the Dashboard Page 2:10:48 Building the Chat Page 2:20:30 Building the Chat Interface Component 2:43:04 Explaining the Build 2:47:00 Implementing Streaming 3:01:15 Setting Up LangChain & langgraph 3:05:26 Setting Up Anthropic (Claude) 3:10:14 Implementing IBM Wxflows (for Tools) 3:27:51 Implementing langgraph [LangChain Framework] (1/2) 3:31:51 Creating & Explaining System Message (for Prompt Caching) 3:36:59 Implementing langgraph [LangChain Framework] (2/2) 3:55:09 Implementing Prompt Caching 4:01:50 Building the Complete Message Flow 4:12:25 Building the Streaming Functionality 4:31:00 Building the Message Bubbles with Shadcn/ui 4:37:20 Live Debugging the Streaming Functionality 4:48:55 Testing the Build & Final Fixes 5:07:43 Deploying to Vercel 5:13:15 Final Deployed Build Demo 5:18:04 Build Summary 5:20:11 Outro Let’s get it PAPAFAM 🔥. #nextjs15 #ai #aiagents #reactjs #aiagent #javascript #convex #ibm #openai #backend #coding #tutorial #beginner #programming