Ambystech

Axo

Slides in .mdx, components in .axo, output that is just HTML.

Installnpm i -D @ambystech/axoLicenceMIT

01 · The problem

A deck should still open in five years.

The tools that make slides beautiful make them fragile: a runtime to boot, a CDN to reach, a framework to keep upgrading.

Anti-pattern:

Hydration, client islands, a bundle to ship. It renders — until the wifi drops, or the CDN moves, or the framework majors.

Do this instead:

HTML, CSS and vendored assets. No client framework, no hydration, no CDN link. client:* is a compile error, not a warning.

02 · What it is

A compiler with a CLI around it.

Write slides as .mdx. Write components as .axo. Everything is decided at compile time, and what lands in dist/ is a static site.

MDXReveal.jsPreact at build timeZero runtime

0network requests over file://39components included<3MBvendor payload

03 · How it works

Five stages, then it is HTML.

RegistryYour components and layouts, shadowing the built-ins.
→ registry

SlideMDX to a Reveal section, rendered to a string.

ShellThe page around it — fonts, theme, footer.

VendorReveal, fonts and Mermaid copied in locally.

Builddist/, and nothing pointing outside it.
→ dist/

If the build cannot render it correctly, it fails and names the file and line.

04 · Writing a component

The filename is the component name.

Drop Tier.axo in components/ and you have <Tier>. No registration, no import, no list to update.

Axo.propsclass:list<slot />

---
const { name, price } = Axo.props;
---

<div class:list={['tier', price && 'paid']}>
  <span class="n">{name}</span>
  <h4>{price}</h4>
  <p><slot /></p>
</div>

Get started

One command.

npx @ambystech/axo new my-deck

Docsgithub.com/ambystechcom/AxoEditorAxo for VS Code