I'm having hard time understanding the difference between Server-Side rendering and Client-Side rendering. Could someone please explain ?

Check out the html that comes along in a page downloaded from the server in your browser's Network Profiler. If you see all the content from the page then it was either rendered on the server or was a static html file. For example, a SSR render version of this page would include the html for each comment and everything else on the page. So you'd see in the html that comes across from the server:

<p>I've heard that SSR improves performance, SEO etc, etc but I'd like to hear what the terms actually mean ? An example would be good. Thanks.</p>

Whereas, with CSR, the server sends HTML which then executes JS which is responsible for grabbing content from the client's browser. So you wouldn't see your actual comment in HTML. The server sends HTML like:

<html>
<head>
   ...
</head>
<body>
  <div id="app"></div>
  <script src="app.js"></script>
</body>
</html>

Of course it could and would have other stuff in a production app but the point is that the JS (app.js) would fetch the content for the page and place it where it belongs (inside div#app).

/r/reactjs Thread