CopilotKit

Quickstart

Turn your LangGraph agent into an agent-native application in 10 minutes.

Ship LangGraph to production
Add persistent threads and the inspector with the Enterprise Intelligence Platform.
Create a free account

Prerequisites#

Before you begin, you'll need the following:

  • An OpenAI API key
  • Node.js 20+
  • Your favorite package manager
  • (Optional) A LangSmith API key - only required if using an existing LangGraph agent

Getting started#

Create a free account#

Sign up for a free developer account on our Enterprise Intelligence Platform to get a license key. You'll use it later to enable persistent threads and the inspector.

Choose your starting point#

You can either start fresh with our starter template or integrate CopilotKit into your existing LangGraph agent.

🎉 Start chatting!#

Your AI agent is now ready to use! Try asking it some questions:

Can you tell me a joke?
Can you help me understand AI?
What do you think about React?
Troubleshooting

  • Connection issues? Keep localhost, don't swap in a literal IP. Which loopback address reaches the agent depends on the runtime, and 0.0.0.0 is a bind-all address for a server, never a valid target in a client URL.

    langgraph dev (the Python CLI) defaults to --host 127.0.0.1, so both http://127.0.0.1:8123 and http://localhost:8123 reach it. http://[::1]:8123 does not — the server is not listening on IPv6.

    @langchain/langgraph-cli (the langgraphjs binary) defaults to --host localhost, which Node resolves to IPv6 on a dual-stack machine, binding ::1 only. So http://localhost:8123 and http://[::1]:8123 reach it, while http://127.0.0.1:8123 is refused by that same running server — switching to 127.0.0.1 is what breaks it. If you need IPv4, bind it explicitly with langgraphjs dev --host 127.0.0.1.

  • Make sure your agent folder contains a langgraph.json file

  • In the langgraph.json file, reference the path to a .env file

  • Check that your OpenAI API key is correctly set in the .env file

  • If using an existing agent, ensure your LangSmith API key is also configured

  • Make sure you're in the same folder as your langgraph.json file when running the langgraph dev command

  • Connection refused from the runtime? Check the port. A bare langgraph dev listens on 2024; this guide's start command pins 8123 with --port 8123. The runtime's LANGGRAPH_DEPLOYMENT_URL (or its fallback) has to name the port the agent actually bound.

  • "graph is nullish" error (JavaScript starters): This means the LangGraph CLI couldn't load your graph. Ensure the export name in your langgraph.json matches your code (e.g., "starterAgent": "./src/agent.ts:graph" requires export const graph = ... in agent.ts). Also verify all dependencies are installed with npm install in your agent directory.

  • Make sure the runtime endpoint path matches the runtimeUrl in your CopilotKit provider

Open Inspector and confirm setup#

On localhost, click the Inspector button in the corner of the app.

  1. Open Agents, then Agent. Your agent is listed.
  2. Send a chat message. Open Agents, then AG-UI Events. Events are moving.
  3. Open Threads. The list is unlocked (Intelligence is on), or locked with Enable Intelligence (Intelligence is off).

More detail: Inspector.

Deploying to AWS?#

If you're planning to deploy your LangGraph agent to AWS Bedrock AgentCore, see the AgentCore deploy guide.

What's next?#

Now that you have your basic agent setup, explore these advanced features:

Implement Human in the Loop

Allow your users and agents to collaborate together on tasks.

Utilize Shared State

Learn how to synchronize your agent's state with your UI's state, and vice versa.

Add some generative UI

Render your agent's progress and output in the UI.

Setup frontend actions

Give your agent the ability to call frontend tools, directly updating your application.