Skip to content

piconic-ai/barefootjs

Repository files navigation

BarefootJS

TSX in. Your stack out.
Barefoot compiles signal-based TSX into Hono, Echo, or whatever stack you ship on.
No virtual DOM. No SPA required.

Warning

Alpha Software — BarefootJS is in early alpha. APIs may change without notice. Not recommended for production use.


Quick Start

Requires Node 22+.

npm create barefootjs@latest

You'll be prompted for a target directory (defaults to my-app). After scaffolding:

cd my-app   # or whatever name you entered at the prompt
npm install
npm run dev

Then open the URL the dev server prints (defaults to http://localhost:8787). The starter app ships a Counter component you can edit at components/Counter.tsx.

The full walkthrough — adapter / CSS choices, generated layout, and editing the Counter — lives in docs/core/quick-start.mdx.


AI-Assisted Development

BarefootJS ships an agent skill that gives AI deep knowledge of the compiler, IR, CLI, and component system — so it can build, test, and debug BarefootJS components autonomously. Works with both Claude Code and Codex.

Claude Code:

/plugin marketplace add piconic-ai/barefootjs
/plugin install barefootjs@barefootjs

Codex:

install the barefootjs skill from piconic-ai/barefootjs

Once installed, the agent can use the bf CLI, write IR tests, trace signal graphs, and scaffold components — all without reading source files. See AI-native Development for the full workflow.


Design Principles

  • Backend Freedom — Same JSX works with Hono, Go, Mojolicious, etc. No Node.js lock-in.
  • MPA-style development — Add interactivity to existing server apps without an SPA framework.
  • Fine-grained reactivity — Signal-based, only affected DOM nodes update. SolidJS-equivalent performance.
  • AI-native development — IR enables browser-free testing. CLI for component discovery. AI agents can develop autonomously.

Documentation


Known limitations

Tracked patterns the compiler / adapters / runtime don't yet handle are aggregated under the known-limitation label. Each issue documents the shape, affected fixtures, available workaround, and fix direction.


Acknowledgements

This project is inspired by and built with:

  • SolidJS - Fine-grained reactivity model and Signal API design
  • shadcn/ui - UI component design system (docs/ui)
  • Hono - JSX runtime for server-side rendering

License

Distributed under the MIT License. See LICENSE for more information.