langgraph/libs/cli/js-examples

New LangGraph.js Project

This template demonstrates a simple chatbot implemented using LangGraph.js, designed for LangGraph Studio. The chatbot maintains persistent chat memory, allowing for coherent conversations across multiple interactions.

The core logic, defined in src/agent/graph.ts, showcases a straightforward chatbot that responds to user queries while maintaining context from previous messages.

🤔 What is this?

The simple chatbot:

1. Takes a user message as input
2. Maintains a history of the conversation
3. Returns a placeholder response, updating the conversation history

This template provides a foundation that can be easily customized and extended to create more complex conversational agents.

📖 Documentation

For JavaScript and TypeScript documentation, see the LangGraph.js docs. LangGraph Studio also integrates with LangSmith for tracing and collaboration with teammates.

Getting Started

Assuming you have already installed LangGraph Studio, to set up:

1. Create a .env file. This template does not require any environment variables by default, but you will likely want to add some when customizing.

cp .env.example .env

2. Open the folder in LangGraph Studio!
3. Customize the code as needed.

How to customize

1. Add an LLM call: You can select and install a chat model wrapper from the LangChain.js ecosystem, or use LangGraph.js without LangChain.js.
2. Extend the graph: The core logic of the chatbot is defined in graph.ts. You can modify this file to add new nodes, edges, or change the flow of the conversation.

You can also extend this template by:

• Adding custom tools or functions to enhance the chatbot's capabilities.
• Implementing additional logic for handling specific types of user queries or tasks.
• Add retrieval-augmented generation (RAG) capabilities by integrating external APIs or databases to provide more customized responses.

Development

While iterating on your graph, you can edit past state and rerun your app from previous states to debug specific nodes. Local changes will be automatically applied via hot reload. Try experimenting with:

• Modifying the system prompt to give your chatbot a unique personality.
• Adding new nodes to the graph for more complex conversation flows.
• Implementing conditional logic to handle different types of user inputs.

Follow-up requests will be appended to the same thread. You can create an entirely new thread, clearing previous history, using the + button in the top right.

For more advanced features and examples, refer to the LangGraph.js documentation. These resources can help you adapt this template for your specific use case and build more sophisticated conversational agents.

LangGraph Studio also integrates with LangSmith for more in-depth tracing and collaboration with teammates, allowing you to analyze and optimize your chatbot's performance.