if you're interested in building AI applications then stick around because I've got a great tutorial for you in this video I'm going to be showing you how to build a multi AI agent application in just a few minutes using a fantastic tool called langlow now we're going to integrate this into a basic front end I'm going to explain step by step exactly how to build this out and by the end of the video you're going to learn about how to implement rag retrieval augmented generation how to look up data from a database using an AI and how to combine multiple AI agents together in a system that actually works and can solve real world business use cases this is super cool I promise you you're going to learn a ton so let's get into a quick demo so you can see what we're going to build and the value you're going to get from this video so I'm on the computer now and I'm going to demo to you what we'll be building which is a better customer support agent something that can access your orders it can see if it's been shipped or cancelled it can find information about the pricing the status it can go look up different products in the database and return that to you and it can also do things like utilize rag to answer frequently asked questions of course it can do a lot more than that but those are the core examples by the end of this video you're going to see how to build an advanced AI system that you can extend and can actually solve real world business use cases that's the important thing here this isn't just a toy you could actually use this for a business and maybe you're running right now very cool and you can even take these type of flows and make money from them which is what I find super interesting now on the left side of my screen here I have the chat interface this is a really simple streamlit application very basic python front end that'll show you how to set up even if you don't have a lot of experience in Python and on the right side of my screen I have What's called the laying flow editor where I've built out this AI flow now we're going to dive in and talk about exactly what that means but you can see that this is kind of a drag and drop editor that allows us to combine all different types of components to build these Advanced AI systems so we'll obviously build this from scratch but I just want to show you this is kind of what it looks like and then we can call this from an API and use this in any type of application that we want which is what I'm doing on the left side of my screen now laying flow is pretty new personally I love using it and it comes from the sponsor of today's video which is data Stacks now don't worry this is completely free you don't need to pay for any of this and I've worked with data stacks for many months now to build some awesome AI apps anyways let's look at what this can actually do because obviously you want to see what the agent is capable of so first things first I asked this previously can you help me with my order number one2 now this is able to go into a real world database look up the order number and then find this information it's not using a custom SQL query or anything like that like the llm is actually doing the querying of the database then it's also aggregating this with a table that contains all of the products that this user ordered and displaying that on screen so already that's an interesting capability now we can also ask this things related to frequently asked questions so I can say what are you know the standard shipping times and this agent actually has access to a PDF that contains a bunch of questions and their common answers so rather than just making up some random response it can actually go to that PDF which can act as something like the company database or internal information it can find relevant replies and then give that to us so here you can see it says domestic orders take 3 to five business days International orders take 7 to 14 business days and this isn't just made up this is actually what's contained in that frequently asked questions document which we gave to the AI so this is using something called rag which we'll talk about later I can also say can I cancel order number one4 and same thing now it's going to go look that up and it will also look at the cancellation policy and see if we're able to cancel that so you can see that it was able to find that it says the product name the description and then gives us some more textual data this is really just the start of what's capable with this type of system but I want to show you how you build out this functionality so that you can extend it and make it really cool anyways let's get into it and let's build this app okay so let's go ahead and get started now the first thing we need to do is create a free account with langlow so you can do this from the link in the description by pressing on this button you also can just Google langlow it is free it's actually open source as well you can check out the GitHub here and you can run all of this locally on your own computer so you don't need to do it on the web but it's just a bit easier by the way if you guys want to help support me and see more videos like this do me a favor and just go to their GitHub and give it a star it really does help support the project and show that you guys are actually getting value from these videos so if you are give it a star and that really does does help me out that's all I ask of you anyways I'm going to press on get started for free and it's going to bring me to this signin or sign up page now again free account just make one of these here so we can get to the online editor I'm going to go to sign in and because I already have an account and I believe I'm signed in it's going to bring me to the langlow homepage okay so we're in the Lang flow page here and what we're going to do is start by creating a flow now a flow is like the Lang flow project is where we can build out our AI system and then we can call the Flow by either running it l locally on our own computer or by using the API that Lang flow provides so let's go to new flow here and you'll notice that there's a bunch of different templates so if you just want to check this out for yourself and maybe you don't want to follow along with this video you can look at examples of how to do rag how to build a simple agent classification coding content generation they have a bunch and they're adding more and more and you'll probably see this page change quite a bit over the next year or so because this project really is getting a ton of growth and a ton of work on it anyways I'm going to go to blank flow because I just want to show you how we run this completely from scratch and I'm going to start by showing you how we make a very simple AI agent now first thing I like to do in my flows is just give them a name so if you look up here where it says Untitled document we can go to flow settings and we can just give this a name so let's just call this customer support or something uh because this is going to be a customer support agent of course we can give it a description and for the endpoint let's just call it customer now the endpoint will simply be kind of like that slash path that we go to when we want to use this different flow so just give it a name that's unique if you've used Lang flow before if not you can name it anything that you want and we'll use that much later in the video okay so let's save that and go back into our editor now from here I'm going to show you how we build out some different flows and we're going to start by building some simple functionality specifically around rag I'll explain what that is in a minute and then we'll start making this agent more and more complicated and I'll explain it step by step now something important to know here is that you can Import and Export different flows so if you actually press on this button here you can press on import and you can take the Json file that I'm going to leave Linked In the description in my GitHub repo and you can just breed in the entire flow you'll have to change a few credentials and keys but pretty much everything will just be the exact same and then same thing if you want to save this you obviously can just save it online here or you can press on export and you can save the flow as a Json file with or without your different API key so it's very useful in terms of giving the flow to other people to mess around with and I just want to make you aware of that that all this will be available from the link in the description there's also some other resources like some sample data that will insert in the database and a PDF and you can find that again from that GitHub linked below anyways let's start building something though I don't want to bore you too much when you use a flow you always start with some type of inputs you can see on the left side we've got all these different types of components there's a lot of stuff here and don't worry if it looks a little bit different because again sometimes things change it's pretty intuitive and anyways when you start you're always going to use a chat or text input now we're going to use a chat input to begin and this allows the user just to type something in in the langlow playground now there's a playground here and this allows us to actually test our flow in real time so every time we build something new we can go here we can test it out and we can get the response so we always start with some kind of input and then at the other side of our flow we always have some kind of output okay so if you wanted something like an Echo app you would just connect the message to this text and what would happen is as soon as I type something in it would just get displayed as a chat output in our playground so let me quickly show that to you if I go to playground and I say hey and I hit enter you'll see that it just gives us back hey and the reason for that is my flow just took some input passed it to the output and then that was that I'm just going to delete this by pressing on it and click delete but I'm trying to show you that we start with an input and then we end with some kind of output and everything in between is kind of our AI system so that's how you get some kind of results make sure you have an input and you have an output and you'll see that we connect different components by just draging in these different color bubbles to the corresponding kind of inputs and outputs okay so what I want to do is start with a rag example so we're going to bring in an agent we're going to go to agents here in the components you also can search for it and just drag one of these in now for the agent we have a lot of different options obviously we need a model or an llm which is going to run the agent we need to choose the model name and then if we're using something like open AI we need our open AI API key now if you press on this little Globe here this this is going to allow you to view variables and you'll see that I have an open API key variable now if you don't have that you can make a new one and you can set it equal to your key or you can use any other provider that you want again keep in mind you can run this locally on your computer too so you can use something that's open source okay anyways if you want your openai API key you can go to this link right here which I'll leave in the description press on create new secret key copy that and bring that into langlow I believe you do need to have a credit card now on uh open but it's very cheap maybe a few cents to use this otherwise you can use one of the open source providers okay so what we're going to do now is we're going to drag our chat input as the input to our agent so the idea is that whatever the user asks maybe they ask some kind of question because this will be like a customer support agent we'll pass that as the input but then we also need to give some instructions to our agent so I'm going to create a prompt to make a prompt you can grab the prompt from this kind of component on the left hand side and we'll just drag The Prompt and connect that to H instructions from here I can press on this little square and I can write a simple prompt that I want to provide to the agent so let me copy one in and then I'll talk about how that works okay so I just copied in a really simple prompt you can type this out or again you can just find it from that flow Link in the description but it says your primary goal is to accurately answer user questions by utilizing information from the company database use retrieval augmented generation to fetch and present the most relevant data and then we have a question and this is a prompt variable so if you want to have something Dynamic that you pass into your prompt like the user's question for example then you can do that so we're going to pass the user's question that says in your response incorporate the following relevant data points and then we have these results now these results are going to be the results from our database which contain kind of relevant information to what the user asked I'll show you how we get those in a second but the point is if you want to have variables you can embed them inside of braces notice it shows you right here and now we have two variables that we can kind of pass into this prompt which we will then pass into the model so I'm going to pass this as the agent instructions and I'm going to take my chat input so the output of my chat input and I'm going to pass that as the question to my prompt okay now also at this point I'm just going to change the names of a few things so to do that you can just double click on the name and I'm just going to call this FAQ just so that we know this is handling kind of the FAQ um what do you call it agent components I'm also going to take the response and I'm going to pass that to my chat output so at this point in time I actually already have an AI system but we're missing the important component which is the rag component now for any of you that aren't aware rag stands for retrieval augmented generation and it simply means that we're going to go search inside of a database and find relevant information based on what the user asked and then feed that into the prompt and in this case into our agent the idea is we can get contextually relevant responses or data and we can then allow the llm to reason based off off of that so it gives us things related to for example our company or the frequently asked questions that we have so let me show you an example of what I mean to make this a little bit more clear I'm just going to pop this open uh let me find it here which is my frequently asked questions document so imagine you know this is quite simple I just have some questions and some answers but if you're a company you probably have a bunch of documents like this things related to Promotions going on different sales uh policies uh terms and conditions whatever it might be right you probably have all of this type of data now ideally you want your AI system to be able to use this data and not just make stuff up but actually answer based on things that you know are true right that are in your kind of company database or you know company internal information whatever right so what we're going to do is we're going to upload PDFs like these in this case I'm just going to use one and you can find this exact document from the GitHub Linked In the description you could upload as many as you want and we're going to instruct the AI to retrieve information from this and then answer based on that so ideally when I ask it you know how long does it take for me to get my shipment it will use this content that we have inside of the document that's really the kind of high level overview of retrieval augmented generation and it uses something known as Vector databases which data Stacks provides so what we're going to do now is we're going to drag in another component which is called our Vector store now we're going to bring in the astrab vector store but you can use whatever you want and it should automatically populate for you here the astrab application token if it doesn't do that you can go to asri DB which I'll show you in a second and generate one yourself but it should populate that for you okay now this database here is a very fast Vector enabled database what that means is that we can actually search for information based on vectors rather than traditional SQL queries and we can pull out contextually relevant responses very very quickly so what we're going to do here is create a new database we're going to create a new collection in that database and the idea is we're going to first search in this database based on whatever the user asked we're going to take that pass that into our prompt and then this FAQ agent will be able to use information that it got from the database from our frequently Asked question document to give us some response okay so in order to do this we'll make a new database so I'm going to go to add new database here and I'm just going to call this something like customer you can call this anything that you want and for the provider I'm going to go with Amazon web services and then Us East too you can choose anything you want here and again this is completely free you don't need to pay for this we're going to press on create database and this is going to take a second now while it's creating the database what we're going to do is go over to the data Stacks page where we can manage all of our database instances and we're going to create a new Vector enabled collection you have to do this from data Stacks uh just to make sure that we get everything enabled correctly so where it says Lang flow up here at the top kind of beside my email you'll press on astb now this is going to bring you to a different page which is going to allow you to view the different database instances you have again don't have to pay for this now you'll see that you have some kind of databases in my case I have an orders database which I was using previously and I have this customer database which is being created so I'm going to click into this customer database okay you also see it on the side we're going to wait for it to finish initializing and then we're going to make a new collection and I'll show you how to enable the vector search feature all right so our database has been created and what we're going to do now is go to the data explor now from the data Explorer we're going to create a new collection so we're going to go to create a collection here and we are going to give this a name now I'm going to call this FAQ and it's going to be a vector enable collection we're going to do that to ensure that we're able to perform Vector search and for the dimensions and everything else we're just going to leave this the same and press on create collection all right so now that the collection is active we're going to go back to langlow and we're going to connect to this collection and we're actually going to add a PDF document to it so obviously we need Data before we're able to perform the uh rag operation so for here we're going to select our database of customer we're going to select our collection of FAQ for our embedding model we're going to change this to Astra vectorize and I'm going to explain what this is in one second for now let's just fill in the details we're going to change this to be Nvidia for the embedding provider want to ask for the model we're going to go Envy embed QA and then there's some more information here but you can leave all of that blank we just need what I have here okay customer FAQ Astro voriz Nvidia and then the envy embedy QA now this vectorized thing that we just selected here is a relatively new feature that data Stacks has which allows it to automatically convert data into vectors when you add it to the database now this is a pretty game-changing feature because previously you would need to generate embeddings yourself this is essentially the type of vector data that you're going to search through you would need to make that yourself before you add the data to the database in this case we just enable this setting so Astra vectorize and now anytime we add something to this collection it will automatically be kind of embedded for us and same thing when we're searching for something it will automatically convert that embedding for us so we can perform what's known as a vector search it's really just a similarity search across the database anyways that's what that is I wanted to explain that okay so what we're going to do now is we're going to take our chat input so the question right which is going into our prompt and going into our model and we're going to pass that to sorry we're going to pass the output of that to the search input of our astrab component so the chat output is going to three places now but it's also going to the search input because if we for example say something like what are the shipping times that's the type of thing we're going to search for in our database okay we're then going to take our search results and we're going to connect that to the variable results here in our prompt but you're going to notice and let me just move this around a little bit so it's a bit easier to view that we're not actually able to pass the search results directly to results because the bubbles don't match in colors so what we need to do instead is we actually need to parse the search results which are going to be converted or come as Json data into textual data so we can pass it into our prompt so to do that we can search for the component that says parse data you'll notice that it will take this data as an input and then we can just take this text and we can pass that to our results okay so we have some chat input which is the search string in our database we get some results we parse the data we pass it into our prompt and then we pass that prompt to the FAQ agent now I noticed that we're using the chat input twice because it's going to the prompt and it's going to the input for now that's totally fine later we're going to convert this into something called a tool which is going to kind of remove this um you know added like duplicate which you'll see in a second anyways we now have this system everything will actually work perfectly fine but the issue is we don't have anything inside of our database so before I run the flow what I'm going to do is I'm going to add kind of a separate component here which will allow us to add our PDF to the database so to do that we can go to this data components Tab and we can go to file now this allows us to upload a file right to langlow now after file we're going to connect this to a split text component okay so we're going to look up split text we're going to take our data and that's going to go to the data input of our split text now what we're going to do here is we're going to take a PDF file or whatever file really can be any type we want and we're automatically going to split that and convert it into chunks before we add it into our database so that's what this is doing there's a bunch of other ones you can use as well and you can kind of mess with the settings but that's all this does you know if we have like a massive PDF that's hundreds of pages we can't add that as one document in the database and we don't even want to do that we need to chunk it into smaller pieces so then we can search through it when we do our Vector search okay the next thing we're going to do is we're going to go to Vector store again we're going to bring in our astrab component and we're going to enable the same things but this time we're going to take chunks and convert that or add that sory to ingest data so rather than searching the database we're actually going to add information to the database and we'll do it like this so we're going to go to databases customer uh for the collection FAQ again and for the uh what do you call embedding model we're just going to change this to Astro vectorize okay same thing we're going to do the provider which is NVIDIA and then we're going to select the model which is this and we can leave everything blank that's all we need to do now what we can do is we can upload the file and it should be added to the database so so let's upload the file again you can find this from the GitHub Linked In the description in case you're wondering like where is the PDF file or you can just upload anything that you want it doesn't need to be this okay so I'm going to upload that and now it's uploaded here I'm just going to press run on the astrab component when I do that it's going to run the flow from all of the components connected to this previously okay so I'm going to run this you're going to see that it kind of gets highlighted and then it should get added into Astro DB and you says Astro DB was built successfully which now means we have that PDF data there now we can go look at the PDF data or we can just test this ourself by running this flow that we built so in order to test this we're going to open up our playground and because we have a chat input and a chat output we should be able to run through this flow so I'm going to say hey can you tell me about the shipping times and let's spell shipping correctly of course and let's see what kind of reply we get so there you go we see we get domestic orders and international orders and it's not just making this up this is coming from that rag component we just built and if we want to look at kind of what happened here we can see um kind of a you know look into the flow and kind of what was going on and we can actually inspect the input that we're getting so for example if we go to our prompt and we want to see what the uh prompt actually was we can press on this kind of like eyeball here and you'll see that it actually brought in the information from our PDF now in this case it just injected all of the data because we don't really have that many things in the uh database but obviously if we had a lot more information you would see that it would just get the relevant documents bring that in here and then the uh llm sorry is able to reason based on this data okay so that's a very simple example of rag and now we have kind of one part of our customer agent built we're able to look in the kind of uh what database and and find information at least about frequently asked questions we also know how to add information to our database by using this kind of file upload that we just built but now what I want to do is I want to go a step further and I want to allow the agent to actually look through customer data so things like the orders right so to check the status of an order whether it's cancelled or shipped or to check different products and we're going to build a kind of new system now and then we're going to combine those two together by having an agent that can use these different agents so we're kind of combining like uh you know almost like a manager and then two agents beneath that manager where the manager agent will decide hey should we use use the FAQ agent or should we use the order lookup agent and then it will go and use those tools based on what's required so that's what I was saying with this FAQ what we're actually going to do is we're going to convert this into a tool that an agent's going to be able to use so I'm going to go here this is really cool and we're going to toggle something called tool mode now when I do this what's going to happen is you'll notice the input goes away and so does the output the reason for that is that now this is something that we're going to pass to another agent in it's tools input and it will be able to be used by that agent so we've just kind of created our own custom tool now let's put the chat output over here and I'll show you how this works now first things first whenever we make the tool we're going to go into the controls here and we're just going to make sure that we give the tool a name and a description so that our model knows how to use it so if we scroll down here we should be able to find some kind of agent description yes so it says agent description we're just going to open this up and we're just going to really briefly describe what this agent does say looks up and answers frequently asked questions like shipping estimates cancellation orders and more uh actually maybe we don't want to put orders I'll just say cancellations and more common business questions okay and let's spell answers correctly so we're just giving it a description so that our other agent knows when to use this agent okay there's a bunch of other stuff in here you can mess with but for now that's all you really need okay so now that this is in tool mode we want to use this so we're going to bring in another agent so we're going to bring an agent right here okay we're going to connect our chat input as the input to this agent and then we're going to take this tool and we're going to connect it to this agent now we're just going to give this agent a name and we're just going to call this like manager agent so we know what it's doing and we'll just select our openai API key again and then for the agent instructions again we kind of need to tell this what it should do so I'm just going to click on agent instructions here and I'm just going to directly copy these in again you can find this from the link in the description but it says you're a skilled customer service manager and information router your primary responsibility is to use the available tools to accurately address user inquiries and provide detailed helpful responses you can do the following and then look up order numbers access product information and answer frequently asked questions now these two we can't currently do but we will be able to do them in 1 second but this is what I'm telling kind of my main agent like hey I'm going to give you access to these tools use them properly to answer the question okay so now we have our manager agent connected to our FAQ agent now I'm just going to take the response from that and I'm going to connect that to the chat output and that really completes the manager agent all we've done is added another layer here where now we're only going to use this tool that we just built if it's necessary so this agent will determine with the agent framework hey based on what the user asked from our chat input which is over here and we can rename this to question maybe so that it's a bit more clear should we use this tool if we should use this tool it's going to go and invoke it it's going to pass the input or whatever we need to this tool it will then get the question and then give us that response okay so that is cool let me just move this file upload down here it's starting to get big now but the next thing we want to do is we want to build the ability to look up orders so in order to look up orders we need to have some of those so we're going to switch back to astrab and I'm just going to show you how we can insert some sample data in the database related to orders and product information okay so let's go to our customer database and let's make some new collections so we're going to go to data Explorer and we're going to press on create collection and this time I'm not going to enable the vector collection because I don't need that so I'm just going to call this orders okay and this is is going to represent customer orders and we're going to make that collection again doesn't need to be Vector enabled because we're just going to look this up um like normal we don't need to have like a vector search for this then we're going to make another collection and this is going to be called products and same thing it doesn't need to be vectored enabled at least for right now okay so let's create these two and now I'm going to show you the sample data that we're going to insert here so you can see that I have these two CSV files and let's kind of split the screen 50/50 so we can look at this at the same time I have this sample products. CSV and I have this sample orders. CSV again this will all be available from that GitHub Linked In the description now what we're going to do is we're just going to um copy this information pretty much or like take these csvs and import them as data for our orders and products collection just so that we have something so that we can see how this works so I'm going to go to products and I'm going to go to load data okay I'm just going to select a Json file so I'm going to select that from my um customer service document whatever folder again you can download it from the link in the description and which one is this that we're in right now this is products okay so we're going to load the products so sample products we should see that it kind of gives us all of the different fields obviously you can change these if you want and then I'm going to press on load data okay so let's give this a second to load and then we should see that we have that in there and let's go to orders and let's do the same thing this time we're going to load our sample orders now the thing that I want you to pay attention to in our orders is that we have this array of the products that were ordered so it contains the IDS of products in our product table here so what we're actually going to do is allow the model to look up information in both the orders and the products database and to kind of aggregate data together which I think is really interesting so we have this sample data you can read through it it's just like five or 10 rows I didn't add a lot of stuff and now I'm going to show you how we can get the model to use this okay so we have it here have it orders and products so let's get out of this let's go back to Lang Flow by changing this to say Lang flow and let's write that new tool okay so similarly to before we're going to bring in another agent now this agent we're going to zoom in on it and let's call this the order lookup agent okay now let's go into the agent I'm going to enable tool mode on it by the way just like I did before so make sure you click that we're going to go to controls and we're going to give this a description so for the description we're just going to say you can look up order and product um information okay good sweet so we'll close that and now we need to give this access to some tools so again the way that agents work is you can give them tools and they will then utilize those tools to go and solve some kind of task so first let's do the openai API key here for the agent instructions same thing let's copy something in here so let me just open this up and let's copy this in okay you are an expert in analyzing customer orders and providing detailed and accurate information your primary role is to utilize and provide uh tools let Su tools to efficiently look up order numbers retrieve relevant details about the orders and address any questions or concerns the user may have and then it says orders always contain an array of product IDs ordered use these IDs to look up specific products from the product lookup table and aggregate the product information with the order to provide a clear summary of the order if the order does not exist simply tell the user to try again uh as the ID wasn't found only return information about orders do not return anything else so what I'm telling this here is hey when you look up an order because we're going to be able to get that in one second it's going to contain some product IDs I also want you to look up those products and then take that information and kind of aggregate that with your response so this is how I'm getting it to utilize these tools which we're going to build in one second so first things first we can take this and we can pass this as a tool to our manager agent so again the manager agent will be able to use the FAQ agent and the order lookup agent it's like kind of delegating the tasks between them then we need to make some tools that the order lookup agent can use now these are actually quite simple we're going to go to tools and we're going to bring in Astro DB now notice I didn't bring in the vector search astrab I just brought in the normal astb from tools because I don't want to perform a vector search I just want to do a normal lookup based on an ID for example so for the tool name the first one that we'll have will be the order lookup so we're going to say order look look up okay and then for the description we're going to say a tool used to look up an order based on its ID okay now for the collection we first need to select the database so let's select the customer database and then the collection is going to be orders and then what we're going to do is we're going to provide a tool parameter now this tool parameter is going to be the thing that the agent needs to pass to this tool in order to use it so what we're going to do is we're going to pass exclamation point and then order number now what this means is that I'm going to look up the order number field and the exclamation point means this is mandatory and for the value we just leave it empty so what we're saying is okay hey you want to use this as a tool so let's add this as a tool for our agent if you want to use this thing this is what it does but in order to use it you need to pass me an order number and then that order number will be used to actually look up information in the ORD database we'll then pull that information and pass that to our agent so that's kind of how this database is working we're saying look up this field look up this order number field and then find the um what do you call it the like row that has this order number and then return that to me now we're going to do the exact same thing here so bring this in again but for products okay so same thing let's connect our tool to the tool input okay now for the tool name we're going to call this product lookup okay and for the description it'll be same thing look up a product based on its ID look up a product based on its ID for the database we're going to choose customer for the collection we're going to choose products and for the tool parameters this time it's going to be the product ID with an exclamation point so not order number but exclamation point product ID sweet so there you go we just provided two tools now to our order lookup agent that's really all we need it's going to be able to now be used by our manager agent and then look up information in one of these two tables now let me just quickly run through the entire flow and then we can test it I understand it's small try to zoom in and use Arrow so you guys can kind of see what's going on okay so first things first we have a question right like this is where our flow starts with the input now what we'll do is we will go to the manager agent the manager agent will have these agent instructions that we gave it and it will have access to tools it's going to have access to the order lookup agent and to the FAQ agent and what it's going to do is use these tools maybe one maybe both maybe none depending on what we asked it to give us some kind of response so if we ask it something related to shipment times it's going to go and use the FAQ agent if we ask it something related to our order and we give it an order number it's going to use our order lookup agent if we ask something related to products it's going to use the order lookup agent it's going to take responses from these different agents which are really tools that it's able to use aggregate them together using the llm kind of process the text and then give us some kind of chat output so let's play around with this and let's see if it works can you tell me about order number one 001 by the way the order numbers are 1 0 1 2 3 4 5 and all of the products are like 101 102 2011 203 you can see them in the database but if you just want to test it use these IDs so you can see we're able to find that information about the order and kind of summarize it and give it to us sweet so we can keep testing this and messing around with it but what I want to show you now is how we run this with a custom front end so how we actually use this from something like our python code how we send an API request and take what's on the web now and use it in a real application and by the way this is just kind of an updated version of the flow I just rearranged it so it's a little bit easier to understand and you can kind of see what's going on if you download this I'm going to add some comments to it so it'll make a little bit more sense but now what I want to do is hop into a code editor uh and start writing some code so if you go to this API tab here you'll see that it's going to give you a bunch of different ways to actually trigger this flow from code so we have python API we have python code so you can actually just download this flows Json file and you can run it directly using langlow you do need to install that first and then you have the JavaScript API as well now what I want to do is I want to use the python API so what I'm going to do is I'm just going to copy all of the content that's inside of this file here just we get all of the variables and stuff that we need and then we'll clean this up and actually convert this into a streamlet applic application so we get a nice simple front end so let's open up a code editor I'm going to go with vs code uh you can see I already got this project open but I'm just going to open a new folder let go file open folder desktop and let's call this uh you know customer agent okay inside of here we're going to make a new python file so let's go full screen main.py and let's paste all of this in okay now there's a few things we need to do so let's start by just cleaning this up a little bit now we're going to keep all of this stuff the base API Lang flow ID flow ID all of that kind of stuff this tweaks uh dictionary we don't need this is just something that we can use to modify the flow when we call the API if we want to do that and we're going to keep this run flow function but for the Run flow function we're just going to take a message and nothing else okay we'll leave what's in here for now but we will kind of adjust that in a second and then we're going to get rid of this main function okay so let's get rid of main let's get rid of the main line and I want to focus on just working in this let me get rid of this comment here this run flow function uh in order to actually call the API we'll just quickly test it and then we will um kind of write out the simple front end okay so what we're going to do is get rid of this Tri catch which we don't need we're going to get rid of warnings typings and then pretty much everything else uh that's up here we don't need Json we don't need ARG pars we just need requests for right now okay now our application token let's get that quickly if we go back to langlow let's open that up you'll see that we can generate a token so let's generate that and copy it let's go back to vs code and let's make a EnV file now in this file we're just going to call this appcore token is equal to and then we can simply paste this token I don't want to reveal it to you so I'm just going to paste it and then leave this file but just make a variable app token and make it equal to this uh this what do you call token that you just copied okay so I've got app tokened inside of there so what I'm going to do now is I'm going to import OS and where I have my application token variable I'm going to load in that token so to do that I'm going to say os. Environ doget and then we're going to get the appcore token like that okay a few more changes to make here inside of the Run flow function we can change the endpoint to Simply say endpoint in all capitals just so that we use this variable right here for the output type and the input type we can change this to chat because we're just going to use the chat input and the chat output that we have there and then we can get rid of these if statements here where it says if tweaks and if application token because we know we're going to have an application token then for our application token we can change this variable to be the constant that we defined up here and that's that's pretty much it for this function I know I went fast but again this code will be available from the link in the description so this run flow function now will allow us to actually call out to langlow and send a request but in order to do that we first just need to install the python modules we're using here so for example we need to install the request module we need to install streamlet and we need to install something called python. EnV so I'm just
going to make a new file called requirements.txt and I'm just going to list these out uh you don't have to do this but I just want you to know what we need to install so we need to install python. EnV streamlet and then requests okay now in order to install this the first thing that I recommend doing is creating a virtual environment however here I'm not going to do that just for Simplicity and to go a little bit faster so I'm simply going to say pip install dasr and then requirements.txt this is going to install the different python modules that we need from this file you also can just manually install these three modules okay so I'm going to run that this is just going to install in my Global python installation again this is not best practice usually you use something like a virtual environment but it's totally fine for what I'm doing and my system right now okay now that we've got that I'm just going to import something in here which will allow me to load in this environment variable file a lot of times in Python if you try to load an environment variable file you'll get an issue and that's because you need to import this you need to say from EnV import load. EnV this will load any
environment variable files that are in the current directory if you call this function so we're going to say from. EnV import load. EnV call the load. EnV function and now when we use os. Environ
doget it will actually look inside of that EnV file that we just made okay so I want to test this before I make my simple streamlit front end and just make sure this function works so first of all let's get rid of that comma and let's call run flow and then what we can pass to this is just a string with the question we want to ask so I can ask something like what are the shipment Ty I know I'm using the same example over and over again it's just the one that's familiar to me okay now to run this we can go python main.py I assume you're familiar with some python code if you've made it this far if not you can just copy this not a huge deal it's not overly complex this is just sending request to the Lang flow API which kind of contains our flow at that customer endpoint so now we're just going to send the request we'll wait a few seconds we'll get a response and then we can print out what that response is so actually let's say result is equal to this and let's print it because if we don't print it we're not going to see anything so we're going to say print result and then when I run this code it will take a few seconds because we are running through a bunch of different llms and then we should get some response and we can print it to the screen and there you go we do notice that it is a little bit complex kind of hard to read because there's like a bunch of stuff here but if you parse through this you can kind of see that it says stuff about shipping like 3 to 5 business days 7 to 14 uh for international and yeah there you go we got the response obviously though this is going to look better if it's in like a nice pretty front end and a form so let me show you how we write that using a really great module in Python called streamlet so first thing we're going to import Json because we're going to need that in one second and we're going to say import streamlet as St okay now we're going to write a function I'm just going to call this Main and this main function will kind of represent our streamlit input I'm going to make this super simple and if you've never seen stream L before you're going to see how easy it is to make a simple UI so I'm going to say st. tile and I'm going to say chat interface okay you can call this whatever you want I'm going to make a message input Box by saying message is equal to st. text area
for this we can just give it a name so I'm going to say message and then I'm going to give this a placeholder so like you know ask something dot dot dot okay then whenever the user types something in that'll get stored in the message variable we're then going to put a button so I'm going to say if st. button and for the button we'll just say run flow then what we're going to do is the following we're going to say if not St or sorry not St message. strip this just means remove all of the white space characters then we're going to say st. error and we're going to say please enter a message because we don't want to just be sending spaces we want to make sure they type something in and we're going to return okay so if we return from the function it just means like we're not going to execute this anymore and then we'll call the function again allow the user to try again okay now so if this is the case if we press the button we'll try this if we need to return we'll return otherwise down here we're going to have a try and a catch so we're going to say try and then we're going to say with st. spinner this is like a loading indicator and we can say as the text here running flow then we're going to say the response is equal to run flow and we can simply pass the message to this function that we already tested and we know works okay then we can say response is equal to response and what I'm going to do is just show you how we can grab just the textual response because this gives us a ton of information that we don't need so to do that we're going to say response at outputs at index0 and then this is going to be outputs and then this is going to be index zero again and then this is going to be results and then this is going to be message and then this is going to be text text okay now this is going to be markdown text that we can simply render to the screen so I can say st.
markdown and then we can take that response and show it on screen and then we can take this accept we can say accept exception as e and we can say st. error and we can simply display the string e as the error message I know I went kind of fast there I'm just trying to make this front end pretty quickly okay so this whole kind of mass of you know outputs outputs zero bra message text this is just how we parse through the Json that's returned to us to just get the text to our question because there's a lot of information return there so if you want you can look at the payload and you can see all the stuff that's in there but I'm just giving you the shortcut to just get to the text okay so now rather than calling result with run flow we're just going to say if uncore name uncore uncore equals uncore maincore uncore then run the main function and when we run the main function it will run this streamlet app and sorry we actually don't need the Json module anymore and we should be able to use our flow so to run the streamlet app we can type streamlet run and then the name of our file which is main.py assuming this is in the same directory it will run this application as a streamlet UI and then open this up in our web browser so you can see that it just got open to me here and I can say now you know what is the cancellation policy on orders okay and we can run flow and we can see if we get a response okay so you can see that we get our reply here it says if you need to make changes or cancel your order please contact change of cancellation may not be possible if the order has already been processed sweet and then of course we can continue testing this out and use it but I just want to show you how we spin up that simple front end to work with the project so now we have all of our AI that we built here in langlow we have this simple UI that I just built in Python in like 2 or 3 minutes and we're using the langlow API to run this now another option we have I'm not going to walk you through this but I want to explain it to you is we can just run this code locally so if you want to you can simply install laying flow on your own machine you can download this flow as a Json file which I'm going to do in one second when I add it to the GitHub and then you can just run the flow like this and you can pass the input value of whatever you want that way you can run it all completely locally from your own computer and you don't need to rely on the Lang flow kind of like web instance or API in order for this to work all right so we are almost done but I'm just going to mention one other thing that you might find interesting so when we do this pral augmented generation lookup often times we might actually want to weigh the results so it's possible that we want to get things that are maybe more relevant maybe our FAQ has been updated and we want data that was most recently posted or we want something that is kind of based on some ranking right there's a lot of times where we want to weigh our responses and get some better more contextually relevant results now in order to do that you can actually do it in langlow it's a little bit more complex and I'm going to share with you this article Beyond basic rag retrieval waiting so this is something that you might want to look into if you want to get better replies you can see here Lang flow and it kind of talks about how this works how you can use it what weighing actually is and how to make sure you're getting the best responses um what do you call it for the kind of retrieval augmented generation search that you're doing so definitely check this out it's going to improve the accuracy of the AI systems that you build especially when it comes to Rag and I will leave this link in the description with that said though that will wrap it up if you guys enjoyed make sure you leave a like subscribe to the channel Channel and I will see you in the next one [Music]
2024-12-23 19:31