- add dashboard and angular routing files

- npm updates
- changes in webpack.common.js

src/app/dashboard/dashboard.component.css

@@ -0,0 +1,51 @@
+/* DashboardComponent's private CSS styles */
+
+h2 {
+    text-align: center;
+  }
+  
+  .heroes-menu {
+    padding: 0;
+    margin: auto;
+    max-width: 1000px;
+  
+    /* flexbox */
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    justify-content: space-around;
+    align-content: flex-start;
+    align-items: flex-start;
+  }
+  
+  a {
+    background-color: #3f525c;
+    border-radius: 2px;
+    padding: 1rem;
+    font-size: 1.2rem;
+    text-decoration: none;
+    display: inline-block;
+    color: #fff;
+    text-align: center;
+    width: 100%;
+    min-width: 70px;
+    margin: .5rem auto;
+    box-sizing: border-box;
+  
+    /* flexbox */
+    order: 0;
+    flex: 0 1 auto;
+    align-self: auto;
+  }
+  
+  @media (min-width: 600px) {
+    a {
+      width: 18%;
+      box-sizing: content-box;
+    }
+  }
+  
+  a:hover {
+    background-color: #000;
+  }
+  

src/app/dashboard/dashboard.component.html

@@ -0,0 +1,7 @@
+<h2>Top Heroes</h2>
+<div class="heroes-menu">
+  <a *ngFor="let station of stations"
+    routerLink="/detail/{{station.id}}">
+    {{ station.label }}
+  </a>
+</div>

src/app/dashboard/dashboard.component.ts

@@ -0,0 +1,25 @@
+import { Component, OnInit } from '@angular/core';
+import { StationService } from '../services/station.service';
+import { Station } from '../../shared/models/station';
+
+@Component({
+	selector: 'app-dashboard',
+	templateUrl: './dashboard.component.html',
+	styleUrls: ['./dashboard.component.css']
+})
+export class DashboardComponent implements OnInit {
+
+	public stations: Station[] = [];
+
+	constructor(private stationService: StationService) { }
+
+	ngOnInit() {
+		this.getStations();
+	}
+
+	getStations(): void {
+		this.stationService.getStations()
+			.subscribe(stations => this.stations = stations);
+	}
+
+}