In order to start developing a frontend, first create a root template file called template.js in the project folder, which will render the HTML with React components.
mern-simplesetup/template.js:
export default () => { return `<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>MERN Kickstart</title> </head> <body> <div id="root"></div> <script type="text/javascript" src="/dist/bundle.js"> </script> </body> </html>` }
When the server receives a request to the root URL, this HTML template will be rendered in the browser, and the div element with ID "root" will contain our React component.
Next, create a client folder where we will add two React files, main.js and HelloWorld.js.
The main.js file ...
