1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
export const reactSSRExample = async (
req: express.Request,
res: express.Response,
) => {
// Import React
const React = await import("npm:react");
const ReactDOMServer = await import("npm:react-dom/server");
// Define some components
function TodoItem(props) {
return React.createElement("li", null, props.text);
}
function TodoList(props) {
const todoItems = props.items.map((item, index) =>
React.createElement(TodoItem, { key: index, text: item })
);
return React.createElement("ul", null, todoItems);
}
const items = ["Buy groceries", "Do laundry", "Walk the dog"];
// Render the page
const html = ReactDOMServer.renderToString(
React.createElement(TodoList, { items: items }),
);
res.send(html);
};
// Forked from @vtdocs.reactSSRExample
Val Town is a social website to write and deploy JavaScript.
Build APIs and schedule functions from your browser.
Comments
Nobody has commented on this val yet: be the first!
October 23, 2023