How do I install AppCN?

Copy the stdio config for Cursor, Claude Desktop, Claude Code, or VS Code on this page. It uses the publisher's install, not a PlugMCP proxy.

Does AppCN need an API key?

The publisher lists these environment variables: APPCN_REGISTRY_URL.

When was AppCN last checked?

Last checked 2026-11-08. Install & correctly use appCN React Native / Expo components, streamed from the live registry.

AppCN MCP server

Power your agent

Add this server

The publisher's own command. Not a PlugMCP endpoint.

Add to Cursor Add to VS Code Run on PlugMCP

Host a copy with our keys and logs.

Local command

npx -y @app-cn/[email protected]

Credentials from the publisher

APPCN_REGISTRY_URL — Override the appCN registry base URL the server fetches from (default https://appcn.vercel.app/r).

Claude Code has no install link for a local command. Copy the command below and run it in a terminal.

shClaude Code

1APPCN_REGISTRY_URL=<value> claude mcp add digital.shineup-appcn -- npx -y @app-cn/mcp@0.1.2

Run in a terminal.

jsonClaude Desktop

1{2  "mcpServers": {3    "digital.shineup-appcn": {4      "command": "npx",5      "args": [6        "-y",7        "@app-cn/[email protected]"8      ],9      "env": {10        "APPCN_REGISTRY_URL": "<value>"11      }12    }13  }14}

claude_desktop_config.json

Local · npmPublisher installStep-by-step: add this in Claude

Remote URL or a command on your machine? How the two installs differ

Run on PlugMCP

Host a copy with our keys and logs.

A new server you create. It is not this listing's official endpoint. Use the publisher install when you want their URL and their credentials.

Launch

Server facts

Local

Transport: stdio
Version: 0.1.2
API key

Tools

No tool list yet. Remote servers get one after the first health check.

FAQ

Questions

appCN

Copy-paste mobile components for React Native + Expo.

A shadcn-philosophy library: you own the source, NativeWind styles the surface, Reanimated drives the motion — and the featured AI-native collection ships streaming bubbles, prompt composers, reasoning traces, and a reactive 3D voice orb.

Browse components · CLI docs · Mobile app · Live showcase · GitHub

Quick start

The CLI handles NativeWind + Reanimated wiring and registers the @app-cn shadcn namespace for you. One command to set up, one to add a component.

# 1. (Recommended) One-shot project setup
npx @app-cn/cli@latest init

# 2. Add any component by slug
npx @app-cn/cli@latest add voice-sphere

Prefer your own pipeline? appcn add is a thin wrapper around shadcn — you can skip the CLI entirely:

# Copy a single component via shadcn (no setup, one-off)
npx shadcn@latest add https://appcn.vercel.app/r/voice-sphere.json

# Or pull the whole library as a managed dep
npm install @app-cn/ui

Building with an AI agent? Add the appCN MCP server so Claude Code, Cursor, or Windsurf can discover and install components for you — and write new code in appCN's motion/haptic style:

# Claude Code
claude mcp add appcn -- npx -y @app-cn/mcp

See MCP docs for Cursor / Windsurf / VS Code config.

Status: v0.1.0 live on npm. Five components shipped — the AI collection is the marketed wedge and is the first place to land new work.

What's in the box

New: appCN is live on real phones — scan a QR with Expo Go and the entire component gallery loads on Android or iPhone in seconds. No emulator, no developer account. Standalone Play Store APK is in review — shipping soon.

Base

Component	Delight
`Button`	Spring-y press scale to 0.96, settles in 140 ms — feels weighted, never twitchy

AI-native

Component	Delight
`StreamBubble`	Three-phase thinking → token stream → settle
`PromptInput`	Send morphs into a stop with a spinning ring
`ReasoningTrace`	Auto-collapses the instant the answer lands
`VoiceSphere`	Reactive 3D orb that breathes with voice level

Every component has an interactive web preview, a QR you can scan with Expo Go to run it live on your phone, and a video — same code path on every surface. → appcn.vercel.app/components

Why appCN

Real-phone previews. Scan a QR with Expo Go and the component runs live on your device with native gestures. No emulator gymnastics.
AI-native flagship. The AI collection is the wedge — components built for AI apps that nobody else ships well.
Quadruple distribution. The appcn CLI, the shadcn registry, @app-cn/ui from npm — or the MCP server, so your AI coding agent installs components for you. Same primitives, your call.
Motion-first defaults. Reanimated + gesture-handler, shared motion tokens (duration / easing / spring), one delight detail per component.
Dark-mode first. Designed dark, then derived to light. Premium reads as depth, not rainbows.
You own the source. Copy-paste philosophy means no lock-in — once a component lands in your repo, edit freely.

Documentation

Surface	What's there
appcn.vercel.app	Live docs site — landing, every component, live previews
CLI docs	`init`, `add`, env vars, the idempotency contract
Mobile app	Play Store + Expo Go install paths, deep-link contract
`CLAUDE.md`	Architecture, monorepo map, commands, Metro/Reanimated gotchas
`DESIGN.md`	Taste layer — motion rules, the "one delight detail" rule, the 8-step SOP
`CONTRIBUTING.md`	Dev setup, the Changesets release flow, PR conventions
`AGENTS.md`	Cross-tool guide for AI coding agents (Claude / Cursor / Windsurf / Codex / Aider)

Contributing

Every new component ships through the 8-step SOP in DESIGN.md → Component checklist. Don't skip steps — the PR template enforces them and a missing changeset blocks the release pipeline.

Working with an AI agent? Invoke the /new-component Claude skill — it walks the checklist, drops a typed <slug>.meta.ts template ready to fill, wires the registry + showcase entries, and verifies with typecheck + registry build.

Full guide: CONTRIBUTING.md.

Releases

Releases are driven by Changesets and published to npm via OIDC Trusted Publishing — zero long-lived secrets.

pnpm changeset           # describe what changed + pick a bump
git commit -am "..."     # commit the changeset alongside your code
# Open a PR. After merge to main, a "Version Packages" PR opens automatically.
# Merge that PR → CI publishes via OIDC.

Every published version gets a verified provenance badge on npm.

Deploying

Project	Vercel root directory	What it serves
Docs	`apps/web`	Landing, `/components/`, `/docs/`, the shadcn registry at `/r/*.json`
Showcase	`apps/showcase`	Expo web export — the iframe target for interactive previews

Deploy order (matters):

Deploy the showcase first (apps/showcase) so you have a URL.
Deploy the docs, setting NEXT_PUBLIC_SHOWCASE_WEB_URL to that URL.
Optional: custom domains (appcn.vercel.app → docs, appcn-showcase.vercel.app → showcase).

Required env vars (docs project):

Variable	Value
`NEXT_PUBLIC_SHOWCASE_WEB_URL`	`https://<showcase-project>.vercel.app`
`NEXT_PUBLIC_EXPO_URL`	(empty for v1 — needs EAS Update for the QR tab)
`NEXT_PUBLIC_REGISTRY_URL`	`https://<docs-domain>/r`

The showcase project needs no env vars. Defaults live in apps/web/.env.example.

Acknowledgments

Inspired by shadcn/ui's copy-paste philosophy and react-native-reusables's docs-site polish. Built on top of NativeWind, Reanimated, and Expo.

License

MIT — you own the code.

Add this server

Host a copy with our keys and logs.

Server facts

Tools

Questions

How do I install AppCN?

Does AppCN need an API key?

What transport does AppCN use?

When was AppCN last checked?

Documentation

appCN

Quick start

What's in the box

Base

AI-native

Why appCN

Documentation

Contributing

Releases

Deploying

Acknowledgments

License