~/swapbook
// storybook for htmx & hypermedia

Point it at your app.
See every swap.

A component workbench for server-rendered UI. One binary reverse-proxies your running app and renders your components in isolation, with an htmx-aware inspector, live controls and mocked interactions. Zero JS toolchain.

$ go install github.com/Aejkatappaja/swapbook/cmd/swapbook@latest
$ swapbook --target :8080
live demo · runs entirely in your browser
~/swapbook · localhost:7007
    what you get

    The parts a hand-rolled preview page can't give you

    htmx-aware inspector

    Every request, its params, status and timing, the swap target flashed in the preview, and the returned HTML.

    mock · safe · live

    Drive interactions with canned responses (no auth, no DB), block mutations, or run everything for real.

    Live controls & docs

    Edit a component's props from the toolbar and re-render. Autodocs and a11y lint come built in.

    Any stack

    Go, Django, Rails, Laravel, or any server that answers four HTTP endpoints. No Node build step.

    The gallery UI is plain JavaScript, type-checked with JSDoc and checkJs in CI, not TypeScript: the whole tool is zero-build, so a compile step would defeat the point. The binary is Go with no dependencies.

    quickstart

    Register components in the stack you already use

    how it works

    A transparent proxy and four endpoints

    endpoint (under /_swapbook)purpose
    GET /manifest.json requiredstories, variants, control schemas, asset hints
    GET /preview/{id}/{variant} requiredrender a component (accepts control args)
    GET /mocks/{id}/{variant}list a variant's mocked routes
    ANY /mock/{id}/{variant}/{i}render a mock response
    browser
    htmx fires from a preview
    swapbook :7007
    serves the gallery at /__sb/, reverse-proxies everything else
    your app :8080
    same origin, so no CORS and no URL rewriting
    compared to

    Why not just Storybook?

     SwapbookStorybook (server)Lookbookphoenix_storybook
    Live controls / knobs
    Framework-agnosticpartialRailsLiveView
    No JS toolchain
    Single binary
    htmx-aware inspector
    Mocked interactionsvia MSW

    Lookbook and phoenix_storybook are mature and deeply integrated with their framework, and both have excellent control editors. Swapbook trades that single-framework depth for working across any stack, with the htmx request lifecycle as a first-class citizen.