first commit

angular.json

@@ -28,6 +28,7 @@
               "src/assets"
             ],
             "styles": [
+              "./node_modules/@angular/material/prebuilt-themes/deeppurple-amber.css",
               "src/styles.sass"
             ],
             "scripts": []
@@ -93,6 +94,7 @@
               "src/assets"
             ],
             "styles": [
+              "./node_modules/@angular/material/prebuilt-themes/deeppurple-amber.css",
               "src/styles.sass"
             ],
             "scripts": []
@@ -124,6 +126,7 @@
           }
         }
       }
-    }},
+    }
+  },
   "defaultProject": "nucleo-watch-js"
 }

package.json

@@ -12,13 +12,19 @@
   "private": true,
   "dependencies": {
     "@angular/animations": "~8.2.11",
+    "@angular/cdk": "~8.2.3",
     "@angular/common": "~8.2.11",
     "@angular/compiler": "~8.2.11",
     "@angular/core": "~8.2.11",
+    "@angular/flex-layout": "^8.0.0-beta.27",
     "@angular/forms": "~8.2.11",
+    "@angular/material": "^8.2.3",
     "@angular/platform-browser": "~8.2.11",
     "@angular/platform-browser-dynamic": "~8.2.11",
     "@angular/router": "~8.2.11",
+    "@stomp/ng2-stompjs": "^7.2.0",
+    "hammerjs": "^2.0.8",
+    "ngx-json-viewer": "^2.4.0",
     "rxjs": "~6.4.0",
     "tslib": "^1.10.0",
     "zone.js": "~0.9.1"

src/app/app-routing.module.ts

@@ -1,8 +1,17 @@
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
+import { MessagesComponent } from './messages/messages.component';
+import {ListingComponent} from './listing/listing.component';
 
-
-const routes: Routes = [];
+const routes: Routes = [
+  {
+    path: '',
+    component: MessagesComponent,
+    children: [
+      { path: '', component: ListingComponent },
+    ]
+  }
+];
 
 @NgModule({
   imports: [RouterModule.forRoot(routes)],