Bitsocial React Hooks
Build your corner of the internet.
React hooks for communities, feeds, conversations, profiles, accounts, and publishing on the Bitsocial protocol. Bring your own interface; the hooks connect it to shared protocol state through Zustand stores.
Documentation · Try the playground · API & recipes · npm
Edit a component and see the result. The playground uses simulated content and publishes nothing.
Supports React 16.8+. Used by 5chan.
Start building
Add the package to an existing React app:
yarn add @bitsocial/bitsocial-react-hooks
Render this component in the browser with an existing community name:
import { useCommunity } from "@bitsocial/bitsocial-react-hooks";
export default function CommunityCard({ name }) {
const community = useCommunity({ community: { name } });
if (!community.hasCachedData) {
return (
<p role="status">
{community.error?.message || "Loading community…"}
</p>
);
}
return (
<article>
<h1>{community.title || name}</h1>
<p>{community.description}</p>
</article>
);
}
The package initializes a local account automatically. You can also identify a community with { publicKey }, or pass both { name, publicKey }. Hooks share cached data and subscriptions; use syncState when you need to show background refresh progress.
Explore the docs
Read the guides at hooks.bitsocial.net, or browse their source here:
- Quickstart — build your first feed.
- Core concepts — communities, accounts, state, and publishing.
- Full API and recipes — the complete hook reference and practical examples.
- Mock content — develop a UI with sample data.
- AI context, llms.txt, and llms-full.txt — documentation for your coding assistant.
Run the website locally
The site lives in website/. To open the playground and docs in your browser:
cd website
corepack yarn install --immutable
corepack yarn start
Contribute
Use Node 22.19 or newer and the repository's pinned Yarn 4 release:
nvm install
nvm use
corepack yarn install
corepack yarn build
Read testing and development, contributor guidance, and verification for focused checks. Keep API examples aligned with the public exports and types; after documentation changes, run corepack yarn llms:generate.