LangGraph Studio TypeScript Starter (Beta)

This is a sample project to help you get started with developing LangGraph.js projects in LangGraph Studio.

It contains a simple example graph exported from src/agent.ts that implements a basic ReAct pattern where the model can use tools for more information before responding to a user query, as well as the required langgraph.json for opening the graph in LangGraph Studio.

Getting Started

Clone this repository.
Rename the existing .env.example file .env and fill in your OPENAI_API_KEY.
Download the latest release of LangGraph Studio from here.
Open the enclosing folder in LangGraph Studio.
Start testing your app!

The graph has access to a basic Wikipedia tool which does not require additional authentication - you can try asking it about current events like "What is the current conservation status of the Great Barrier Reef?" and see it use the tool.

Development

While iterating on your graph, you can edit past state and rerun your app from past states to debug specific nodes. Local changes will be automatically applied via hot reload. Try adding an interrupt before the agent calls tools, updating the prompt to take on a persona, or adding additional nodes and edges!

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.

LangGraph Studio also integrates with LangSmith for more in-depth tracing and collaboration with teammates.

You can swap in other models if you'd like by using the appropriate LangChain.js integration package or the appropriate SDK directly.