Skip to main content

page_react

page_react(
    *args,
    src_dir=None,
    js_file='ui.js',
    css_file='ui.css',
    title=None,
    lang='en',
    shinyreact_js='server',
    **kwargs,
)

Create a React page from conventional assets — no HTML file required.

The zero-configuration page for the ui.tsx pattern: the server emits no body HTML at all. It attaches the shinyreact bundle plus your app’s entry assets, discovered at www/ui.js and www/ui.css (relative to the calling module). Your JS owns the DOM — create and append your own mount container::

const root = ReactDOM.createRoot(
  document.body.appendChild(document.createElement("div")),
);

ui.js is required (a missing file warns, pointing at the resolved path); ui.css is attached only when it exists. Both are served as an :class:~htmltools.HTMLDependency versioned by ui.js’s mtime, so the browser re-fetches after every edit — unlike raw <script src=...> tags in a hand-written HTML file, which the browser caches.

Args: *args: Extra children or :class:~htmltools.HTMLDependency objects. src_dir: Directory containing the assets. Defaults to www/ next to the calling module; relative paths resolve against the caller. js_file: JS entry filename within src_dir (default "ui.js"). css_file: CSS filename within src_dir (default "ui.css"). title: Page title. Defaults to the app folder’s name (src_dir’s parent when src_dir is a www/ dir). lang: HTML lang attribute. shinyreact_js: Who supplies shinyreact.js (and shinyreact.css) to the page.

    - ``"server"`` (default) — the shinyreact package serves them as an
      :class:`~htmltools.HTMLDependency`. What a no-build app needs,
      and what makes ``window.shinyreact`` exist.
    - ``"client"`` — your own bundle imports ``@posit-dev/shinyreact`` and
      ships its own copy, so the server sends nothing. Serving them too
      would put two copies of React and the hooks on one page.

    The ``#shinyreact-config`` tag is emitted either way — it carries
    the protocol version and any bookmark restore payload.
**kwargs: Forwarded to :func:`page_bare`, and on to
    :func:`shiny.ui.page_bootstrap`.