From 0278f3431e4a866750fd009ccb3ac6bc9925b7b2 Mon Sep 17 00:00:00 2001 From: kabrunko-dev Date: Thu, 14 Dec 2023 10:34:03 -0300 Subject: [PATCH] docs(challenge-1): add extra section for bonus challenges --- docs/src/content/docs/challenges/angular/1-projection.md | 6 ++++++ .../content/docs/pt-br/challenges/angular/1-projection.md | 6 ++++++ 2 files changed, 12 insertions(+) diff --git a/docs/src/content/docs/challenges/angular/1-projection.md b/docs/src/content/docs/challenges/angular/1-projection.md index 33eff99..1602510 100644 --- a/docs/src/content/docs/challenges/angular/1-projection.md +++ b/docs/src/content/docs/challenges/angular/1-projection.md @@ -35,3 +35,9 @@ While the application works, the developer experience is far from being optimal. - The `NgFor` directive must be declared and remain inside the `CardComponent`. You might be tempted to move it to the `ParentCardComponent` like `TeacherCardComponent`. - `CardComponent` should not contain any `NgIf` or `NgSwitch`. - CSS: try to avoid using `::ng-deep`. Find a better way to handle CSS styling. + +## Bonus Challenges + +- Try to work with the new built-in control flow syntax for loops and conditionals (documentation [here](https://angular.dev/guide/templates/control-flow)) +- Use the signal API to manage your components state (documentation [here](https://angular.dev/guide/signals)) +- To reference the template, use a directive instead of magic strings diff --git a/docs/src/content/docs/pt-br/challenges/angular/1-projection.md b/docs/src/content/docs/pt-br/challenges/angular/1-projection.md index d507cc9..352c175 100644 --- a/docs/src/content/docs/pt-br/challenges/angular/1-projection.md +++ b/docs/src/content/docs/pt-br/challenges/angular/1-projection.md @@ -35,3 +35,9 @@ Apesar da aplicação funcionar, a experiência do desenvolvedor (DX) está nem - A diretiva `NgFor` deve ser declarada e permanecer dentro do `CardComponent`. Você pode ficar instigado em querer mover ela para o `ParentCardComponent` como `TeacherCardComponent`. - `CardComponent` não deve conter nenhum `NgIf` ou `NgSwitch`. - CSS: tente evitar usar `::ng-deep`. Ache uma maneira melhor para lidar com o CSS. + +## Desafios Bônus + +- Tente trabalhar com a nova sintaxe nativa de controle de fluxo para laços e condicionais (documentação [aqui](https://angular.dev/guide/templates/control-flow)) +- Usa a signal API para gerenciar o estado de seus componentes (documentação [aqui](https://angular.dev/guide/signals)) +- Para referenciar o template, use uma diretiva ao invés de strings mágicas