Skip to content

Commit 4b9bc90

Browse files
7bitcoder7bitcoder
committed
add first store
1 parent e8d2cfe commit 4b9bc90

14 files changed

+7450
-165
lines changed

‎.vscode/launch.json

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
// Use IntelliSense to learn about possible attributes.
3+
// Hover to view descriptions of existing attributes.
4+
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
5+
"version": "0.2.0",
6+
"configurations": [
7+
{
8+
"type": "pwa-chrome",
9+
"request": "launch",
10+
"name": "Launch Chrome against localhost",
11+
"url": "http://localhost:4200",
12+
"webRoot": "${workspaceFolder}"
13+
}
14+
]
15+
}

‎package.json

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,8 +29,8 @@
2929
"@ngrx/effects": "^8.0.1",
3030
"@ngrx/entity": "^8.0.1",
3131
"@ngrx/router-store": "^8.0.1",
32-
"@ngrx/store": "^8.0.1",
33-
"@ngrx/store-devtools": "^8.0.1",
32+
"@ngrx/store": "13.0.2",
33+
"@ngrx/store-devtools": "13.0.2",
3434
"body-parser": "^1.18.2",
3535
"core-js": "^2.4.1",
3636
"express": "^4.16.2",
@@ -63,4 +63,4 @@
6363
"tslint": "~6.1.0",
6464
"typescript": "~4.4.4"
6565
}
66-
}
66+
}

‎server/get-courses.route.ts

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,19 @@
11

22

3-
import {Request, Response} from 'express';
4-
import {COURSES} from "./db-data";
3+
import { Request, Response } from 'express';
4+
import { COURSES } from "./db-data";
55

66

77

88
export function getAllCourses(req: Request, res: Response) {
99

10-
console.log("Retrieving courses data ...");
10+
console.log("Retrieving courses data ...");
1111

12-
setTimeout(() => {
12+
setTimeout(() => {
1313

14-
res.status(200).json({payload:Object.values(COURSES)});
14+
res.status(200).json({ payload: Object.values(COURSES) });
1515

16-
}, 1000);
16+
}, 100);
1717

1818

1919

@@ -22,17 +22,17 @@ export function getAllCourses(req: Request, res: Response) {
2222

2323
export function getCourseByUrl(req: Request, res: Response) {
2424

25-
const courseUrl = req.params["courseUrl"];
25+
const courseUrl = req.params["courseUrl"];
2626

27-
const courses:any = Object.values(COURSES);
27+
const courses: any = Object.values(COURSES);
2828

29-
const course = courses.find(course => course.url == courseUrl);
29+
const course = courses.find(course => course.url == courseUrl);
3030

31-
setTimeout(() => {
31+
setTimeout(() => {
3232

33-
res.status(200).json(course);
33+
res.status(200).json(course);
3434

35-
}, 1000);
35+
}, 100);
3636

3737

3838
}

‎server/search-lessons.route.ts

Lines changed: 21 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,40 @@
11

22

33

4-
import {Request, Response} from 'express';
5-
import {LESSONS} from "./db-data";
6-
import {setTimeout} from "timers";
4+
import { Request, Response } from 'express';
5+
import { LESSONS } from "./db-data";
6+
import { setTimeout } from "timers";
77

88

99

1010
export function searchLessons(req: Request, res: Response) {
1111

12-
console.log('Searching for lessons ...');
12+
console.log('Searching for lessons ...');
1313

14-
const queryParams = req.query;
14+
const queryParams = req.query;
1515

16-
const courseId = queryParams.courseId,
17-
filter = queryParams.filter || '',
18-
sortOrder = queryParams.sortOrder || 'asc',
19-
pageNumber = parseInt(queryParams.pageNumber) || 0,
20-
pageSize = parseInt(queryParams.pageSize);
16+
const courseId = +queryParams.courseId,
17+
filter = queryParams.filter as string || '',
18+
sortOrder = queryParams.sortOrder || 'asc',
19+
pageNumber = parseInt(queryParams.pageNumber as string) || 0,
20+
pageSize = parseInt(queryParams.pageSize as string);
2121

22-
let lessons = Object.values(LESSONS).filter(lesson => lesson.courseId == courseId).sort((l1, l2) => l1.id - l2.id);
22+
let lessons = Object.values(LESSONS).filter(lesson => lesson.courseId == courseId).sort((l1, l2) => l1.id - l2.id);
2323

24-
if (filter) {
25-
lessons = lessons.filter(lesson => lesson.description.trim().toLowerCase().search(filter.toLowerCase()) >= 0);
26-
}
24+
if (filter) {
25+
lessons = lessons.filter(lesson => lesson.description.trim().toLowerCase().search(filter.toLowerCase()) >= 0);
26+
}
2727

28-
if (sortOrder == "desc") {
29-
lessons = lessons.reverse();
30-
}
28+
if (sortOrder == "desc") {
29+
lessons = lessons.reverse();
30+
}
3131

32-
const initialPos = pageNumber * pageSize;
32+
const initialPos = pageNumber * pageSize;
3333

34-
console.log(`Retrieving lessons page starting at position ${initialPos}, page size ${pageSize} for course ${courseId}`);
34+
console.log(`Retrieving lessons page starting at position ${initialPos}, page size ${pageSize} for course ${courseId}`);
3535

36-
const lessonsPage = lessons.slice(initialPos, initialPos + pageSize);
36+
const lessonsPage = lessons.slice(initialPos, initialPos + pageSize);
3737

38-
res.status(200).json(lessonsPage);
38+
res.status(200).json(lessonsPage);
3939

4040
}

‎src/app/app.component.ts

Lines changed: 28 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
import {Component, OnInit} from '@angular/core';
2-
import {select, Store} from "@ngrx/store";
3-
import {Observable} from "rxjs";
4-
import {map} from 'rxjs/operators';
5-
import {NavigationCancel, NavigationEnd, NavigationError, NavigationStart, Router} from '@angular/router';
1+
import { Component, OnInit } from '@angular/core';
2+
import { select, Store } from "@ngrx/store";
3+
import { Observable } from "rxjs";
4+
import { map } from 'rxjs/operators';
5+
import { NavigationCancel, NavigationEnd, NavigationError, NavigationStart, Router } from '@angular/router';
66

77
@Component({
88
selector: 'app-root',
@@ -11,37 +11,37 @@ import {NavigationCancel, NavigationEnd, NavigationError, NavigationStart, Route
1111
})
1212
export class AppComponent implements OnInit {
1313

14-
loading = true;
14+
loading = true;
1515

16-
constructor(private router: Router) {
16+
constructor(private router: Router) {
1717

18-
}
18+
}
1919

20-
ngOnInit() {
20+
ngOnInit() {
2121

22-
this.router.events.subscribe(event => {
23-
switch (true) {
24-
case event instanceof NavigationStart: {
25-
this.loading = true;
26-
break;
27-
}
22+
this.router.events.subscribe(event => {
23+
switch (true) {
24+
case event instanceof NavigationStart: {
25+
this.loading = true;
26+
break;
27+
}
2828

29-
case event instanceof NavigationEnd:
30-
case event instanceof NavigationCancel:
31-
case event instanceof NavigationError: {
32-
this.loading = false;
33-
break;
34-
}
35-
default: {
36-
break;
37-
}
29+
case event instanceof NavigationEnd:
30+
case event instanceof NavigationCancel:
31+
case event instanceof NavigationError: {
32+
this.loading = false;
33+
break;
34+
}
35+
default: {
36+
break;
3837
}
39-
});
38+
}
39+
});
4040

41-
}
41+
}
4242

43-
logout() {
43+
logout() {
4444

45-
}
45+
}
4646

4747
}

‎src/app/app.module.ts

Lines changed: 25 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,25 @@
1-
import {BrowserModule} from '@angular/platform-browser';
2-
import {NgModule} from '@angular/core';
3-
4-
import {AppComponent} from './app.component';
5-
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
6-
import {MatMenuModule} from '@angular/material/menu';
7-
import {MatIconModule} from '@angular/material/icon';
8-
9-
import {MatListModule} from '@angular/material/list';
10-
import {MatSidenavModule} from '@angular/material/sidenav';
11-
import {MatToolbarModule} from '@angular/material/toolbar';
12-
import {HttpClientModule} from '@angular/common/http';
13-
14-
import {RouterModule, Routes} from '@angular/router';
15-
import {AuthModule} from './auth/auth.module';
16-
import {StoreModule} from '@ngrx/store';
17-
import {StoreDevtoolsModule} from '@ngrx/store-devtools';
18-
import {environment} from '../environments/environment';
19-
import {RouterState, StoreRouterConnectingModule} from '@ngrx/router-store';
20-
21-
import {EffectsModule} from '@ngrx/effects';
22-
import {EntityDataModule} from '@ngrx/data';
1+
import { BrowserModule } from '@angular/platform-browser';
2+
import { NgModule } from '@angular/core';
3+
4+
import { AppComponent } from './app.component';
5+
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
6+
import { MatMenuModule } from '@angular/material/menu';
7+
import { MatIconModule } from '@angular/material/icon';
8+
9+
import { MatListModule } from '@angular/material/list';
10+
import { MatSidenavModule } from '@angular/material/sidenav';
11+
import { MatToolbarModule } from '@angular/material/toolbar';
12+
import { HttpClientModule } from '@angular/common/http';
13+
14+
import { RouterModule, Routes } from '@angular/router';
15+
import { AuthModule } from './auth/auth.module';
16+
import { StoreModule } from '@ngrx/store';
17+
import { StoreDevtoolsModule } from '@ngrx/store-devtools';
18+
import { environment } from '../environments/environment';
19+
import { RouterState, StoreRouterConnectingModule } from '@ngrx/router-store';
20+
21+
import { EffectsModule } from '@ngrx/effects';
22+
import { EntityDataModule } from '@ngrx/data';
2323
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
2424

2525

@@ -51,7 +51,9 @@ const routes: Routes = [
5151
MatProgressSpinnerModule,
5252
MatListModule,
5353
MatToolbarModule,
54-
AuthModule.forRoot()
54+
AuthModule.forRoot(),
55+
StoreModule.forRoot({}, {}),
56+
StoreDevtoolsModule.instrument({ maxAge: 25, logOnly: environment.production })
5557
],
5658
bootstrap: [AppComponent]
5759
})

‎src/app/auth/auth.module.ts

Lines changed: 27 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,37 @@
1-
import {ModuleWithProviders, NgModule} from '@angular/core';
2-
import {CommonModule} from '@angular/common';
3-
import {LoginComponent} from './login/login.component';
4-
import {MatCardModule} from "@angular/material/card";
1+
import { ModuleWithProviders, NgModule } from '@angular/core';
2+
import { CommonModule } from '@angular/common';
3+
import { LoginComponent } from './login/login.component';
4+
import { MatCardModule } from "@angular/material/card";
55
import { MatInputModule } from "@angular/material/input";
6-
import {RouterModule} from "@angular/router";
7-
import {ReactiveFormsModule} from "@angular/forms";
8-
import {MatButtonModule} from "@angular/material/button";
6+
import { RouterModule } from "@angular/router";
7+
import { ReactiveFormsModule } from "@angular/forms";
8+
import { MatButtonModule } from "@angular/material/button";
99
import { StoreModule } from '@ngrx/store';
10-
import {AuthService} from "./auth.service";
10+
import { AuthService } from "./auth.service";
1111
import { EffectsModule } from '@ngrx/effects';
12+
import * as fromAuth from './reducers';
1213

1314
@NgModule({
14-
imports: [
15-
CommonModule,
16-
ReactiveFormsModule,
17-
MatCardModule,
18-
MatInputModule,
19-
MatButtonModule,
20-
RouterModule.forChild([{path: '', component: LoginComponent}]),
15+
imports: [
16+
CommonModule,
17+
ReactiveFormsModule,
18+
MatCardModule,
19+
MatInputModule,
20+
MatButtonModule,
21+
RouterModule.forChild([{ path: '', component: LoginComponent }]),
22+
StoreModule.forFeature(fromAuth.authFeatureKey, fromAuth.authReducer),
2123

22-
],
23-
declarations: [LoginComponent],
24-
exports: [LoginComponent]
24+
],
25+
declarations: [LoginComponent],
26+
exports: [LoginComponent]
2527
})
2628
export class AuthModule {
27-
static forRoot(): ModuleWithProviders<AuthModule> {
28-
return {
29-
ngModule: AuthModule,
30-
providers: [
31-
AuthService
32-
]
33-
}
29+
static forRoot(): ModuleWithProviders<AuthModule> {
30+
return {
31+
ngModule: AuthModule,
32+
providers: [
33+
AuthService
34+
]
3435
}
36+
}
3537
}

0 commit comments

Comments
 (0)