How to Server-Side render a Create React App with ForrestJS

We start from a CRA boilerplate and end up with a Universal and Server-Side rendered PWA that you can build upon.

Create React App + ForrestJS = Universal PWA

In this step-by-step tutorial you are going to take a Create React App (CRA) app, and turn it into a fully featured Universal PWA with server-side rendering, served by an ExpressJS server.

NOTE:
If you just want to enjoy a ready-to-use app, type this in a terminal:
npx forrest run my-new-universal-cra -p 8080

Step n.1 — Kickoff your CRA

Initialize a new CRA project (*):

npx create-react-app my-new-universal-cra && \ 
cd my-new-universal-cra

Step n.2 — Add a few Dependencies

Now install some ForrestJS modules:
(I personally use because is much faster than npm)

yarn add @forrestjs/package-universal && \
yarn add @forrestjs/package-universal-dev -D

The package-universal contains a set of common dependencies like React, Express, react-router, ect... We work hard to keep all the internal versions up-to-date so you can enjoy and update just this package :-)