This HTML is sent to the client, where React "hydrates" it, attaching event listeners?
nd making it interactive.
Example with express and React:
const express = require('express');
const React = require('react');
const ReactDOMServer = require('react-dom/server');
const App = require('./App');
const server = express();
server.get('*', (req, res) => {
const content = ReactDOMServer.renderToString(<App />);
res.send(`
<html>
<head><title>SSR Example</title></head>
<body>
<div id="root">${content}</div>
</body>
</html>
`);
});
server.listen(3000, () => console.log('Server running on
In this setup, React renders the app to HTML on the server, then the client "hydrates" it for
interactivity.