Angular Universal & Server-side rendering Deep-Dive

Mark Pieszak
Sep 6, 2018 · 7 min read

Let’s change all of that, and get you up to speed, fast!

Check out the Trilon Blog for more articles on Angular, NestJS, and much more!

Part 1 of a deep-dive into Angular Universal

What is Angular Universal?


Part 1 — Getting started with Angular Universal and the Angular-CLI

ng new some-amazing-project

Angular Universal schematic installation

ng add @nguniversal/express-engine --clientProject [name]// angular.json
{ ...
"projects": {
"some-amazing-project": {}
}

How do we run Angular Universal for our App?

Dynamic SSR & Static Pre-rendering

So how do we know which one to choose and when?


How to start up Angular Universal

// Dynamic SSR
npm run build:ssr && npm run serve:ssr
// Static Pre-Rendering
npm run build:prerender && npm run serve:prerender

So how do we know it worked?

Client-side rendered source VS Server-side rendered source.
Angular SEO magic.

Manually setting up Angular Universal:


ASP.NET Core & Angular Universal integration?



Stay tuned for Part 2 & 3 coming soon !


Find me Online !


Trilon — Next-level Application Consulting

Trilon Consulting — Next-level Application Consulting https://trilon.io

Check out the Trilon Blog for more articles on Angular, NestJS, and much more!

Mark Pieszak

Written by

Trilon Co-Founder (Trilon.io) — Next level Consulting from Open-source fanatics and key contributors. Angular Universal core team.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade