First working version

src/app/app-content.component.ts

@@ -0,0 +1,8 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-content',
+  template: '<div>Hello daar</div>'
+})
+export class AppContentComponent {
+}

src/app/app-routing.module.ts

@@ -0,0 +1,16 @@
+import { NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+
+import { AuthGuard } from '@farmmaps/common';
+import { AppContentComponent} from './app-content.component';
+
+const routes = [
+  { path: '', canLoad: [AuthGuard], component: AppContentComponent}
+];
+
+@NgModule({
+  imports: [RouterModule.forRoot(routes,
+    { initialNavigation: false })], // ,  enableTracing: true
+  exports: [RouterModule]
+})
+export class AppRoutingModule { }

src/app/app.component.html

@@ -5,12 +5,8 @@
   </h1>
   <img width="300" alt="Angular Logo" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTAgMjUwIj4KICAgIDxwYXRoIGZpbGw9IiNERDAwMzEiIGQ9Ik0xMjUgMzBMMzEuOSA2My4ybDE0LjIgMTIzLjFMMTI1IDIzMGw3OC45LTQzLjcgMTQuMi0xMjMuMXoiIC8+CiAgICA8cGF0aCBmaWxsPSIjQzMwMDJGIiBkPSJNMTI1IDMwdjIyLjItLjFWMjMwbDc4LjktNDMuNyAxNC4yLTEyMy4xTDEyNSAzMHoiIC8+CiAgICA8cGF0aCAgZmlsbD0iI0ZGRkZGRiIgZD0iTTEyNSA1Mi4xTDY2LjggMTgyLjZoMjEuN2wxMS43LTI5LjJoNDkuNGwxMS43IDI5LjJIMTgzTDEyNSA1Mi4xem0xNyA4My4zaC0zNGwxNy00MC45IDE3IDQwLjl6IiAvPgogIDwvc3ZnPg==">
 </div>
-<h2>Material Test</h2>
-<farmmaps-material></farmmaps-material>
-<h2>Material Test Cropfield Selector</h2>
 <h2>Common Test</h2>
-<lib-common></lib-common>
-<farmmaps-cropfield-selector></farmmaps-cropfield-selector>
+<router-outlet></router-outlet>
 <ul>
 <h2>Here are some links to help you start: </h2>
 <ul>

src/app/app.module.ts

@@ -1,18 +1,57 @@
+import {
+  NgModule,
+  Inject,
+  APP_BOOTSTRAP_LISTENER,
+  InjectionToken, Type,
+} from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
-import { NgModule } from '@angular/core';
 
 import { AppComponent } from './app.component';
-import { MaterialModule } from 'material';
-import { CommonModule } from '@farmmaps/common';
+import { AppContentComponent } from './app-content.component';
+import { AppCommonModule } from '@farmmaps/common';
+
+import {StoreModule, Store} from '@ngrx/store';
+import {EffectsModule, EffectSources} from '@ngrx/effects';
+import { StoreRouterConnectingModule} from '@ngrx/router-store';
+
+import {AppRoutingModule} from './app-routing.module';
+
+export const BOOTSTRAP_EFFECTS = new InjectionToken('Bootstrap Effects');
+
+export function bootstrapEffects(effects: Type<any>[], sources: EffectSources) {
+  return () => {
+    effects.forEach(effect => sources.addEffects(effect));
+  };
+}
+
+export function createInstances(...instances: any[]) {
+  return instances;
+}
+
+export function provideBootstrapEffects(effects: Type<any>[]) {
+  return [
+    effects,
+    {provide: BOOTSTRAP_EFFECTS, deps: effects, useFactory: createInstances},
+    {
+      provide: APP_BOOTSTRAP_LISTENER,
+      multi: true,
+      useFactory: bootstrapEffects,
+      deps: [[new Inject(BOOTSTRAP_EFFECTS)], EffectSources],
+    },
+  ];
+}
 
 @NgModule({
   declarations: [
-    AppComponent
+    AppComponent,
+    AppContentComponent
   ],
   imports: [
+    AppRoutingModule,
+    AppCommonModule.forRoot() ,
     BrowserModule,
-    MaterialModule,
-    CommonModule 
+    StoreModule.forRoot({}),
+    EffectsModule.forRoot([])
   ],
   providers: [],
   bootstrap: [AppComponent]