Angular Universal Course

Author: Your Name

.angular-cli.json

@@ -27,6 +27,31 @@
         "dev": "environments/environment.ts",
         "prod": "environments/environment.prod.ts"
       }
+    },
+    {
+      "root": "src",
+      "outDir": "dist-server",
+      "assets": [
+        "assets",
+        "favicon.ico"
+      ],
+      "index": "index.html",
+      "main": "main.server.ts",
+      "test": "test.ts",
+      "tsconfig": "tsconfig.server.json",
+      "testTsconfig": "tsconfig.spec.json",
+      "prefix": "",
+      "styles": [
+        "styles.scss"
+      ],
+      "scripts": [],
+      "environmentSource": "environments/environment.ts",
+      "environments": {
+        "dev": "environments/environment.ts",
+        "prod": "environments/environment.prod.ts"
+      },
+      "platform": "server",
+      "name": "ssr-app"
     }
   ],
   "e2e": {

.gitignore

@@ -50,3 +50,5 @@ Thumbs.db
 
 dist-server
 prerender.html
+
+dist-server

src/app/app.module.ts

@@ -40,7 +40,7 @@ import { HttpClientModule} from '@angular/common/http';
         CourseDialogComponent,
     ],
     imports: [
-        BrowserModule,
+        BrowserModule.withServerTransition({ appId: 'serverApp' }),
         BrowserAnimationsModule,
         MatMenuModule,
         MatButtonModule,

src/main.ts

@@ -11,6 +11,8 @@ if (environment.production) {
 }
 
 document.addEventListener('DOMContentLoaded', () => {
+  document.addEventListener('DOMContentLoaded', () => {
   platformBrowserDynamic().bootstrapModule(AppModule)
   .catch(err => console.log(err));
 });
+});