diff --git a/talks/assets/images/monorepo-with-nx/crying.gif b/talks/assets/images/monorepo-with-nx/crying.gif new file mode 100644 index 0000000..c3410fb Binary files /dev/null and b/talks/assets/images/monorepo-with-nx/crying.gif differ diff --git a/talks/assets/images/monorepo-with-nx/executor-purpose-pre.png b/talks/assets/images/monorepo-with-nx/executor-purpose-pre.png new file mode 100644 index 0000000..9206031 Binary files /dev/null and b/talks/assets/images/monorepo-with-nx/executor-purpose-pre.png differ diff --git a/talks/assets/images/monorepo-with-nx/generator-purpose-pre.png b/talks/assets/images/monorepo-with-nx/generator-purpose-pre.png new file mode 100644 index 0000000..ab9dcda Binary files /dev/null and b/talks/assets/images/monorepo-with-nx/generator-purpose-pre.png differ diff --git a/talks/assets/images/monorepo-with-nx/money-money.gif b/talks/assets/images/monorepo-with-nx/money-money.gif new file mode 100644 index 0000000..149558a Binary files /dev/null and b/talks/assets/images/monorepo-with-nx/money-money.gif differ diff --git a/talks/slides-markdown/monorepos-with-nx/hook.md b/talks/slides-markdown/monorepos-with-nx/hook.md index d191e03..7bdb869 100644 --- a/talks/slides-markdown/monorepos-with-nx/hook.md +++ b/talks/slides-markdown/monorepos-with-nx/hook.md @@ -43,7 +43,7 @@ Notes: ;VS; -##### And for the next 18-ish minutes, +##### And for the next 40-ish minutes, ##### that's what we'll talk about Notes: diff --git a/talks/slides-markdown/monorepos-with-nx/main.md b/talks/slides-markdown/monorepos-with-nx/main.md index 3e57230..1d02dac 100644 --- a/talks/slides-markdown/monorepos-with-nx/main.md +++ b/talks/slides-markdown/monorepos-with-nx/main.md @@ -139,7 +139,8 @@ Notes: -![rich](assets/images/monorepo-with-nx/dreaming-rich.webp) + +![rich](assets/images/monorepo-with-nx/money-money.gif) Notes: - Money money money, yeah baby! @@ -162,6 +163,11 @@ Notes: - People started using React Native more - And my course didn't sell as well as we thought +;VS; + +![crying](assets/images/monorepo-with-nx/crying.gif) + + ;HS; @@ -379,13 +385,21 @@ Notes: ;VS; -### The first goal was to enable the readers to do the following: +### The first goal was to enable the readers to NOT do the following: ```bash -npm run serve chapter01-cc-inputs-outputs +cd start && nx serve chapter01-cc-inputs-outputs ❌ +``` + +### And do this instead: + + +```bash +npm run serve chapter01-cc-inputs-outputs ✅ # OR -npm run serve chapter01-cc-inputs-outputs final +npm run serve chapter01-cc-inputs-outputs final ✅ ``` + Notes: - Which means they shouldn't have to cd into any folder @@ -407,7 +421,7 @@ npm run serve cc-inputs-outputs # ✅ > serve-projects.sh ```bash -cd "start" && npx nx serve "$APP_NAME" --port=4200 -o +cd start && npx nx serve "$APP_NAME" --port=4200 -o ``` > package.json @@ -420,6 +434,7 @@ cd "start" && npx nx serve "$APP_NAME" --port=4200 -o } } ``` + Notes: - The script just cds into the directory and serves the app, and opens it in a new browser tab @@ -432,12 +447,13 @@ With this change, I could now simply run from my workspace root ```bash npm run serve chapter01-cc-inputs-outputs ``` + OR ```bash # runs the app from the `final` NX workspace npm run serve chapter01-cc-inputs-outputs final - ``` + ;VS; @@ -501,6 +517,7 @@ npm run serve cc-inputs-outputs # ✅ # Why?? ;VS; + Let's have a look at how I was creating the applications for my book then: @@ -512,14 +529,15 @@ cd start && npx nx g @nrwl/angular:application chapter01/cc-ng-on-changes The above generates an app with the name *`chapter01-cc-ng-on-changes`* - + Notes: - Since we want to create the app inside the chapter folder, the chapter name becomes a part of the path. Thus becoming a part of the app's name by NX. ;VS; - -*`chapter01-cc-ng-on-changes`* + +*`chapter01-cc-ng-on-changes`* + ![thinking-maths](assets/memes/thinking-maths.gif) @@ -538,7 +556,12 @@ Notes: - Nx executors ;VS; - + + +![Generator purpose](assets/images/monorepo-with-nx/generator-purpose-pre.png) + +;VS; + ![Generator purpose](assets/images/monorepo-with-nx/generator-purpose.png) @@ -562,9 +585,14 @@ Notes: ![Generator code generated](assets/images/angular-schematics/generator-project-code.png) ;VS; - + +![Executor purpose](assets/images/monorepo-with-nx/executor-purpose-pre.png) + +;VS; + + ![Executor purpose](assets/images/monorepo-with-nx/executor-purpose.png) Notes: @@ -616,7 +644,7 @@ APP_FULL_NAME=`echo "$CHAPTER/$APP_NAME" | sed -r 's/[/]+/-/g'` APP_TITLE=$3 echo "creating project for start" -cd "start" && npx nx g @codewithahsan/ng-cookbook-recipe:ng-cookbook-recipe \ +cd start && npx nx g @codewithahsan/ng-cookbook-recipe:ng-cookbook-recipe \ "$APP_NAME" --title="$APP_TITLE" --directory="$CHAPTER" --style scss\ --routing --e2eTestRunner none --skipDefaultProject --addTailwind @@ -993,7 +1021,7 @@ And [this](https://packtpublishing.github.io/Angular-Cookbook-2E/chapter12/ng-pe

Muhammad Ahsan Ayaz

GDE in Angular

Software Architect at Scania Group

-

Co-Founder at VisionWise & IOMechs

+