agentskit.js
Getting Started

Quick start

Build a working AI chat in under 10 lines.

Basic chat

app/chat.tsx
import { useChat, ChatContainer, Message, InputBar } from '@agentskit/react'
import { anthropic } from '@agentskit/adapters'
import '@agentskit/react/theme'

function App() {
  const chat = useChat({
    adapter: anthropic({ apiKey: 'your-key', model: 'claude-sonnet-4-6' }),
  })

  return (
    <ChatContainer>
      {chat.messages.map(msg => (
        <Message key={msg.id} message={msg} />
      ))}
      <InputBar chat={chat} />
    </ChatContainer>
  )
}

What you got

ComponentRole
useChatA chat session bound to an adapter; manages messages, streaming, errors
ChatContainerAuto-scrolling layout
MessageRenders one message with streaming support
InputBarText input that sends on Enter

Out of the box: streaming, message history, default styling. No extra setup.

Swap providers

The adapter is the only thing that changes. Everything else stays the same.

import { openai } from '@agentskit/adapters'

const chat = useChat({
  adapter: openai({ apiKey: 'your-key', model: 'gpt-4o' }),
})

This is the plug-and-play principle in practice — no rewrites for a provider swap.

Try the official examples

  • apps/example-react — full chat with tool calls and memory
  • apps/example-ink — same chat in your terminal
  • apps/example-runtime — autonomous agent (no UI)
  • apps/example-multi-agent — supervisor + workers
✎ Edit this page on GitHub·Found a problem? Open an issue →·How to contribute →

On this page