Show HN: OlumJS – Components are .html files, attributes are code or strings

eissapk3 pts0 comments

OlumJS — The VanillaJS Developer's Platform

Built for Prototypes,<br>Rapid Development<br>The fastest way to turn ideas into apps for hackathons and experiments.<br>Get startedGitHub<br>$npx create-olum my-app --tailwind<br>Copy<br>Omit --tailwind to skip Tailwind CSS setup.

Live build · unedited<br>Blank File to Todo App<br>Before Your Coffee Gets Cold<br>Start from an empty file and have a working app in under 5 minutes — no setup, no config. Watch it happen, then build your own.

todo-app — built live in OlumJSunder 5 min

Try it yourself in the playgroundNo install. Runs in your browser.

Syntax comparison<br>Same counter.<br>A fraction of the syntax.<br>No hooks, no signals to unwrap, no directives to memorize. Mutate a plain object — Olum re-renders.

Olum

Counter.html<br>Copy<br>script><br>const state = { name: "world", count: 0 };<br>script>

h1>Hello {state.name}!h1><br>input value="{state.name}" oninput="e => state.name = e.target.value" /><br>button onclick="state.count += 1">clicks: {state.count}button>

vs.

SvelteVueSolidReactAngular

Copy<br>script><br>let name = $state("world");<br>let count = $state(0);<br>script>

h1>Hello {name}!h1><br>input bind:value={name} /><br>button onclick={() => count += 1}>clicks: {count}button>

Ecosystem<br>Everything works<br>out of the box.<br>Official packages built and maintained by the Olum team — fully integrated, always up to date.

zero-config<br>Plain HTML<br>Components are ordinary `.html` files — no extension, formatter, or plugin required.

official<br>CLI<br>Scaffold Olum apps and pull Olum UI components straight into your codebase — no extra deps.

official<br>Router<br>File-based routing with dynamic segments, nested layouts, and async data loading.

official<br>Store<br>Plain object-style global state — define it once, import anywhere, no providers to wire up.

official<br>Transitions<br>Animate elements as they enter and leave, with built-in and fully custom transitions.

official<br>Olum UI<br>A shadcn-inspired component library — copy components into your project and own the code.

official<br>Sandbox<br>An in-browser playground — write Olum components and see them run live, no setup required.

official<br>Olum Icons<br>A curated icon set for Olum apps — drop-in SVG components, tree-shakeable and fully typed.

official<br>Playground<br>Explore Olum components interactively — tweak props and see instant results.

IDE<br>Editor Extension<br>Syntax highlighting, IntelliSense, auto-imports, and inline previews for `.html` components.

official<br>Dev Tools<br>Visualize the component tree, tweak state live, and time-travel through changes.

Built for the modern stack<br>ViteTailwindNode.jsVercelStackBlitz

#StandWithPalestine<br>We stand with Palestine<br>Our thoughts are with the people of Palestine. If you can, please consider supporting humanitarian relief efforts.

Support Palestine

Ready to ship<br>Start building in seconds.<br>One command. Full-stack ready. No configuration hell. Just code.<br>$npx create-olum my-app --tailwind<br>Copy<br>Omit --tailwind to skip Tailwind CSS setup.<br>Read the DocsView on GitHub

olum state official components name tailwind

Related Articles