SSR Safe Coding: window/document, localStorage, and TransferState

SSR changes where your code runs. Some code runs on the server first, then in the browser. ## Problem: window/document not available on server ❌ Bad: ```ts localStorage.getItem('token'); ``` ## Solution: check platform ```ts import { inject, PLATFORM_ID } from '@angular/core'; import { isPlatformBrowser } from '@angular/common'; export class TokenService { private platformId = inject(PLATFORM_ID); getToken() { if (!isPlatformBrowser(this.platformId)) return null; return localStorage.getItem('token'); } } ``` ## TransferState (avoid double fetching) When server fetches data, you can reuse it in the browser without fetching again. Concept: - server calls API - saves response to TransferState - browser reads it and skips duplicate request This makes SSR fast and efficient. > Next: Angular deployment strategies, builds, caching, and versioning.