From the course: Level up LLM applications development with LangChain and OpenAI

Adding functionality with Streamlit

From the course: Level up LLM applications development with LangChain and OpenAI

Start my 1-month free trial Buy for my team

Adding functionality with Streamlit

“

- [Instructor] Okay, so, so far, so good. So what we have is this layout that we have defined. So we're going to check this one out to see how nice it looks. And what they have to do is also to connect this Streamlit application, this interactive app, to the logic that we have created previously. And that's going to be exactly here. So you see that I've added comments to make things clearer. In line 44, this is where we're going to add and connect our app to the logic. We're going to add functionality to generate responses. So for now, I just want to show you how it looks by running streamlit run app.py. So after creating this nicely layout, so we want to see how it looks in the browser. All right, so here you can see that we have now a text field, we can enter, so type our user inputs. We can, for example, ask what are the opening hours, but for now it's not connected to any logic. So we're not going to send it. So we can press here to send the question, but it's not connected to anything. I mean we could try, but we are not going to get anything back. And actually it's saying that response is not defined. True, okay, so now we have an empty response and we're going to need to complete this part. So let's do that. And what we want is to go back up to just make sure that we import from the right file here. So what we had done, so let's go back, we have the query here where we define all the logic in order to create an agent, which is context aware, but also chat history aware. So we want to import this from here and remember that we were returning the response, but that also, so if we check from the previous example, so on the main.py, we need to specify here "answer". So we want to access the answer from the assistant. Okay, so let's do that. So we can actually have an application which is up and running. So that's going to be response, then we're going to query and then pass prompts as a parameter. And next we want to display the answer from the assistant and also add the response. So from the same assistant and append it in the session state messages, we're going to append this so it can retrieve and then display the chat history. So that's just for the visual, this part. Okay, so let's run this. And this time we're going to be able to make an actual demonstration, a real demonstration by interacting with the app. All right, so let's ask the same question again. "What are the opening hours?" Okay, so it's going to be displaced, then we can expect the answer. And that looks super nice. So here we get the answer from the assistants, just like we were expecting, "Red30 Shoes brick and mortar stores are open from 9:00 AM to 8:00 PM," which is exactly what we were expecting. This corresponds to the data source, the same data source that we've been using and added to the vector database. All right, so let's try to ask another question. Like for example, "What is the return policy?" And again, so we've got the exact answer as we were expecting. So, "Red30 Shoes accepts all returns within 30 days of purchase." This is excellent and the layout looks super nice. So for this app built with Streamlit, so let me run another test, a simple test just to check the chat history functionality. So I'm going to say, "What was my last question?" I don't know if I can ask my first question just to try. We could try. "What was my first question?" So it should be like very, very, like aware, "What are the opening hours?" Perfect. So not only can remember, like, the chat history, but it can actually think of where to find one specific question. So where to find the exact context based on the chat history. This is wonderful. So I like the results, the layout that we have just built. So Streamlit is an excellent choice to showcase and share your work with the word. And it is also perfectly suited for generative AI with its simple API, real-time visualizations, and its interactive abilities, and user friendly interfaces. And actually you can find here more components, here a documentation with more examples, with tutorials. And you're going to find one where you can actually create, here, a chat app with language models. So this is the perfect choice whenever you want to create an interactive app, which is driven by AI. And we're going to see next how we can actually share this work, this nice work with this nice layout with the world by deploying our app. And we're going to do that next with a challenge.

Contents