Vyriy Preset - SSR

Calm cloud-ready SSR application preset.

This repository is a small TypeScript workspace for server-rendered React output. The API workspace fetches content through a service adapter, renders shared React components on the server, and returns complete HTML.

Create this example

npm create vyriy@latest

Choose the ssr preset.

Structure

packages/
  components/  Shared SSR-friendly React components.
  services/    Replaceable service adapters, including CMS access.
workspaces/
  api/         Server entry point that renders the page response.

Documentation is rendered through Storybook MDX wrappers. The root doc.mdx displays this README, while package and workspace docs display their own README files.

Application Flow

  1. workspaces/api/index.tsx starts the server.
  2. The request handler calls cms.getContent() from @p/services/cms.
  3. The returned body is rendered with Page from @p/components.
  4. The response is wrapped into a complete HTML document and returned as text/html.

Requirements

  • Node.js >=24.0.0
  • Yarn 4.16.0

Install dependencies:

yarn install

Commands

Start the SSR API:

yarn start

Build the API bundle and Storybook documentation:

yarn build

Run validation:

yarn check

Run individual checks:

yarn lint
yarn test

Open Storybook documentation:

yarn storybook

Packages

  • @p/components exports shared React components for server-rendered surfaces.
  • @p/services exports service adapters that keep integration details outside UI and workspace code.
  • @w/api is the SSR server workspace and deployable application entry point.

Development Notes

Keep public behavior documented where it is introduced. When adding shared components or services, update the matching package README, public re-exports, and focused tests. Prefer SSR-safe code paths and avoid browser globals during render.

Project Guidance

These articles describe the development approach behind this preset and provide practical guidance for evolving a project on top of it: