Docs: refactor starter flows (#5384)
* refactor: Update documentation links and restructure starter projects to use cases * feat: Add new redirects for use cases in Docusaurus configuration * lint * force-menu-collapse * change-usecase-to-tutorial
This commit is contained in:
parent
b2e7476d3b
commit
2c819dc0a4
11 changed files with 45 additions and 21 deletions
|
|
@ -1 +0,0 @@
|
|||
{"position":2, "label":"Starter Projects"}
|
||||
|
|
@ -1,59 +0,0 @@
|
|||
---
|
||||
title: Blog Writer
|
||||
sidebar_position: 1
|
||||
slug: /starter-projects-blog-writer
|
||||
---
|
||||
|
||||
Build a Blog Writer flow for a one-shot application using OpenAI.
|
||||
|
||||
This flow extends the Basic Prompting flow with the **URL** and **Parse data** components that fetch content from multiple URLs and convert the loaded data into plain text.
|
||||
|
||||
OpenAI uses this loaded data to generate a blog post, as instructed by the **Text input** component.
|
||||
|
||||
|
||||
## Prerequisites {#899268e6c12c49b59215373a38287507}
|
||||
|
||||
|
||||
---
|
||||
|
||||
- [Langflow installed and running](/get-started-installation)
|
||||
- [OpenAI API key created](https://platform.openai.com/)
|
||||
|
||||
|
||||
## Create the blog writer flow {#0c1a9c65b7d640f693ec3aad963416ff}
|
||||
|
||||
1. From the Langflow dashboard, click **New Flow**.
|
||||
2. Select **Blog Writer**.
|
||||
3. The **Blog Writer** flow is created.
|
||||
|
||||

|
||||
|
||||
|
||||
This flow creates a one-shot article generator with **Prompt**, **OpenAI**, and **Chat Output** components, augmented with reference content and instructions from the **URL** and **Text Input** components.
|
||||
|
||||
The **URL** component extracts raw text and metadata from one or more web links.
|
||||
The **Parse Data** component converts the data coming from the **URL** component into plain text to feed the prompt.
|
||||
|
||||
To examine the flow's prompt, click the **Template** field of the **Prompt** component.
|
||||
|
||||
```plain
|
||||
Reference 1:
|
||||
|
||||
{references}
|
||||
|
||||
---
|
||||
|
||||
{instructions}
|
||||
|
||||
Blog:
|
||||
```
|
||||
|
||||
The `{instructions}` value is received from the **Text input** component, and one or more `{references}` are received from a list of URLs parsed from the **URL** component.
|
||||
|
||||
|
||||
### Run the blog writer flow {#b93be7a567f5400293693b31b8d0f81a}
|
||||
|
||||
1. Click the **Playground** button. Here you can chat with the AI that has access to the **URL** content.
|
||||
2. Click the **Lighting Bolt** icon to run it.
|
||||
3. To write about something different, change the values in the **URL** component and adjust the instructions on the left side bar of the **Playground**. Try again and see what the LLM constructs.
|
||||
|
||||
|
|
@ -1,42 +0,0 @@
|
|||
---
|
||||
title: Document QA
|
||||
sidebar_position: 2
|
||||
slug: /starter-projects-document-qa
|
||||
---
|
||||
|
||||
|
||||
|
||||
Build a question-and-answer chatbot with a document loaded from local memory.
|
||||
|
||||
|
||||
## Prerequisites {#6555c100a30e4a21954af25e2e05403a}
|
||||
|
||||
|
||||
---
|
||||
|
||||
- [Langflow installed and running](/get-started-installation)
|
||||
- [OpenAI API key created](https://platform.openai.com/)
|
||||
|
||||
|
||||
## Create the document QA flow {#204500104f024553aab2b633bb99f603}
|
||||
|
||||
1. From the Langflow dashboard, click **New Flow**.
|
||||
2. Select **Document QA**.
|
||||
3. The **Document QA** flow is created.
|
||||
|
||||

|
||||
|
||||
|
||||
This flow is composed of a standard chatbot with the **Chat Input**, **Prompt**, **OpenAI**, and **Chat Output** components, but it also incorporates a **File** component, which loads a file from your local machine. **Parse Data** is used to convert the data from **File** into the **Prompt** component as `{Document}`. The **Prompt** component is instructed to answer questions based on the contents of `{Document}`. This gives the **OpenAI** component context it would not otherwise have access to.
|
||||
|
||||
|
||||
### Run the document QA flow {#f58fcc2b9e594156a829b1772b6a7191}
|
||||
|
||||
|
||||
1. To select a document to load, in the **File** component, click the **Path** field. Select a local file, and then click **Open**. The file name appears in the field.
|
||||
|
||||
2. Click the **Playground** button. Here you can chat with the AI that has access to your document's content.
|
||||
|
||||
|
||||
3. Type in a question about the document content and press Enter. You should see a contextual response.
|
||||
|
||||
|
|
@ -1,77 +0,0 @@
|
|||
---
|
||||
title: Memory Chatbot
|
||||
sidebar_position: 3
|
||||
slug: /starter-projects-memory-chatbot
|
||||
---
|
||||
|
||||
|
||||
|
||||
This flow extends the [basic prompting](/starter-projects-basic-prompting) flow to include a chat memory. This makes the AI remember previous user inputs.
|
||||
|
||||
|
||||
## Prerequisites {#a71d73e99b1543bbba827207503cf31f}
|
||||
|
||||
|
||||
---
|
||||
|
||||
- [Langflow installed and running](/get-started-installation)
|
||||
- [OpenAI API key created](https://platform.openai.com/)
|
||||
|
||||
|
||||
## Create the memory chatbot flow
|
||||
|
||||
1. From the Langflow dashboard, click **New Flow**.
|
||||
2. Select **Memory Chatbot**.
|
||||
3. The **Memory Chatbot** flow is created.
|
||||
|
||||

|
||||
|
||||
|
||||
This flow uses the same components as the Basic Prompting one, but extends it with a **Chat Memory** component. This component retrieves previous messages and sends them to the **Prompt** component to fill a part of the **Template** with context.
|
||||
|
||||
|
||||
By clicking the template, you'll see the prompt editor like below:
|
||||
|
||||
|
||||
This gives the **OpenAI** component a memory of previous chat messages.
|
||||
|
||||
|
||||
## Run the memory chatbot flow
|
||||
|
||||
1. Open the Playground.
|
||||
2. Type multiple questions. In the **Memories** tab, your queries are logged in order. Up to 100 queries are stored by default. Try telling the AI your name and asking `What is my name?` on a second message, or `What is the first subject I asked you about?` to validate that previous knowledge is taking effect.
|
||||
|
||||
:::tip
|
||||
|
||||
Check and adjust advanced parameters by opening the Advanced Settings of the **Chat Memory** component.
|
||||
|
||||
:::
|
||||
|
||||
|
||||
|
||||
## Use Session ID with the memory chatbot flow {#4e68c3c0750942f98c45c1c45d7ffbbe}
|
||||
|
||||
|
||||
---
|
||||
|
||||
|
||||
`SessionID` is a unique identifier in Langflow that stores conversation sessions between the AI and a user. A `SessionID` is created when a conversation is initiated, and then associated with all subsequent messages during that session.
|
||||
|
||||
|
||||
In the **Memory Chatbot** flow you created, the **Chat Memory** component references past interactions by **Session ID**. You can demonstrate this by modifying the **Session ID** value to switch between conversation histories.
|
||||
|
||||
1. In the **Session ID** field of the **Chat Memory** and **Chat Input** components, add a **Session ID** value like `MySessionID`.
|
||||
2. Now, once you send a new message the **Playground**, you should have a new memory created on the **Memories** tab.
|
||||
3. Notice how your conversation is being stored in different memory sessions.
|
||||
|
||||
:::tip
|
||||
|
||||
Every chat component in Langflow comes with a `SessionID`. It defaults to the flow ID. Explore how changing it affects what the AI remembers.
|
||||
|
||||
:::
|
||||
|
||||
|
||||
|
||||
|
||||
Learn more about memories in the [Chat Memory](/guides-chat-memory) section.
|
||||
|
||||
|
|
@ -1,53 +0,0 @@
|
|||
---
|
||||
title: Sequential tasks agent
|
||||
sidebar_position: 4
|
||||
slug: /starter-projects-sequential-agent
|
||||
---
|
||||
|
||||
Build a **Sequential Tasks Agent** flow for a multi-agent application using multiple **Agent** components.
|
||||
|
||||
Each agent has an LLM model and a unique set of tools at its disposal, with **Prompt** components connected to the **Agent Instructions** fields to control the agent's behavior. For example, the **Researcher Agent** has a **Tavily AI Search** component connected as a tool. The **Prompt** instructs the agent how to answer your query, format the response, and pass the query and research results on to the next agent in the flow.
|
||||
|
||||
Each successive agent in the flow builds on the work of the previous agent, creating a chain of reasoning for solving complex problems.
|
||||
|
||||
## Prerequisites
|
||||
- [An OpenAI API key](https://platform.openai.com/)
|
||||
- [A Tavily AI API key](https://www.tavily.com/)
|
||||
|
||||
## Open Langflow and create a new flow
|
||||
|
||||
1. Click **New Flow**, and then select **Sequential Tasks Agent**.
|
||||
This opens a starter template with the necessary components to run the flow.
|
||||
|
||||

|
||||
|
||||
The Sequential Tasks Agent flow consists of these components:
|
||||
|
||||
* The **Agent** components use the connected LLM to analyze the user's input and select among the connected tools to complete the tasks.
|
||||
* The **Chat Input** component accepts user input to the chat.
|
||||
* The **Prompt** component combines the user input with a user-defined prompt.
|
||||
* The **Chat Output** component prints the flow's output to the chat.
|
||||
* The **YFinance** tool component provides access to financial data from Yahoo Finance.
|
||||
* The **Tavily AI Search** tool component performs AI-powered web searches.
|
||||
* The **Calculator** tool component performs mathematical calculations.
|
||||
|
||||
## Run the Sequential Tasks Agent flow
|
||||
|
||||
1. Add your OpenAI API key to the **Agent** components.
|
||||
2. Add your Tavily API key to the **Tavily** component.
|
||||
3. Click **Playground** to start a chat session with the template's default question.
|
||||
|
||||
```plain
|
||||
Should I invest in Tesla (TSLA) stock right now?
|
||||
Please analyze the company's current position, market trends,
|
||||
financial health, and provide a clear investment recommendation.
|
||||
```
|
||||
|
||||
This question provides clear instructions to the agents about how to proceed and what question to answer.
|
||||
|
||||
4. In the **Playground**, inspect the answers to see how the agents use the **Tavily AI Search** tool to research the query, the **YFinance** tool to analyze the stock data, and the **Calculator** to determine if the stock is a wise investment.
|
||||
5. Ask similar questions to see how the agents use the tools to answer your queries.
|
||||
|
||||
## Next steps
|
||||
|
||||
To create your own multi-agent flow, see [Create a problem solving agent](/agents-tool-calling-agent-component).
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
---
|
||||
title: Travel planning agent
|
||||
sidebar_position: 8
|
||||
slug: /starter-projects-travel-planning-agent
|
||||
---
|
||||
|
||||
Build a **Travel Planning Agent** flow for an agentic application using the multiple Tool-calling agents.
|
||||
|
||||
An **agent** uses an LLM as its "brain" to select among the connected tools and complete its tasks.
|
||||
|
||||
In this flow, multiple **Tool-calling agents** reason using an **Open AI** LLM to plan a travel journey. Each agent is given a different responsibility defined by its **System Prompt** field.
|
||||
|
||||
The **Chat input** defines where the user wants to go, and passes the result to the **City Selection** agent. The **Local Expert** agent then adds information based on the selected cities, and the **Travel Concierge** assembles a seven day travel plan in Markdown.
|
||||
|
||||
All agents have access to the **Search API** and **URL Content Fetcher** components, while only the Travel Concierge can use the **Calculator** for computing the trip costs.
|
||||
|
||||
## Prerequisites
|
||||
|
||||
To use this flow, you need an [OpenAI API key](https://platform.openai.com/) and a [Search API key](https://www.searchapi.io/).
|
||||
|
||||
## Open Langflow and start a new flow
|
||||
|
||||
Click **New Flow**, and then select the **Travel Planning Agent** flow.
|
||||
|
||||
This opens a starter flow with the necessary components to run an agentic application using multiple Tool-calling agents.
|
||||
|
||||
## Create the travel planning agent flow
|
||||
|
||||

|
||||
|
||||
The **Travel Planning Agent** flow consists of these components:
|
||||
|
||||
* Multiple **Tool calling agent** components that use the connected LLM to reason through the user's input and select among the connected tools to complete their tasks.
|
||||
* The **Calculator** component performs basic arithmetic operations.
|
||||
* The **URL Content Fetcher** component scrapes content from a given URL.
|
||||
* The **Chat Input** component accepts user input to the chat.
|
||||
* The **Chat Output** component prints the flow's output to the chat.
|
||||
* The **OpenAI** model component sends the user input and prompt to the OpenAI API and receives a response.
|
||||
|
||||
## Run the travel planning agent flow
|
||||
|
||||
1. Add your credentials to the Open AI and Search API components.
|
||||
2. In the **Chat output** component, click ▶️ Play to start the end-to-end application flow.
|
||||
A **Chat output built successfully** message and a ✅ Check on all components indicate that the flow ran successfully.
|
||||
3. Click **Playground** to start a chat session.
|
||||
You should receive a detailed, helpful answer to the journey defined in the **Chat input** component.
|
||||
|
||||
Now that your query has completed the journey from **Chat input** to **Chat output**, you have completed the **Travel Planning Agent** flow.
|
||||
Loading…
Add table
Add a link
Reference in a new issue