irgen generates full-stack web applications that are decoupled from specific backends. Using a headless runtime model, your frontend can interact with any API through standardized operations and data sources. This single DSL can then be rendered in multiple modes: CSR, SSG, or Hybrid.

Universal Actions

Unified invoke/navigate behavior for all UI components.

Macro System

High-level page templates like TablePage and AuthPage.

Operation-Backed Forms

Forms bind directly to operations with auto-loading.

Auth Contracts

Deterministic login/logout and nav visibility logic.

Error Boundaries

New in v0.3.0: Policy-driven reliability contracts.

Universal Action Model

v0.2.2 introduces a unified way to handle interactions. Every component can now trigger an Action, which is either an invoke (triggering an operation) or a navigate (moving to a URL). This removes the need for custom event handlers for common tasks.

Macro System (Micro-Frontend Templates)

Macros allow you to define complex page patterns with a single line of DSL. Built-in macros like TablePage, AuthPage, and EditorPage expand into standard components, giving you high-level abstractions without losing the flexibility of the underlying IR.

Operation-Oriented Architecture

Traditional generators are often tied to a single REST resource model. irgen treats Operations as first-class citizens. Whether it is publishing a post, processing a payment, or triggering a build, every interaction is defined as a discrete operation bound to a DataSource.

Headless Client Runtime

Every generated frontend includes a powerful lib/runtime.ts. This runtime manages the execution loop, authentication, and response normalization. Develop using standard React hooks: useOperation(id) for triggering actions and useResource(id) for managing entity state.

Client-Side Rendering (CSR)

CSR renders entirely in the browser. Initial HTML is a shell and JS is required for meaningful output. This is the default for dynamic dashboards where interactivity is the priority.

Static Site Generation (SSG)

SSG renders at build time to produce static HTML. mode="ssg" ships non-hydrated pages for maximum speed, while mode="hybrid" hydrates (adds interactivity) only when necessary. This is perfect for SEO-focused websites.

Progressive Web App (PWA)

PWA settings (manifest, icons, service workers) belong to the frontend target. They configure installability and offline capabilities for web outputs regardless of the rendering mode chosen.

Reliability (Error Boundaries)

Use the errorBoundary policy to automatically wrap your application in a robust React Error Boundary. This ensures that runtime failures don't crash the entire app and provide clean feedback to the user.

Support for Multi-App

Using the basePath policy, you can generate and deploy multiple applications (e.g., a Marketing Site at / and an Admin Portal at /admin) within the same project structure, sharing the same operation definitions.

Static Site Target vs React SSG

Static Site is a separate specialized target that produces HTML-first output with zero React dependency, ideal for documentation. React SSG is a rendering mode for the Frontend target that keeps the React ecosystem but pre-renders the initial state.

Electron vs Frontend

Electron is a separate target with its own policy block. While they share the same UI DSL, Electron targets focus on desktop integration, local security, and native packaging concerns.