Back to blog

Introducing olwibaUI: blocks, not pages

The application block layer: shells, marketing sections, and content layouts that make Genesis pages thin.

If olwibaCN is the vocabulary, olwibaUI is the sentences. This post introduces the block layer of the ecosystem: the package that lets a Genesis route be twenty lines of composition instead of four hundred lines of markup.

What it is

olwibaUI (@olwiba/ui) provides application-level building blocks composed from olwibaCN primitives:

  • App shells: the sidebar-navigation layout behind the dashboard and admin areas, with user menus and sign-out built in
  • Marketing sections: heroes, feature grids, testimonials, pricing tables, FAQs, newsletter capture, contact blocks
  • Content layouts: post lists, post cards, page frames, and the pieces a blog or changelog needs

Every marketing page on this site is a stack of these blocks driven by config. The pages do not contain layout code; they declare sections and pass data.

The thin-route rule

Genesis enforces a discipline: routes are thin. A route does routing, data wiring, and composition of blocks. If a route needs a new piece of UI and that piece is reusable, it belongs in olwibaUI, not in the project.

This rule is what keeps a scaffolded project maintainable a year in. The hard UI problems are solved once, upstream, with accessibility and dark mode handled. Your project's component folder stays small and genuinely project-specific.

Config-driven marketing

The block layer is why Genesis marketing pages are data, not markup. The landing page, about page, pricing page, and every persona page render from typed configuration objects. Changing your pitch is editing a config file; adding a landing page for a new audience is adding an entry to an array.

When olwibaUI ships an improved hero or a new section type, your pages can adopt it by updating one dependency.

Where it sits in the stack

olwibaUI depends on olwibaCN and feeds everything above it: Genesis composes its blocks into the running application. It is open source under MIT, usable on its own, and at its best as part of the full ecosystem.