diff --git a/src/app/about/about.component.css b/src/app/about/about.component.css
new file mode 100644
index 0000000..59516c9
--- /dev/null
+++ b/src/app/about/about.component.css
@@ -0,0 +1,3 @@
+div {
+    color: red;
+}
\ No newline at end of file
diff --git a/src/app/about/about.component.html b/src/app/about/about.component.html
new file mode 100644
index 0000000..e397e4a
--- /dev/null
+++ b/src/app/about/about.component.html
@@ -0,0 +1,3 @@
+<div>
+  test about
+</div>
diff --git a/src/app/about/about.component.ts b/src/app/about/about.component.ts
new file mode 100644
index 0000000..f03561d
--- /dev/null
+++ b/src/app/about/about.component.ts
@@ -0,0 +1,10 @@
+import {Component} from "@angular/core";
+
+@Component({
+  selector: 'about',
+  templateUrl: 'about.component.html',
+  styleUrls: ['about.component.css'],
+})
+export class AboutComponent {
+
+}
diff --git a/src/app/about/about.module.ts b/src/app/about/about.module.ts
new file mode 100644
index 0000000..3bc44e5
--- /dev/null
+++ b/src/app/about/about.module.ts
@@ -0,0 +1,19 @@
+import {NgModule} from "@angular/core";
+import {CommonModule} from "@angular/common";
+import {RouterModule} from "@angular/router";
+
+import {AboutComponent} from "./about.component";
+
+@NgModule({
+  imports: [
+    CommonModule,
+    RouterModule.forChild([{
+      path: '', component: AboutComponent
+    }])
+  ],
+  declarations: [AboutComponent],
+  exports: [AboutComponent]
+})
+export class AboutModule {
+
+}
diff --git a/src/app/app.routing.ts b/src/app/app.routing.ts
index b30f008..5525b5d 100644
--- a/src/app/app.routing.ts
+++ b/src/app/app.routing.ts
@@ -2,14 +2,22 @@ import { NgModule} from '@angular/core';
 import { Routes, RouterModule} from '@angular/router';
 
 const appRoutes: Routes = [
-    {
-        path: '',
-        loadChildren: './home/home.module#HomeModule'
-    }
+  {
+    path: '',
+    loadChildren: './home/home.module#HomeModule'
+  },
+  {
+    path: 'about',
+    loadChildren: './about/about.module#AboutModule'
+  },
+  {
+    path: 'resources',
+    loadChildren: './resources/resources.module#ResourcesModule'
+  }
  ];
 
 @NgModule({
-    imports: [ RouterModule.forRoot(appRoutes) ],
-    exports: [ RouterModule ]
+  imports: [ RouterModule.forRoot(appRoutes) ],
+  exports: [ RouterModule ]
 })
 export class AppRoutingModule {}
diff --git a/src/app/resources/resources.component.css b/src/app/resources/resources.component.css
new file mode 100644
index 0000000..33ba737
--- /dev/null
+++ b/src/app/resources/resources.component.css
@@ -0,0 +1,3 @@
+div {
+    color: green;
+}
\ No newline at end of file
diff --git a/src/app/resources/resources.component.html b/src/app/resources/resources.component.html
new file mode 100644
index 0000000..0d748c8
--- /dev/null
+++ b/src/app/resources/resources.component.html
@@ -0,0 +1,3 @@
+<div>
+  test resources
+</div>
diff --git a/src/app/resources/resources.component.ts b/src/app/resources/resources.component.ts
new file mode 100644
index 0000000..d873ea2
--- /dev/null
+++ b/src/app/resources/resources.component.ts
@@ -0,0 +1,10 @@
+import {Component} from "@angular/core";
+
+@Component({
+  selector: 'resources',
+  templateUrl: 'resources.component.html',
+  styleUrls: ['resources.component.css'],
+})
+export class ResourcesComponent {
+
+}
diff --git a/src/app/resources/resources.module.ts b/src/app/resources/resources.module.ts
new file mode 100644
index 0000000..ef24f8b
--- /dev/null
+++ b/src/app/resources/resources.module.ts
@@ -0,0 +1,19 @@
+import {NgModule} from "@angular/core";
+import {CommonModule} from "@angular/common";
+import {RouterModule} from "@angular/router";
+
+import {ResourcesComponent} from "./resources.component";
+
+@NgModule({
+  imports: [
+    CommonModule,
+    RouterModule.forChild([{
+      path: '', component: ResourcesComponent
+    }])
+  ],
+  declarations: [ResourcesComponent],
+  exports: [ResourcesComponent]
+})
+export class ResourcesModule {
+
+}