Frontend reconciliation

The only thing that was missing from the last example was the client JavaScript code. No big deal, right? The user actually wants to use the application and the server needs to deliver the client code bundle. How would this work? We want routing to work in both the frontend and the backend, without modification to the routes themselves. In other words, the server handles routing in the initial request, then the browser takes over as the user starts clicking things and moving around in the application.

This is pretty easy to do. Let's create a main module (it probably looks familiar from examples in the previous chapter):

import React from 'react'; 
import { render } from 'react-dom'; 
 
import routes from './routes'; 
 
// Nothing special here. React sees the checksum on the 
// root element, and determines that there's no need 
// to render data yet. 
render( 
  routes, 
  document.getElementById('app') 
); 
...