Requirement —

1. Pages should be initially rendered at server side using some templating engine like EJS and some initial data injected into the page by the server.
2. Express should be used as the web server, along with all the backend logic, and use that to render the views on initial page load.
3. React code should be separated, and whenever changes are made to react components code/css, ui should be updated on the fly, without refreshing the page. read more about HMR

---

Dependencies

**ejs: **used for server side templating

**express: **our server

**react, react-dom: **for rendering react components

Dev Dependencies

Babel stuff: to transpile our JSX to javascript

loaders: loaders for webpack to resolve different module types.

@pmmmwh/react-refresh-webpack-plugin: webpack plugin to enable HMR for react components, without loosing state.

webpack stuff: to bundle our app and enable hot module replacement.

#development #server-side-rendering #webpack #react #hot-module-replacement