docs: update SSR docs (angular#52408)

This commit updates the `ssr.md` file to restructure (and simplify) SSR docs.

PR Close angular#52408

Author: AndrewKushnir

aio/content/examples/ssr/server.ts

@@ -1,10 +1,11 @@
 // #docplaster
 
-import { APP_BASE_HREF } from '@angular/common';
-import { CommonEngine } from '@angular/ssr';
+import {APP_BASE_HREF} from '@angular/common';
+import {CommonEngine} from '@angular/ssr';
 import express from 'express';
-import { fileURLToPath } from 'node:url';
-import { dirname, join, resolve } from 'node:path';
+import {dirname, join, resolve} from 'node:path';
+import {fileURLToPath} from 'node:url';
+
 import bootstrap from './src/main.server';
 
 // The Express app is exported so that it can be used by serverless Functions.
@@ -13,42 +14,34 @@ export function app(): express.Express {
   const serverDistFolder = dirname(fileURLToPath(import.meta.url));
   const browserDistFolder = resolve(serverDistFolder, '../browser');
   const indexHtml = join(serverDistFolder, 'index.server.html');
-  // #docregion CommonEngine
   const commonEngine = new CommonEngine();
-  // #enddocregion CommonEngine
 
   server.set('view engine', 'html');
   server.set('views', browserDistFolder);
 
-  // #docregion data-request
   // TODO: implement data requests securely
   // Serve data from URLS that begin "/api/"
   server.get('/api/**', (req, res) => {
     res.status(404).send('data requests are not yet supported');
   });
-  // #enddocregion data-request
-  // #docregion static
   // Serve static files from /browser
-  server.get('*.*', express.static(browserDistFolder, {
-    maxAge: '1y'
-  }));
-  // #enddocregion static
+  server.get('*.*', express.static(browserDistFolder, {maxAge: '1y'}));
 
   // #docregion navigation-request
   // All regular routes use the Angular engine
   server.get('*', (req, res, next) => {
-    const { protocol, originalUrl, baseUrl, headers } = req;
+    const {protocol, originalUrl, baseUrl, headers} = req;
 
     commonEngine
-      .render({
-        bootstrap,
-        documentFilePath: indexHtml,
-        url: `${protocol}://${headers.host}${originalUrl}`,
-        publicPath: browserDistFolder,
-        providers: [{ provide: APP_BASE_HREF, useValue: req.baseUrl }],
-      })
-      .then((html) => res.send(html))
-      .catch((err) => next(err));
+        .render({
+          bootstrap,
+          documentFilePath: indexHtml,
+          url: `${protocol}://${headers.host}${originalUrl}`,
+          publicPath: browserDistFolder,
+          providers: [{provide: APP_BASE_HREF, useValue: req.baseUrl}],
+        })
+        .then((html) => res.send(html))
+        .catch((err) => next(err));
   });
   // #enddocregion navigation-request
 

aio/content/examples/ssr/src/app/app.config.ts

@@ -1,35 +1,26 @@
 // #docplaster
-import { importProvidersFrom } from '@angular/core';
-import { provideProtractorTestingSupport } from '@angular/platform-browser';
-import { provideClientHydration} from '@angular/platform-browser';
-import { ApplicationConfig } from '@angular/core';
-import { provideRouter } from '@angular/router';
-import { provideHttpClient, withFetch } from '@angular/common/http';
+import {provideHttpClient, withFetch} from '@angular/common/http';
+import {ApplicationConfig, importProvidersFrom} from '@angular/core';
+import {provideClientHydration, provideProtractorTestingSupport} from '@angular/platform-browser';
+import {provideRouter} from '@angular/router';
+import {HttpClientInMemoryWebApiModule} from 'angular-in-memory-web-api';
 
-import { routes } from './app.routes';
-
-import { HttpClientInMemoryWebApiModule } from 'angular-in-memory-web-api';
-import { InMemoryDataService } from './in-memory-data.service';
+import {routes} from './app.routes';
+import {InMemoryDataService} from './in-memory-data.service';
 
 export const appConfig: ApplicationConfig = {
   providers: [
     provideRouter(routes),
-     // TODO: Enable using Fetch API when disabling `HttpClientInMemoryWebApiModule`.
-    provideHttpClient(/* withFetch()*/ ),
-    provideClientHydration(),
-    provideProtractorTestingSupport(), // essential for e2e testing
+    // TODO: Enable using Fetch API when disabling `HttpClientInMemoryWebApiModule`.
+    provideHttpClient(/* withFetch()*/), provideClientHydration(),
+    provideProtractorTestingSupport(),  // essential for e2e testing
 
-    // #docregion in-mem
     // TODO: Remove from production apps
     importProvidersFrom(
-      // The HttpClientInMemoryWebApiModule module intercepts HTTP requests
-      // and returns simulated server responses.
-      // Remove it when a real server is ready to receive requests.
-      HttpClientInMemoryWebApiModule.forRoot(
-        InMemoryDataService, { dataEncapsulation: false }
-      )
-    ),
-    // #enddocregion in-mem
+        // The HttpClientInMemoryWebApiModule module intercepts HTTP requests
+        // and returns simulated server responses.
+        // Remove it when a real server is ready to receive requests.
+        HttpClientInMemoryWebApiModule.forRoot(InMemoryDataService, {dataEncapsulation: false})),
     // ...
   ],
 };