Responsive Isomorphic Website with React, GraphQL, CSS Modules
Had the privilege of creating the public facing website for the company I work for, Blink. Since it's another greenfield site and React was strongly adopted by the company, it made a lot of sense to also construct the website using React.
The content had to be editable by the marketing team, but since the parts of the website don't fit in to a classic page type system that is popular on Wordpress, I integrated a third party content management platform, Contentful (a headless CMS provider, I'll review them separately later). Since the website would be isomorphic, I had a Node Express server at my disposal, so I immediately got to work adding a GraphQL API that would be responsible for serving up the various strings and images stored in the CMS for the specific elements of these bespoke built pages.
GraphQL is a dream to work with, and makes querying specific pieces of data very easy due to its query syntax and strong schema models. From there, I simply had the server write a simple router function to find the relevant page and populate the component tree like any other isomorphic page, the resulting HTML is then sent as a string to the client and rendered almost instantly. This is because the browser has everything it needs to start rendering and no scripts to download to block this render process. Once the page has rendered, a client side app in React is downloaded asynchronously so that when the user navigates to the next page, only the parts of the page required to are updated, thus forward and backward navigations are also instantaneous.
GraphQL benefits this process further when on client as it only needs to request the strings for the specific parts of the page being rendered, and not existing elements like the header, navigation and footer - since they are already rendered.