Primate
Guides Components

Use React components

Add React components with the @primate/react module.

1) Install

Install the Primate React package along with React and React DOM.

$ npm install @primate/react react react-dom

2) Configure

Load the React module in your configuration.

TypeScriptconfig/app.ts
import react from "@primate/react";
import config from "primate/config";

export default config({ modules: [react()] });

3) Write a component

Compose a component in JSX or TSX.

TypeScriptcomponents/Welcome.tsx
export default function Welcome({ name }: { name: string }) {
  return <h1>Hello, {name}!</h1>;
}

4) Render the component

Use response.view in a route to render the template.

TypeScriptroutes/index.ts
import response from "primate/response";
import route from "primate/route";

route.get(() => response.view("Welcome.tsx", { name: "World" }));