mirror of
https://github.com/langchain-ai/langgraph.git
synced 2026-09-30 13:35:09 +02:00
x
This commit is contained in:
Eugene Yurtsev
@@ -11,6 +11,8 @@ hide:
|
||||
|
||||
This guide shows you how to set up and use LangGraph's **prebuilt**, **reusable** components, which are designed to help you construct agentic systems quickly and reliably.
|
||||
|
||||
:::python
|
||||
|
||||
## Prerequisites
|
||||
|
||||
Before you start this tutorial, ensure you have the following:
|
||||
@@ -228,3 +230,244 @@ response["structured_response"]
|
||||
- [Deploy your agent locally](../tutorials/langgraph-platform/local-server.md)
|
||||
- [Learn more about prebuilt agents](../agents/overview.md)
|
||||
- [LangGraph Platform quickstart](../cloud/quick_start.md)
|
||||
|
||||
:::
|
||||
|
||||
:::js
|
||||
|
||||
## Prerequisites
|
||||
|
||||
Before you start this tutorial, ensure you have the following:
|
||||
|
||||
- An [Anthropic](https://console.anthropic.com/settings/keys) API key
|
||||
|
||||
## 1. Install dependencies
|
||||
|
||||
If you haven't already, install LangGraph and LangChain:
|
||||
|
||||
```
|
||||
npm install langchain @langchain/langgraph @langchain/anthropic
|
||||
```
|
||||
|
||||
## 2. Create an agent
|
||||
|
||||
Use [`createReactAgent`](/langgraphjs/reference/functions/langgraph_prebuilt.createReactAgent.html) to instantiate an agent:
|
||||
|
||||
```ts
|
||||
import { createReactAgent } from "@langchain/langgraph/prebuilt";
|
||||
import { initChatModel } from "langchain/chat_models/universal";
|
||||
import { tool } from "@langchain/core/tools";
|
||||
import { z } from "zod";
|
||||
|
||||
const getWeather = tool( // (1)!
|
||||
async (input: { city: string }) => {
|
||||
return `It's always sunny in ${input.city}!`;
|
||||
},
|
||||
{
|
||||
name: "getWeather",
|
||||
schema: z.object({
|
||||
city: z.string().describe("The city to get the weather for"),
|
||||
}),
|
||||
description: "Get weather for a given city.",
|
||||
}
|
||||
);
|
||||
|
||||
const llm = await initChatModel("anthropic:claude-3-7-sonnet-latest"); // (2)!
|
||||
const agent = createReactAgent({
|
||||
llm,
|
||||
tools: [getWeather], // (3)!
|
||||
prompt: "You are a helpful assistant", // (4)!
|
||||
});
|
||||
|
||||
// Run the agent
|
||||
await agent.invoke({
|
||||
messages: [{ role: "user", content: "what is the weather in sf" }],
|
||||
});
|
||||
```
|
||||
|
||||
1. Define a tool for the agent to use. For more advanced tool usage and customization, check the [tools](./tools.md) page.
|
||||
2. Provide a language model for the agent to use. To learn more about configuring language models for the agents, check the [models](./models.md) page.
|
||||
3. Provide a list of tools for the model to use.
|
||||
4. Provide a system prompt (instructions) to the language model used by the agent.
|
||||
|
||||
## 3. Configure an LLM
|
||||
|
||||
Use [`initChatModel`](https://api.js.langchain.com/functions/langchain.chat_models_universal.initChatModel.html) to configure an LLM with specific parameters, such as temperature:
|
||||
|
||||
```ts
|
||||
import { createReactAgent } from "@langchain/langgraph/prebuilt";
|
||||
import { initChatModel } from "langchain/chat_models/universal";
|
||||
|
||||
// highlight-next-line
|
||||
const llm = await initChatModel("anthropic:claude-3-7-sonnet-latest", {
|
||||
// highlight-next-line
|
||||
temperature: 0,
|
||||
});
|
||||
|
||||
const agent = createReactAgent({
|
||||
// highlight-next-line
|
||||
llm,
|
||||
tools: [getWeather],
|
||||
});
|
||||
```
|
||||
|
||||
See the [models](./models.md) page for more information on how to configure LLMs.
|
||||
|
||||
## 4. Add a custom prompt
|
||||
|
||||
Prompts instruct the LLM how to behave. They can be:
|
||||
|
||||
- **Static**: A string is interpreted as a **system message**
|
||||
- **Dynamic**: a list of messages generated at **runtime** based on input or configuration
|
||||
|
||||
=== "Static prompt"
|
||||
|
||||
Define a fixed prompt string or list of messages.
|
||||
|
||||
```ts
|
||||
import { createReactAgent } from "@langchain/langgraph/prebuilt";
|
||||
import { initChatModel } from "langchain/chat_models/universal";
|
||||
|
||||
const llm = await initChatModel("anthropic:claude-3-7-sonnet-latest");
|
||||
const agent = createReactAgent({
|
||||
llm,
|
||||
tools: [getWeather],
|
||||
// A static prompt that never changes
|
||||
// highlight-next-line
|
||||
prompt: "Never answer questions about the weather.",
|
||||
});
|
||||
|
||||
await agent.invoke({
|
||||
messages: "what is the weather in sf",
|
||||
});
|
||||
```
|
||||
|
||||
=== "Dynamic prompt"
|
||||
|
||||
Define a function that returns a message list based on the agent's state and configuration:
|
||||
|
||||
```ts
|
||||
import { BaseMessageLike } from "@langchain/core/messages";
|
||||
import { RunnableConfig } from "@langchain/core/runnables";
|
||||
import { initChatModel } from "langchain/chat_models/universal";
|
||||
import { MessagesAnnotation } from "@langchain/langgraph";
|
||||
import { createReactAgent } from "@langchain/langgraph/prebuilt";
|
||||
|
||||
const prompt = (
|
||||
state: typeof MessagesAnnotation.State,
|
||||
config: RunnableConfig
|
||||
): BaseMessageLike[] => { // (1)!
|
||||
const userName = config.configurable?.userName;
|
||||
const systemMsg = `You are a helpful assistant. Address the user as ${userName}.`;
|
||||
return [{ role: "system", content: systemMsg }, ...state.messages];
|
||||
};
|
||||
|
||||
const llm = await initChatModel("anthropic:claude-3-7-sonnet-latest");
|
||||
const agent = createReactAgent({
|
||||
llm,
|
||||
tools: [getWeather],
|
||||
// highlight-next-line
|
||||
prompt,
|
||||
});
|
||||
|
||||
await agent.invoke(
|
||||
{ messages: [{ role: "user", content: "what is the weather in sf" }] },
|
||||
// highlight-next-line
|
||||
{ configurable: { userName: "John Smith" } }
|
||||
);
|
||||
```
|
||||
|
||||
1. Dynamic prompts allow including non-message [context](./context.md) when constructing an input to the LLM, such as:
|
||||
|
||||
- Information passed at runtime, like a `userId` or API credentials (using `config`).
|
||||
- Internal agent state updated during a multi-step reasoning process (using `state`).
|
||||
|
||||
Dynamic prompts can be defined as functions that take `state` and `config` and return a list of messages to send to the LLM.
|
||||
|
||||
For more information, see [Context](./context.md).
|
||||
|
||||
## 5. Add memory
|
||||
|
||||
To allow multi-turn conversations with an agent, you need to enable [persistence](../concepts/persistence.md) by providing a `checkpointer` when creating an agent. At runtime you need to provide a config containing `thread_id` — a unique identifier for the conversation (session):
|
||||
|
||||
```ts
|
||||
import { createReactAgent } from "@langchain/langgraph/prebuilt";
|
||||
import { MemorySaver } from "@langchain/langgraph-checkpoint";
|
||||
import { initChatModel } from "langchain/chat_models/universal";
|
||||
|
||||
// highlight-next-line
|
||||
const checkpointer = new MemorySaver();
|
||||
|
||||
const llm = await initChatModel("anthropic:claude-3-7-sonnet-latest");
|
||||
const agent = createReactAgent({
|
||||
llm,
|
||||
tools: [getWeather],
|
||||
// highlight-next-line
|
||||
checkpointer, // (1)!
|
||||
});
|
||||
|
||||
// Run the agent
|
||||
// highlight-next-line
|
||||
const config = { configurable: { thread_id: "1" } };
|
||||
const sfResponse = await agent.invoke(
|
||||
{ messages: [{ role: "user", content: "what is the weather in sf" }] },
|
||||
config // (2)!
|
||||
);
|
||||
const nyResponse = await agent.invoke(
|
||||
{ messages: [{ role: "user", content: "what about new york?" }] },
|
||||
config
|
||||
);
|
||||
```
|
||||
|
||||
1. `checkpointer` allows the agent to store its state at every step in the tool calling loop. This enables [short-term memory](./memory.md#short-term-memory) and [human-in-the-loop](./human-in-the-loop.md) capabilities.
|
||||
2. Pass configuration with `thread_id` to be able to resume the same conversation on future agent invocations.
|
||||
|
||||
When you enable the checkpointer, it stores agent state at every step in the provided checkpointer database (or in memory, if using `InMemorySaver`).
|
||||
|
||||
Note that in the above example, when the agent is invoked the second time with the same `thread_id`, the original message history from the first conversation is automatically included, together with the new user input.
|
||||
|
||||
For more information, see [Memory](./memory.md).
|
||||
|
||||
## 6. Configure structured output
|
||||
|
||||
To produce structured responses conforming to a schema, use the `responseFormat` parameter. The schema can be defined with a `zod` schema. The result will be accessible via the `structuredResponse` field.
|
||||
|
||||
```ts
|
||||
import { z } from "zod";
|
||||
import { createReactAgent } from "@langchain/langgraph/prebuilt";
|
||||
import { initChatModel } from "langchain/chat_models/universal";
|
||||
|
||||
const WeatherResponse = z.object({
|
||||
conditions: z.string(),
|
||||
});
|
||||
|
||||
const llm = await initChatModel("anthropic:claude-3-7-sonnet-latest");
|
||||
const agent = createReactAgent({
|
||||
llm,
|
||||
tools: [getWeather],
|
||||
// highlight-next-line
|
||||
responseFormat: WeatherResponse, // (1)!
|
||||
});
|
||||
|
||||
const response = await agent.invoke({
|
||||
messages: [{ role: "user", content: "what is the weather in sf" }],
|
||||
});
|
||||
// highlight-next-line
|
||||
response.structuredResponse;
|
||||
```
|
||||
|
||||
1. When `responseFormat` is provided, a separate step is added at the end of the agent loop: agent message history is passed to an LLM with structured output to generate a structured response.
|
||||
|
||||
To provide a system prompt to this LLM, use an object `{ prompt, schema }`, e.g., `responseFormat: { prompt, schema: WeatherResponse }`.
|
||||
|
||||
!!! Note "LLM post-processing"
|
||||
|
||||
Structured output requires an additional call to the LLM to format the response according to the schema.
|
||||
|
||||
## Next steps
|
||||
|
||||
- [Deploy your agent locally](../tutorials/langgraph-platform/local-server.md)
|
||||
- [Learn more about prebuilt agents](../agents/overview.md)
|
||||
- [LangGraph Platform quickstart](../cloud/quick_start.md)
|
||||
|
||||
:::
|
||||
Reference in New Issue
Block a user