From 76afa3c0d6d176f451a67bde9c84213165091fcb Mon Sep 17 00:00:00 2001 From: thomas Date: Mon, 26 Dec 2022 09:04:00 +0100 Subject: [PATCH 001/875] feat(challenge5): add blog post --- apps/crud/README.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/apps/crud/README.md b/apps/crud/README.md index 943893704..e2d9b2f6c 100644 --- a/apps/crud/README.md +++ b/apps/crud/README.md @@ -59,6 +59,8 @@ this.todos = [ 6. Commit your work 7. Submit a PR with a title beginning with **Answer:3** that I will review and other dev can review. -Http +Crud solution +Crud solution author +Crud blog article _You can ask any question on_ Twitter From dc0aa213e5bbdd15e9f8defdf0213a451ac85f3d Mon Sep 17 00:00:00 2001 From: thomas Date: Tue, 27 Dec 2022 09:35:56 +0100 Subject: [PATCH 002/875] feat(update): update rx angular --- package-lock.json | 36 ++++++++++++++++++------------------ package.json | 4 ++-- 2 files changed, 20 insertions(+), 20 deletions(-) diff --git a/package-lock.json b/package-lock.json index 3274bc6c0..9089d10d4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -29,9 +29,9 @@ "@ngrx/router-store": "15.0.0", "@ngrx/store": "15.0.0", "@nrwl/angular": "15.3.0", - "@rx-angular/cdk": "^1.0.0-rc.3", + "@rx-angular/cdk": "^1.0.0-rc.4", "@rx-angular/state": "^1.7.0", - "@rx-angular/template": "^1.0.0-rc.4", + "@rx-angular/template": "^1.0.0-rc.5", "rxjs": "~7.5.0", "tailwindcss": "^3.2.1", "tslib": "^2.3.0", @@ -7497,12 +7497,12 @@ } }, "node_modules/@rx-angular/cdk": { - "version": "1.0.0-rc.3", - "resolved": "https://registry.npmjs.org/@rx-angular/cdk/-/cdk-1.0.0-rc.3.tgz", - "integrity": "sha512-1jUryB+IQIIoCymrHrHQ59LBkTr4Pfpg7cNF9bJZoenR4xIAxqhcsv6pTHN7CjKydGINI7sylz5U+TFPQGpLkA==", + "version": "1.0.0-rc.4", + "resolved": "https://registry.npmjs.org/@rx-angular/cdk/-/cdk-1.0.0-rc.4.tgz", + "integrity": "sha512-uFl6vCTcPf52Y0mfYxGwSkl6d/wDjCI33iXM8/J0VblGitNsiVdjxGWAbleh2eLlIVZOyYTuvi3N4sA9wwymRw==", "dependencies": { "ng-morph": "^2.1.1", - "tslib": "^2.0.0" + "tslib": "^2.4.1" }, "engines": { "node": ">=10.12.0", @@ -7534,12 +7534,12 @@ } }, "node_modules/@rx-angular/template": { - "version": "1.0.0-rc.4", - "resolved": "https://registry.npmjs.org/@rx-angular/template/-/template-1.0.0-rc.4.tgz", - "integrity": "sha512-88dWW5X+M00ufOeCkcODGnRfi+Z/AGGyyrf9KatOI4Mj5ZMSvg38xQle8MlyOYHkjyxlzaxFNsVDIopjoZnA7g==", + "version": "1.0.0-rc.5", + "resolved": "https://registry.npmjs.org/@rx-angular/template/-/template-1.0.0-rc.5.tgz", + "integrity": "sha512-ldL3obon1IkmZi2M+/rcwYAcNP9xGY787Ssj8SiPKdmxTJOaCn8pRxE9ss4sLg6NJrIku4/7jVPfKFKJKol9LA==", "dependencies": { "ng-morph": "^2.1.1", - "tslib": "^2.0.0" + "tslib": "^2.4.1" }, "engines": { "node": ">=10.12.0", @@ -32326,12 +32326,12 @@ } }, "@rx-angular/cdk": { - "version": "1.0.0-rc.3", - "resolved": "https://registry.npmjs.org/@rx-angular/cdk/-/cdk-1.0.0-rc.3.tgz", - "integrity": "sha512-1jUryB+IQIIoCymrHrHQ59LBkTr4Pfpg7cNF9bJZoenR4xIAxqhcsv6pTHN7CjKydGINI7sylz5U+TFPQGpLkA==", + "version": "1.0.0-rc.4", + "resolved": "https://registry.npmjs.org/@rx-angular/cdk/-/cdk-1.0.0-rc.4.tgz", + "integrity": "sha512-uFl6vCTcPf52Y0mfYxGwSkl6d/wDjCI33iXM8/J0VblGitNsiVdjxGWAbleh2eLlIVZOyYTuvi3N4sA9wwymRw==", "requires": { "ng-morph": "^2.1.1", - "tslib": "^2.0.0" + "tslib": "^2.4.1" } }, "@rx-angular/state": { @@ -32344,12 +32344,12 @@ } }, "@rx-angular/template": { - "version": "1.0.0-rc.4", - "resolved": "https://registry.npmjs.org/@rx-angular/template/-/template-1.0.0-rc.4.tgz", - "integrity": "sha512-88dWW5X+M00ufOeCkcODGnRfi+Z/AGGyyrf9KatOI4Mj5ZMSvg38xQle8MlyOYHkjyxlzaxFNsVDIopjoZnA7g==", + "version": "1.0.0-rc.5", + "resolved": "https://registry.npmjs.org/@rx-angular/template/-/template-1.0.0-rc.5.tgz", + "integrity": "sha512-ldL3obon1IkmZi2M+/rcwYAcNP9xGY787Ssj8SiPKdmxTJOaCn8pRxE9ss4sLg6NJrIku4/7jVPfKFKJKol9LA==", "requires": { "ng-morph": "^2.1.1", - "tslib": "^2.0.0" + "tslib": "^2.4.1" } }, "@schematics/angular": { diff --git a/package.json b/package.json index 3271fced5..eb294915b 100644 --- a/package.json +++ b/package.json @@ -31,9 +31,9 @@ "@ngrx/router-store": "15.0.0", "@ngrx/store": "15.0.0", "@nrwl/angular": "15.3.0", - "@rx-angular/cdk": "^1.0.0-rc.3", + "@rx-angular/cdk": "^1.0.0-rc.4", "@rx-angular/state": "^1.7.0", - "@rx-angular/template": "^1.0.0-rc.4", + "@rx-angular/template": "^1.0.0-rc.5", "rxjs": "~7.5.0", "tailwindcss": "^3.2.1", "tslib": "^2.3.0", From d85f70ff3a65a3869be341f37925217f6e1607cf Mon Sep 17 00:00:00 2001 From: thomas Date: Wed, 28 Dec 2022 14:24:52 +0100 Subject: [PATCH 003/875] feat(challenge12): add challenge 12 scroll cd --- README.md | 3 +-- apps/scroll-cd/README.md | 4 +++- 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 27dbf6bf8..07e80946f 100644 --- a/README.md +++ b/README.md @@ -31,8 +31,7 @@ This goal of this project is to help you get better at Angular and NgRx by resol pipe easy wrapFn pipe utilities pipe - - +change detection with scroll event
RxJs diff --git a/apps/scroll-cd/README.md b/apps/scroll-cd/README.md index f5e089f3d..807c7c890 100644 --- a/apps/scroll-cd/README.md +++ b/apps/scroll-cd/README.md @@ -4,12 +4,14 @@ ### Information -This challenge will teach you how to avoid unnecessary change detection cycles. +In this challenge, you will need to optimize the change detection cycles run by Angular. Zone.js will trigger a change detection cycle each time a scroll event is dispatched. However we only want to show or hide a button at a specific scroll position. Therefore, we only want to refresh our application once. > You can vizualise how many times CD is triggered by installing the [Angular chrome devTool](https://chrome.google.com/webstore/detail/angular-devtools/ienfalfjdbdpebioblfackkekamfmbnh) and starting a new recording on the profiler tab. +The following video will explain what is the goal of this challenge. + ### Statement Your goal for this challenge is to avoid all those unnecessary change detection cycle and trigger a CD only when needed. From 248d382c79c5cd2cfb4303f119b01474a1b65321 Mon Sep 17 00:00:00 2001 From: Laforge Thomas <30832608+tomalaforge@users.noreply.github.com> Date: Wed, 28 Dec 2022 14:26:57 +0100 Subject: [PATCH 004/875] feat(challenge12): update readme to add a video --- apps/scroll-cd/README.md | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/apps/scroll-cd/README.md b/apps/scroll-cd/README.md index 807c7c890..3692c7b13 100644 --- a/apps/scroll-cd/README.md +++ b/apps/scroll-cd/README.md @@ -6,15 +6,16 @@ In this challenge, you will need to optimize the change detection cycles run by Angular. -Zone.js will trigger a change detection cycle each time a scroll event is dispatched. However we only want to show or hide a button at a specific scroll position. Therefore, we only want to refresh our application once. +Zone.js triggers a change detection cycle each time a scroll event is dispatched. However we only want to show or hide a button at a specific scroll position. Therefore, we only want to refresh our application once. > You can vizualise how many times CD is triggered by installing the [Angular chrome devTool](https://chrome.google.com/webstore/detail/angular-devtools/ienfalfjdbdpebioblfackkekamfmbnh) and starting a new recording on the profiler tab. The following video will explain what is the goal of this challenge. +https://user-images.githubusercontent.com/30832608/209819211-58d9ddcf-e1ad-4a78-8a7a-2be9d729e3f1.mov ### Statement -Your goal for this challenge is to avoid all those unnecessary change detection cycle and trigger a CD only when needed. +Your goal for this challenge is to avoid all unnecessary change detection cycles and trigger a CD only when needed. #### Constraint: From 37bf62b819ef3239208df4d7aaf6c8fab150ae61 Mon Sep 17 00:00:00 2001 From: thomas Date: Wed, 28 Dec 2022 14:31:03 +0100 Subject: [PATCH 005/875] feat(challenge12): add video embedded --- apps/scroll-cd/README.md | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/apps/scroll-cd/README.md b/apps/scroll-cd/README.md index 3692c7b13..ea124c167 100644 --- a/apps/scroll-cd/README.md +++ b/apps/scroll-cd/README.md @@ -11,7 +11,10 @@ Zone.js triggers a change detection cycle each time a scroll event is dispatched > You can vizualise how many times CD is triggered by installing the [Angular chrome devTool](https://chrome.google.com/webstore/detail/angular-devtools/ienfalfjdbdpebioblfackkekamfmbnh) and starting a new recording on the profiler tab. The following video will explain what is the goal of this challenge. -https://user-images.githubusercontent.com/30832608/209819211-58d9ddcf-e1ad-4a78-8a7a-2be9d729e3f1.mov + + ### Statement From c0c57b5db333d6547901708bc259badf3541c215 Mon Sep 17 00:00:00 2001 From: thomas Date: Wed, 28 Dec 2022 14:33:36 +0100 Subject: [PATCH 006/875] feat(test): test --- apps/scroll-cd/README.md | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/apps/scroll-cd/README.md b/apps/scroll-cd/README.md index ea124c167..c1f87b61d 100644 --- a/apps/scroll-cd/README.md +++ b/apps/scroll-cd/README.md @@ -12,8 +12,7 @@ Zone.js triggers a change detection cycle each time a scroll event is dispatched The following video will explain what is the goal of this challenge. -