@k8ordo/framework

A React Server Components framework that lets the same code run with or without a server

npm

yarn

pnpm

bash

Copy code

npm install -D @k8ordo/framework @k8ordo/router

Get Started GitHub npm

vite.config.ts

Copy code

import { framework } from '@k8ordo/framework/vite';
import { defineConfig } from 'vite';

export default defineConfig({
  plugins: [framework({ mode: 'static' })],
});

src/routes/products/page.tsx

Copy code

export default function ProductsPage() {
  return <h1>Products</h1>;
}

vite build

Copy code

dist/client/
  products/index.html

URLs from the directory tree

Under src/routes/, a directory is a URL segment and page.tsx is the page at that URL. [id] is a parameter.

A page another route always answers first, or two files for the same URL, fail the build, and the error names the files.

text

Copy code

src/routes/
  layout.tsx
  page.tsx
  not-found.tsx
  products/
    page.tsx
    [id]/page.tsx

Two modes, chosen per app

mode: 'static' renders the pages at build time, into an app that goes on a static host with no server. mode: 'server' renders on a server per request, into an app that can also use Server Actions and cookies.

Pages and layouts are written the same way in both modes.

vite.config.ts

Copy code

framework({ mode: 'static' });

Terminal

Copy code

vite build

vite.config.ts

Copy code

framework({ mode: 'server' });

Terminal

Copy code

vite build
node dist/server.js