Skip to content

Web Editor ​

The web editor is a React application for creating RichView reports visually. You add sections (text, charts, KPIs, tables), edit data inline, and see a live preview of the rendered report.

How to access ​

Local development (recommended for now):

bash
cd richview-v2
pnpm install && pnpm build
pnpm dev

This starts both the API server (port 4400) and the web editor (port 5173). Open http://localhost:5173 in your browser.

Hosted version at https://richview.uk -- the SPA is deployed, but the API backend at api.richview.uk is not fully wired yet. OAuth login and report saving require the API server. For full functionality, run locally with pnpm dev.

What you can do ​

Create reports -- start from a blank report or choose a template (dashboard, analysis, postmortem, and more).

Add sections -- insert markdown text, charts, KPI cards, tables, code blocks, callouts, images, and other section types. Each section is a block you can reorder, edit, or remove.

Edit data inline -- chart and table sections include an inline data editor. Enter values directly or paste from a spreadsheet.

Live preview -- toggle between edit mode and presentation mode with Ctrl+Enter. Edit mode shows the section editor; presentation mode shows the final rendered output.

Light and dark mode -- the editor follows your system preference automatically.

Current limitations ​

The web editor is under active development. A few things to be aware of:

  • Login: OAuth login (GitHub, Google) requires the API server with OAuth credentials configured. The hosted version at richview.uk does not have OAuth set up yet. Use local development for login-dependent features.
  • Saving reports: Report persistence requires the API server. Without it, reports exist only in your browser session.
  • Publishing: Publishing reports to shareable URLs requires the API server.

For CLI-based report generation (which works fully today), see the Getting Started guide.

Running locally ​

The pnpm dev command starts both services:

bash
pnpm dev
# [server] API server listening on http://localhost:4400
# [web]    Web editor at http://localhost:5173

The web editor proxies API calls to the local server automatically. No extra configuration needed.

To run just the web editor without the API server:

bash
pnpm --filter @richview/web dev

This gives you the editor UI for previewing reports, but saving and publishing won't work without the API server.

Self-hosting the editor ​

To run the web editor on your own infrastructure for your team, see the Self-Hosting guide. The Docker Compose setup gives you the full stack: editor, API server, and SQLite storage.

Released under the Elastic License 2.0 (ELv2).