> ## Documentation Index
> Fetch the complete documentation index at: https://ckbfans.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Introduction

> CCC (CKBers' Codebase) is the official TypeScript/JavaScript SDK for building on the CKB blockchain.

CCC (CKBers' Codebase) is a one-stop TypeScript/JavaScript SDK for the [CKB (Nervos Network)](https://docs.nervos.org/) blockchain. It gives you everything you need to connect wallets from multiple chain ecosystems, compose and sign transactions, and work with CKB-native protocols — all through a single, consistent API.

<CardGroup cols={2}>
  <Card title="Multi-wallet support" icon="wallet">
    Connect wallets from EVM (MetaMask, EIP-6963), Bitcoin (UniSat, OKX, Xverse), Nostr (NIP-07), and native CKB (JoyID) through one unified interface.
  </Card>

  <Card title="Transaction composition" icon="layer-group">
    Describe what you want in your transaction output. CCC fills in inputs, calculates fees, and handles the rest automatically.
  </Card>

  <Card title="UDT tokens" icon="coins">
    Mint, transfer, and query balances for User Defined Tokens (UDTs) on CKB with built-in helpers.
  </Card>

  <Card title="Spore NFTs" icon="image">
    Create, transfer, and melt Spore Protocol NFTs — digital objects stored entirely on-chain.
  </Card>
</CardGroup>

## Who CCC is for

CCC is designed for JavaScript and TypeScript developers who want to build on CKB. Whether you are:

* Building a **React web app** and need a drop-in wallet connector
* Writing **Node.js scripts** or backend services that interact with the chain
* Exploring CKB for the first time and looking for working examples

CCC covers all of these scenarios with dedicated packages for each environment.

## How it works

CCC exports everything through a single `ccc` namespace. You import it from whichever package fits your stack:

```typescript theme={null}
import { ccc } from "@ckb-ccc/connector-react"; // React
import { ccc } from "@ckb-ccc/shell";            // Node.js
import { ccc } from "@ckb-ccc/ccc";             // Custom UI
```

From there, you get access to:

* **`ccc.Provider`** — React context that manages wallet state and exposes the connector UI
* **`ccc.Client`** — connects to CKB mainnet or testnet RPC nodes
* **`ccc.Signer`** — unified signing interface across all supported wallets
* **`ccc.Transaction`** — composable transaction builder with automatic input completion and fee calculation
* **`ccc.Address`** — parse and encode CKB addresses across address formats

## Try it now

You do not need to install anything to try CCC. The CCC Playground runs entirely in your browser and lets you write and execute CKB code with live output and data visualization.

<CardGroup cols={2}>
  <Card title="Open the Playground" icon="play" href="https://live.ckbccc.com/">
    Run CKB code in your browser — no setup, no wallet required.
  </Card>

  <Card title="Quick Start" icon="rocket" href="/quickstart">
    Bootstrap a new app or add CCC to an existing project in minutes.
  </Card>
</CardGroup>

<Tip>
  If you are new to CKB itself, read [Nervos CKB Docs](https://docs.nervos.org/) first to understand the Cell model and how CKB transactions work.
</Tip>


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.