This HTML is sent to the client, where React "hydrates" it, attaching event listeners?
Short answer: 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.
Example code
and 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');
Real-world example (ShopNest)
When rendering cart lines, use a stable key={item.id}—not the array index—so React updates the right row after delete.
Say this in the interview
- Define — one clear sentence (the short answer above).
- Example — relate it to a project like ShopNest or your real work.
- Trade-off — when you would not use it.
Share this Q&A
Share preview image: https://www.toolliyo.com/images/toolliyo-logo.png