mirror of
https://github.com/Raghu-Ch/angular-challenges.git
synced 2026-02-10 12:53:03 -05:00
fix: typos 5 readmes
This commit is contained in:
@@ -30,7 +30,7 @@ The goal of the challenge is to debug this application and make it work.
|
||||
<details>
|
||||
<summary>Hint 1</summary>
|
||||
|
||||
If you comment out `routerLinkActive="isSelected"` inside `NavigationComponent`: the application loads correctly.
|
||||
If you comment out `routerLinkActive="isSelected"` inside `NavigationComponent`, the application loads correctly.
|
||||
</details>
|
||||
|
||||
<details>
|
||||
|
||||
@@ -19,7 +19,7 @@ WIP: The following documentation will be reviewed and improved. However, you can
|
||||
|
||||
The goal of this challenge is to separate the behavior of a component from its style. For the purpose of this challenge, we will be working on a button element. When we click on it, we will toggle a _disabled_ property which will change the style of the element. This is quite useless in real life but the challenge aims to demonstate a useful concept.
|
||||
|
||||
The behavior of the component (referred to as the _brain_ in the Spartan stack) is located in the brain library. The styling part (referred to as the _helmet_) is located inside the helmet library. Both libraries cannot depend on each other because we want to be able to publish them separatly. To help us address the issue, we are using the Nx enforce eslint rule. You can find more details [here](https://nx.dev/core-features/enforce-module-boundaries);
|
||||
The behavior of the component (referred to as the _brain_ in the Spartan stack) is located in the brain library. The styling part (referred to as the _helmet_) is located inside the helmet library. Both libraries cannot depend on each other because we want to be able to publish them separatly. To help us address the issue, we are using the Nx enforce eslint rule. You can find more details [here](https://nx.dev/core-features/enforce-module-boundaries).
|
||||
|
||||
However the button's helmet needs to access the state of the component to style the button differently based on its state. As mention above, we cannot import the `BtnDisabledDirective` directly into the helmet library as done currently. If you go to [`BtnHelmetDirective`](../../libs/decoupling/helmet/src/lib/btn-style.directive.ts), you will encounter a linting error. **A project tagged with "type:hlm" can only depend on libs tagged with "type:core"**.
|
||||
|
||||
|
||||
@@ -21,9 +21,9 @@ However the context of **NgTemplateOutlet** type is **Object**. But which the he
|
||||
|
||||
## Statement
|
||||
|
||||
In this exercice, we want to learn how to strongly typed our ng-template in our AppComponent.
|
||||
In this exercice, we want to learn how to strongly type our ng-template in our AppComponent.
|
||||
|
||||
This exercice has two level of complexity.
|
||||
This exercice has two levels of complexity.
|
||||
|
||||
### Level 1: known Interface
|
||||
|
||||
|
||||
@@ -33,7 +33,7 @@ In LoginComponent, you will find 6 buttons corresponding at 6 differents users.
|
||||
|
||||
## Step 1
|
||||
|
||||
In **InformationComponent**, display the correct piece of information for each roles.
|
||||
In **InformationComponent**, display the correct piece of information for each role.
|
||||
|
||||
### Constraints:
|
||||
|
||||
|
||||
@@ -14,13 +14,13 @@ WIP: The following documentation will be reviewed and improved. However, you can
|
||||
|
||||
## Information
|
||||
|
||||
NgRx Effect is a very powerful library develop by the NgRx team. Effects subscribe to a HOT Observable and listen to any event dispatch from any place inside the application.
|
||||
NgRx Effect is a very powerful library developed by the NgRx team. Effects subscribe to a HOT Observable and listen to any event dispatched from any place inside the application.
|
||||
|
||||
But what we often forget is that Effects can subscribe to ANY observables. Which means we can wrap a hot observable inside an effect and had logic in it.
|
||||
But what we often forget is that Effects can subscribe to ANY observable. Which means we can wrap a hot observable inside an effect and had logic in it.
|
||||
|
||||
In this exercice, we will find a way to create a very powerful, scalable and maintanable push messages listener. Currently, the code is located inside a single file with a if else condition to send the push data to the right location. This code is not very scalable since we need to add more and more else, and so not very maintanable since the piece of code will become bigger and bigger.
|
||||
In this exercice, we will find a way to create a very powerful, scalable and maintainable push messages listener. Currently, the code is located inside a single file with a if else condition to send the push data to the right location. This code is not very scalable since we need to add more and more else, and so not very maintainable since this piece of code will become bigger and bigger.
|
||||
|
||||
Also, we load the whole file at startup even if we haven't load some part of the application (lazy loading); and so we don't need to listen or update that part of the store. We need to decouple that logic.
|
||||
Also, we load the whole file at startup even if we haven't load some part of the application (lazy loading); we don't need to listen or update that part of the store. We need to decouple that logic.
|
||||
|
||||
### Step 1
|
||||
|
||||
@@ -28,9 +28,9 @@ create an injection token to hide the push service implementation.
|
||||
|
||||
### Step 2
|
||||
|
||||
create one ngrx effect, or component store effect for each push type, and implement your logic
|
||||
create one ngrx effect, or component store effect for each push type, and implement your logic.
|
||||
|
||||
### Step 3
|
||||
|
||||
load your effect only when necessary.
|
||||
the application contain a root route, a lazy loaded route and a component with a local state (implemented with Component store)
|
||||
the application contain a root route, a lazy loaded route and a component with a local state (implemented with Component store).
|
||||
|
||||
Reference in New Issue
Block a user