Introduction and app overview

0:00 this course will help you master Lang chain a revolutionary AI first framework Lang chain enables developers to build context aware reasoning applications by linking large language models with external data sources for advanced natural language processing applications starting with the basics of text processing and vectorization and advancing to the nuanced aspects of laying chains expression language and retrieval techniques you'll gain hands-on experience in building real world AI applications Tom chant developed this course he is an experienced developer and course creator at scrimba hey there free code campers and welcome to this interactive course where you're going to learn how to use Lang chain JS to build a context aware chatbot that can answer questions on a specific document we provid it we're starting with the basics so you don't need any prior experience with Lang chain JS or even with AI the only prerequisites for this course are a knowledge of working with apis and vanilla JavaScript now Lang chain has a reputation for a steep learning curve

1:10 but using its new expression language we make the journey much easier this is a Project based course with challenges and that means you're going to get your hands on the keyboard writing code throughout and if you're wondering how you can access the project code don't worry we've got you covered from the interact active version of this course on sca.com you can pause the video edit the code and run the projects right there in your browser or you can download the code from the scrims and run them locally if you prefer the link is in the description and one final thing if you enjoyed this course do hit the thumbs up right here on YouTube and if you'd like to get in touch reach out to me I'm on Twitter or X at TP chant okay let's Dive In hang chain to build aiiowed applications I am super excited to bring you this course on using one of the most mind-blowing Technologies in the emerging AI Universe we are going to study embeddings we'll be working with Vector stores we'll be building

2:22 templates and creating prompts from those templates next we'll look at setting up chains and we'll do that using Lang chains expression language which is a more expressive and accessible way to write Lang chain we'll be looking at the pipe method to join elements of a chain together we'll be retrieving data from a vector store and then we'll use the runnable sequence class which is a really cool way to create complex chains in Lang chain and there's loads more plus challenges this is our project we are building a bot which is knowledgeable on information we give it so this bot is going to know all about our platform sca.com and we're going to feed it 3,000 words of information and then we'll be able to interrogate it on this information this is one of the most powerful uses of AI and it's a process that Lang chain makes easy now in this course we're going to focus on the Lang chain syntax the project is built in vanilla JavaScript and you're welcome to refactor it into any framework or Library you wish I'm assuming you have a solid knowledge of vanilla JavaScript but you don't need to be an expert if you've worked with apis and asynchronous JavaScript a little bit before you're going to be absolutely

3:29 fine my name is Tom chant and I will be your tutor for this course you can find me on Twitter or X or whatever you want to call it I am @ TP chant and you can click this link and visit me there it's always good to hear how you got on and any feedback you might have now before you begin why not head over to our Discord server and meet the community and let everybody know that you're starting this course in the today I will Channel and again this slide is a link to that page on our Discord server before we we dive into the concepts and code let's get an intro to Lang chain from the founding software engineer of Lang chain Jacob Lee Yes L chain is a framework that helps developers build context aware reasoning applications Lang chain was born out of the realization that the process of developing sophisticated AI powered apps could be significantly streamlined by factoring out some common abstractions while much of current AI app development akes place in the realm of python there's a clear need for better tooling for the more webd focused JavaScript Community too hence L chain comes in two flavors and one of the aims of Lang

4:38 chain JS is to make large language models and techniques around working with them more accessible to this broader audience in this course you'll be learning how to use Lang chjs to build your own apps it focuses in on conversational retrieval over document giving an llm access to the specific information in that document so it can answer questions and continue a logical contextualized conversation on topics Beyond its original training data along the way you will use models prompts and Alpha parsers some of the basic building blocks of lank chain we'll create chains of calls that enable us to connect up the various stages in the process need to get the desired output we'll be using L chain with superbase and the open AI API but one of the beauties of this framework is that components are easily swappable so you can work with a myriad of databases Vector stores and llms switch between them and find the one

5:25 which works for you best good luck and I really hope you enjoy this course and enjoy using L chain to spin up really powerful AI web apps of how this app is going to work in this first section we need to work with our data so this chatbot is going to be knowledgeable about a specific Topic in this case the scrimber platform so we're going to start off with an information source which holds the knowledge we want the chatbot to have and we're going to pass this document to a splitter and the splitter is a lang chain tool which will split the document into chunks and then we're going to use an embeddings model from open AI to create vectors from each chunk and we're going to save those chunks to our Vector store which in this case is going to be a superbase vector store when we get to this point the vector store is established it's got all of the knowledge we want it to have and we won't need to repeat this process unless we want to give it more knowledge by adding some new data now if you don't understand the justification for each step or you're not really clear on

6:34 vectors and embeddings yet don't worry we're going to go into a lot more detail when we actually write the code this is just an overview now once we've got the vector store set up we need to create the app to use it and the flow of that app is going to look like this we start off with a user which we've got represented right here and that user will input something probably a question they have about scrimber and we're going to do two things with that question we're going to save it to a conversation memory store which will hold the entire conversation and we'll use an open AI model to convert it to a standalone question and that just means we're going to reduce it to a very concise question with no unnecessary words we'll then take that Standalone question and we'll use an open AI embeddings model to create vectors from it we'll send those vectors to our superbase Vector store and we'll get back the chunk or chunk with the nearest match therefore the chunks that are most likely to contain the answer to our question the last stage is to use an open AI model to get the final answer and to give it the best chance of getting a good answer we're going to give it three pieces of

7:44 information we're going to bring down the nearest matches from the vector store we'll give it the original user input and we'll also give it the conversation memory which will be the entire conversation that has taken place so far so that might be a very very long conversation or this might be the first question in the conversation now we're going to take the response that we get and we'll store it in the conversation memory ready to continue the conversation and also we'll give it back to the user by rendering it to the Dom now again this is a very high level overview and it might well cause some confusion for example what actually is a standalone question and why are we using it right here but then down here we're using the original user input and not the Standalone question but rather than get caught up that right now and give very theoretical answers what I want to do is keep referring to this diagram as we write the code and we're going to tackle those questions as they come up one by one so if this diagram looks horribly confusing right now don't worry at all we are going to take it step by step okay in the next Grim let's go right back to the beginning and think about getting some data into our Vector

8:52 store but before we do that I'm going to bring in a scrim from my colleague Gil who's going to give you a detailed overview of embedded ings so sit back and take a few minutes to watch that next powered search shapes many parts of your daily lives every day you interact with platforms sifting through massive