Skip to content
AI Primer

setup

assistant-uiby assistant-ui5 months ago28

Installs and configures assistant-ui with the `assistant-ui` CLI (`create`, `init`, `add`, `update`, `upgrade`, `codemod`, `doctor`, `info`, `mcp`, `agent`) and picks the runtime adapter for a backend. Use for first-time install (`npx assistant-ui@latest create`, templates, `--example` scaffolds), adding to an existing Next.js app (`init`), or keeping an install current. Covers the runtime hook per backend: `useChatRuntime` (AI SDK v7), `useLangGraphRuntime`, `useStreamRuntime` (LangChain), `useAdkRuntime`, `useA2ARuntime`, `useAgUiRuntime`, `useEveAgentRuntime`, `useOpenCodeRuntime`, `useLocalRuntime`, `useExternalStoreRuntime`, `useDataStreamRuntime`, and `useAssistantTransportRuntime`, plus wiring guides for Mastra, Cloudflare Agents, Claude Managed Agents, LLM gateways, and Electron, the Expo (`--native`) and React Ink (`--ink`) scaffolds, and the hosted MCP docs server. Once a runtime exists, use elements for the styled Thread, runtime for hooks and adapters, and update for a deep migration.

Install

npx skills add https://github.com/assistant-ui/skills --skill setup
Show step-by-step
  1. 1

    Open your terminal

    • Mac: Press ⌘ Space, type "Terminal", press Enter
    • Windows: Press Win R, type "cmd", press Enter
  2. 2

    Paste the command above and press Enter

    Use the Copy command button, then paste in your terminal (Mac: ⌘V, Windows: Ctrl V).

  3. 3

    Restart Claude Code

    Close and reopen Claude Code, or start a new session, so it picks up the new skill.

Where it lives
~/.claude/skills/assistant-ui--skills--assistant-ui--skills--setup/
├── SKILL.md
└── ... (skill resource files)
View on GitHub

Always review skill code before installing. Third-party skills may contain scripts that run on your machine.

Related skills

💻 Developer Tools

brainstorming

You MUST use this before any creative work - creating features, building components, adding functionality, or modifying behavior. Explores user intent, requirements and design before implementation.

by obra · 2 months ago291k
💻 Developer Tools

finishing-a-development-branch

Use when implementation is complete, all tests pass, and you need to decide how to integrate the work

by obra · 2 months ago291k
💻 Developer Tools

test-driven-development

Use when implementing any feature or bugfix, before writing implementation code

by obra · 2 months ago291k
🔍 Code Review

requesting-code-review

Use when completing tasks, implementing major features, or before merging to verify work meets requirements

by obra · 2 months ago291k