Generating the Universal Code

Since Angular CLI version 1.6, there is support for Angular Universal, and since version 6.x, it has been advanced even more. We can use the ng generate command to generate the majority of the code we need to add support for server-side rendering.

Note

Schematics is the name of the workflow tool that powers code generation in Angular CLI. You can write your own schematics to generate custom code using ng generate. If you would like to learn more about Schematics, you can refer to a blog post about it at https://blog.angular.io/schematics-an-introduction-dc1dfbc2a2b2.

Let's explore what happens when running the generator in more detail:

Figure 2.5: Running the generator command

Running this generator will change a few things in the current app:

• It will add a new architect to the angular-social app in angular.json.
• It will add the @angular/platform-server dependency to package.json.
• It updates the...