Merge pull request #604 from kabrunko-dev/docs/translate-challenge-45

docs(pt): translate challenge 45

45-react-in-angular.md

@@ -0,0 +1,76 @@
+---
+title: 🔴 React em angular
+description: Desafio 5 é sobre aprender como se beneficiar das várias bibliotecas em React
+author: wandrille-guesdon
+challengeNumber: 45
+command: angular-react-in-angular
+sidebar:
+  order: 209
+  badge: New
+---
+
+O objetivo deste desafio é usar um componente React dentro de uma aplicação Angular.
+
+Muitos componentes estão disponíveis em React, e pode ser interessante usar eles em uma aplicação Angular. O objetivo é criar um componente React e usar em uma aplicação Angular.
+
+## Informação
+
+Neste desafio temos uma simples aplicação e um componente React `ReactPost` em `app/react` para ilustrar um componente React de uma biblioteca. 
+
+## Declaração
+
+- Sua tarefa é mostrar as postagens com o componente React `ReactPost`.
+- Quando selecionar uma postagem, a postagem deve ser destacada.
+
+Para brincar com o componente React, você deve começar instalando as dependências do React.
+
+```bash
+npm i --save react react-dom
+npm i --save-dev @types/react @types/react-dom
+```
+
+## Restrições
+
+- Não transforme o componente React em um componente Angular. O componente React é bem simples e pode ser escrito facilmente em Angular. No entanto, o **objetivo é usar o componente React**.
+
+### Dica
+
+<details>
+  <summary>Dica 1 - Configuração</summary>
+  Permita arquivos React no tsconfig.json
+
+```
+{
+...
+"compilerOptions": {
+  ...
+  "jsx": "react"
+},
+...
+}
+```
+
+</details>
+
+<details>
+  <summary>Dica 2 - Initialização</summary>
+  Crie uma raiz react com `createRoot(...)`
+</details>
+
+<details>
+  <summary>Dica 3 - Visualização</summary>
+  Para renderizar o componente, ele deve parecer com:
+    ```
+    <react root>.render(
+        <React.StrictMode>
+        ...
+        </React.StrictMode>
+    )
+    ```
+
+</details>
+
+<details>
+  <summary>Dica 4 - Design</summary>
+  Não esqueça de permitir o arquivo react no Tailwind.
+</details>