Reduce diff between dev and main branch (#36)

Author: fisker

aio/content/examples/ssr/doc-files/app/app.component.ts

@@ -0,0 +1,13 @@
+// Old AppComponent, before refactoring
+import { Component } from '@angular/core';
+import { RouterLink, RouterOutlet } from '@angular/router';
+
+@Component({
+  standalone: true,
+  selector: 'app-root',
+  template: '... the template ...',
+  imports: [ RouterLink, RouterOutlet ]
+})
+export class AppComponent {
+  title = 'Tour of Heroes';
+}

aio/content/examples/ssr/doc-files/main.old.ts

@@ -0,0 +1,39 @@
+// #region Dummy components to satisfy the router
+import { Component } from '@angular/core';
+
+@Component({ standalone: true, selector: 'app-dashboard', template: '' })
+
+class DashboardComponent {}
+@Component({ standalone: true, selector: 'app-dashboard', template: '' })
+class HeroDetailComponent {}
+
+@Component({ standalone: true, selector: 'app-dashboard', template: '' })
+class HeroesComponent {}
+
+// #endregion Dummy components to satisfy the router
+
+// #docregion
+
+import { bootstrapApplication } from '@angular/platform-browser';
+import { provideRouter, Routes} from '@angular/router';
+import { provideHttpClient } from '@angular/common/http';
+
+import { AppComponent } from './app/app.component';
+
+// ... more imports ...
+
+export const routes: Routes = [
+  { path: '', redirectTo: '/dashboard', pathMatch: 'full' },
+  { path: 'dashboard', component: DashboardComponent },
+  { path: 'detail/:id', component: HeroDetailComponent },
+  { path: 'heroes', component: HeroesComponent }
+];
+
+bootstrapApplication(AppComponent, {
+  providers: [
+    provideRouter(routes),
+    provideHttpClient(),
+  ]
+}).catch(err => console.error(err));
+
+// #enddocregion

aio/content/examples/ssr/readme.md

@@ -0,0 +1,9 @@
+# Instructions for Angular SSR Example Download
+
+This is the downloaded sample code for the [Angular SSR (Standalone) guide](https://angular.io/guide/ssr).
+
+## Install and Run
+
+1. `npm install` to install the `node_module` packages
+2. `ng serve` to launch the dev-server
+3. Launch the browser to `http://localhost:4200`

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

@@ -0,0 +1,9 @@
+import { mergeApplicationConfig, ApplicationConfig } from '@angular/core';
+import { provideServerRendering } from '@angular/platform-server';
+import { appConfig } from './app.config';
+
+const serverConfig: ApplicationConfig = {
+  providers: [provideServerRendering()],
+};
+
+export const config = mergeApplicationConfig(appConfig, serverConfig);

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

@@ -0,0 +1,26 @@
+// #docplaster
+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 {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: 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})),
+    // ...
+  ],
+};