MENU

Fun & Interesting

Build an AI RAG Application with LangChain & Next.js

Dave Gray 38,287 11 months ago
Video Not Working? Fix It Now

Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap Learn how to build an AI RAG application with LangChain & Next.js. This tutorial introduces LangChain and shows how to use the framework to enhance your chatbots and build RAG (retrieval augmented generation) applications with Next.js. 💖 Support me on Patreon ➜ https://patreon.com/davegray ⭐ Become a full-stack web dev with Zero To Mastery Courses: - Complete Next.js Developer: https://bit.ly/CompNextJSDev - Advanced React: https://bit.ly/AdvReactDev - Junior to Senior Dev Roadmap: https://bit.ly/WebDevRoadmap-JrtoSr 🚩 Subscribe ➜ https://bit.ly/3nGHmNn 📬 Course Updates ➜ https://courses.davegray.codes/ ❓ Questions - Please post them to my Discord ➜ https://discord.gg/neKghyefqh ☕ Buy Me A Coffee ➜ https://www.buymeacoffee.com/davegray 🔗 Starter Source Code Example: https://github.com/gitdagray/nextjs-ai-chat 🔗 Completed Source Code Example: https://github.com/gitdagray/nextjs-rag-langchain 🔗 My Next.js Videos: https://www.youtube.com/playlist?list=PL0Zuz27SZ-6Pk-QJIdGd1tGZEzy9RTgtj 👇 Follow Me On Social Media: GitHub: https://github.com/gitdagray Twitter: https://twitter.com/yesdavidgray LinkedIn: https://www.linkedin.com/in/davidagray/ Build an AI RAG Application with LangChain & Next.js (00:00) Intro (00:12) Welcome (00:34) Lesson Goal (01:03) What is RAG? (02:17) What is LangChain? (03:39) Source Code (04:14) OpenAI API Key (05:04) Dependencies (06:35) Frontend Chat Component (07:24) Simple Chat Example (09:29) Ex. 1: LangChain Chat (14:51) Ex. 2: Chat with History (21:06) Ex. 3: Chat with Personality (22:37) Ex. 4a: RAG Pattern Chat with JSON Object (29:58) Ex. 4b: RAG Pattern Chat with JSON file (32:11) Wrap-up 📚 Tutorial References: 🔗 LangChain: https://js.langchain.com/docs/get_started/introduction 🔗 Next.js: https://nextjs.org 🔗 Vercel AI SDK: https://sdk.vercel.ai/docs 🔗 OpenAI: https://openai.com/ 🔗 shadcn/ui: https://ui.shadcn.com/ 🔗 Next.js Light & Dark Modes: https://www.davegray.codes/posts/light-dark-mode-nextjs-app-router-tailwind Was this tutorial about building a RAG application with LangChain & Next.js helpful? If so, please share. Let me know your thoughts in the comments. #rag #app #langchain

Comment