hardFrontend

What is Angular Universal / SSR?

Q: What is Angular Universal / SSR?

## Server-Side Rendering (Angular Universal) By default Angular is a **client-side rendered** SPA: the browser gets an empty shell and JS builds the page. **SSR** (historically 'Angular Universal', now built into the CLI) renders the app to **HTML on the server** for the first request, then **hydrates** it on the client to make it interactive. Server render to HTML Browser shows <text clas

729 views

Understand the problem

Explain server-side rendering.

ssruniversal

Attempt it yourself

Sketch your approach before reading the solution — that's what interviews test.

Stuck? AI Nudge Available

Get a conceptual hint to guide your logic without spoiling the final implementation.

Study the solution

The solution is waiting

Give it an honest attempt first — then compare your thinking with the full walkthrough.

Read the code

Enable hydration

// main.ts (server-rendered app with client hydration)
import { bootstrapApplication } from '@angular/platform-browser';
import { provideClientHydration } from '@angular/platform-browser';
import { AppComponent } from './app/app.component';

bootstrapApplication(AppComponent, {
  providers: [
    provideClientHydration(),   // reuse server DOM instead of re-rendering
  ],
});
// Scaffold SSR with: ng add @angular/ssr

Join the discussion

Discussion (0)

No responses yet. Be the first to share what you think.

What is Zone.js, how does it monkey-patch browser APIs, and how do you build a Zoneless Angular application?

What is the difference between ElementRef, TemplateRef, and ViewContainerRef?