diff --git a/src/content/warnings/invalid-aria-prop.md b/src/content/warnings/invalid-aria-prop.md
index 2d3b4253e..d1c4cf540 100644
--- a/src/content/warnings/invalid-aria-prop.md
+++ b/src/content/warnings/invalid-aria-prop.md
@@ -1,11 +1,11 @@
 ---
-title: Invalid ARIA Prop Warning
+title: Aviso de Propriedade ARIA Inválida
 ---
 
-This warning will fire if you attempt to render a DOM element with an `aria-*` prop that does not exist in the Web Accessibility Initiative (WAI) Accessible Rich Internet Application (ARIA) [specification](https://www.w3.org/TR/wai-aria-1.1/#states_and_properties).
+Este aviso será disparado se você tentar renderizar um elemento DOM com uma propriedade `aria-*` que não existe na [especificação] (https://www.w3.org/TR/wai-aria-1.1/#states_and_properties) da Web Accessibility Initiative (WAI) Accessible Rich Internet Application (ARIA).
 
-1. If you feel that you are using a valid prop, check the spelling carefully. `aria-labelledby` and `aria-activedescendant` are often misspelled.
+1. Se você acredita que está usando uma propriedade válida, verifique a ortografia cuidadosamente. `aria-labelledby` e `aria-activedescendant` são frequentemente escritas de forma incorreta.
 
-2. If you wrote `aria-role`, you may have meant `role`.
+2. Se você escreveu `aria-role`, talvez tenha pretendido dizer `role`.
 
-3. Otherwise, if you're on the latest version of React DOM and verified that you're using a valid property name listed in the ARIA specification, please [report a bug](https://github.com/facebook/react/issues/new/choose).
+3. Caso contrário, se você estiver na versão mais recente do React DOM e verificou que está usando um nome de propriedade válido listado na especificação ARIA, por favor, [relate um erro](https://github.com/facebook/react/issues/new/choose).
diff --git a/src/content/warnings/invalid-hook-call-warning.md b/src/content/warnings/invalid-hook-call-warning.md
index 5bbc2bbaa..75eed4d71 100644
--- a/src/content/warnings/invalid-hook-call-warning.md
+++ b/src/content/warnings/invalid-hook-call-warning.md
@@ -1,60 +1,60 @@
 ---
-title: Rules of Hooks
+title: Regras dos Hooks
 ---
 
-You are probably here because you got the following error message:
+Provavelmente você está aqui porque recebeu a seguinte mensagem de erro:
 
 <ConsoleBlock level="error">
 
-Hooks can only be called inside the body of a function component.
+Hooks só podem ser chamados dentro do corpo de um componente de função.
 
 </ConsoleBlock>
 
-There are three common reasons you might be seeing it:
+Existem três razões comuns pelas quais você pode estar vendo isso:
 
-1. You might be **breaking the Rules of Hooks**.
-2. You might have **mismatching versions** of React and React DOM.
-3. You might have **more than one copy of React** in the same app.
+1. Você pode estar **quebrando as Regras dos Hooks**.
+2. Você pode ter **versões incompatíveis** do React e do React DOM.
+3. Você pode ter **mais de uma cópia do React** no mesmo aplicativo.
 
-Let's look at each of these cases.
+Vamos analisar cada um desses casos.
 
-## Breaking Rules of Hooks {/*breaking-rules-of-hooks*/}
+## Quebrando as Regras dos Hooks {/*breaking-rules-of-hooks*/}
 
-Functions whose names start with `use` are called [*Hooks*](/reference/react) in React.
+Funções cujos nomes começam com `use` são chamadas de [*Hooks*](/reference/react) no React.
 
-**Don’t call Hooks inside loops, conditions, or nested functions.** Instead, always use Hooks at the top level of your React function, before any early returns. You can only call Hooks while React is rendering a function component:
+**Não chame Hooks dentro de loops, condições ou funções aninhadas.** Em vez disso, sempre use Hooks no nível superior da sua função de componente React, antes de qualquer retorno antecipado. Você só pode chamar Hooks enquanto o React está renderizando um componente de função:
 
-* ✅ Call them at the top level in the body of a [function component](/learn/your-first-component).
-* ✅ Call them at the top level in the body of a [custom Hook](/learn/reusing-logic-with-custom-hooks).
+* ✅ Chame-os no nível superior no corpo de um [componente de função](/learn/your-first-component).
+* ✅ Chame-os no nível superior no corpo de um [Hook personalizado](/learn/reusing-logic-with-custom-hooks).
 
 ```js{2-3,8-9}
 function Counter() {
-  // ✅ Good: top-level in a function component
+  // ✅ Bom: no nível superior em um componente de função
   const [count, setCount] = useState(0);
   // ...
 }
 
 function useWindowWidth() {
-  // ✅ Good: top-level in a custom Hook
+  // ✅ Bom: no nível superior em um Hook personalizado
   const [width, setWidth] = useState(window.innerWidth);
   // ...
 }
 ```
 
-It’s **not** supported to call Hooks (functions starting with `use`) in any other cases, for example:
+**Não** é suportado chamar Hooks (funções começando com `use`) em outros casos, por exemplo:
 
-* 🔴 Do not call Hooks inside conditions or loops.
-* 🔴 Do not call Hooks after a conditional `return` statement.
-* 🔴 Do not call Hooks in event handlers.
-* 🔴 Do not call Hooks in class components.
-* 🔴 Do not call Hooks inside functions passed to `useMemo`, `useReducer`, or `useEffect`.
+* 🔴 Não chame Hooks dentro de condições ou loops.
+* 🔴 Não chame Hooks após uma instrução de `return` condicional.
+* 🔴 Não chame Hooks em manipuladores de eventos.
+* 🔴 Não chame Hooks em componentes de classe.
+* 🔴 Não chame Hooks dentro de funções passadas para `useMemo`, `useReducer`, ou `useEffect`.
 
-If you break these rules, you might see this error.
+Se você quebrar essas regras, poderá ver esse erro.
 
 ```js{3-4,11-12,20-21}
 function Bad({ cond }) {
   if (cond) {
-    // 🔴 Bad: inside a condition (to fix, move it outside!)
+    // 🔴 Ruim: dentro de uma condição (para corrigir, mova para fora!)
     const theme = useContext(ThemeContext);
   }
   // ...
@@ -62,7 +62,7 @@ function Bad({ cond }) {
 
 function Bad() {
   for (let i = 0; i < 10; i++) {
-    // 🔴 Bad: inside a loop (to fix, move it outside!)
+    // 🔴 Ruim: dentro de um loop (para corrigir, mova para fora!)
     const theme = useContext(ThemeContext);
   }
   // ...
@@ -72,14 +72,14 @@ function Bad({ cond }) {
   if (cond) {
     return;
   }
-  // 🔴 Bad: after a conditional return (to fix, move it before the return!)
+  // 🔴 Ruim: após um retorno condicional (para corrigir, mova para antes do retorno!)
   const theme = useContext(ThemeContext);
   // ...
 }
 
 function Bad() {
   function handleClick() {
-    // 🔴 Bad: inside an event handler (to fix, move it outside!)
+    // 🔴 Ruim: dentro de um manipulador de eventos (para corrigir, mova para fora!)
     const theme = useContext(ThemeContext);
   }
   // ...
@@ -87,7 +87,7 @@ function Bad() {
 
 function Bad() {
   const style = useMemo(() => {
-    // 🔴 Bad: inside useMemo (to fix, move it outside!)
+    // 🔴 Ruim: dentro de useMemo (para corrigir, mova para fora!)
     const theme = useContext(ThemeContext);
     return createStyle(theme);
   });
@@ -96,32 +96,32 @@ function Bad() {
 
 class Bad extends React.Component {
   render() {
-    // 🔴 Bad: inside a class component (to fix, write a function component instead of a class!)
+    // 🔴 Ruim: dentro de um componente de classe (para corrigir, escreva um componente de função em vez de uma classe!)
     useEffect(() => {})
     // ...
   }
 }
 ```
 
-You can use the [`eslint-plugin-react-hooks` plugin](https://www.npmjs.com/package/eslint-plugin-react-hooks) to catch these mistakes.
+Você pode usar o [plugin `eslint-plugin-react-hooks`](https://www.npmjs.com/package/eslint-plugin-react-hooks) para detectar esses erros.
 
 <Note>
 
-[Custom Hooks](/learn/reusing-logic-with-custom-hooks) *may* call other Hooks (that's their whole purpose). This works because custom Hooks are also supposed to only be called while a function component is rendering.
+[Hooks personalizados](/learn/reusing-logic-with-custom-hooks) *podem* chamar outros Hooks (essa é a finalidade deles). Isso funciona porque Hooks personalizados também devem ser chamados apenas enquanto um componente de função está sendo renderizado.
 
 </Note>
 
-## Mismatching Versions of React and React DOM {/*mismatching-versions-of-react-and-react-dom*/}
+## Versões Incompatíveis do React e React DOM {/*mismatching-versions-of-react-and-react-dom*/}
 
-You might be using a version of `react-dom` (< 16.8.0) or `react-native` (< 0.59) that doesn't yet support Hooks. You can run `npm ls react-dom` or `npm ls react-native` in your application folder to check which version you're using. If you find more than one of them, this might also create problems (more on that below).
+Você pode estar usando uma versão do `react-dom` (< 16.8.0) ou `react-native` (< 0.59) que ainda não suporta Hooks. Você pode executar `npm ls react-dom` ou `npm ls react-native` na pasta do seu aplicativo para verificar qual versão está usando. Se encontrar mais de uma, isso também pode criar problemas (mais sobre isso abaixo).
 
-## Duplicate React {/*duplicate-react*/}
+## Cópia Duplicada do React {/*duplicate-react*/}
 
-In order for Hooks to work, the `react` import from your application code needs to resolve to the same module as the `react` import from inside the `react-dom` package.
+Para que os Hooks funcionem, a importação de `react` no código da sua aplicação precisa ser resolvida para o mesmo módulo que a importação de `react` dentro do pacote `react-dom`.
 
-If these `react` imports resolve to two different exports objects, you will see this warning. This may happen if you **accidentally end up with two copies** of the `react` package.
+Se essas importações de `react` forem resolvidas para dois objetos de exportação diferentes, você verá este aviso. Isso pode acontecer se você **acidentalmente acabar com duas cópias** do pacote `react`.
 
-If you use Node for package management, you can run this check in your project folder:
+Se você usar Node para gerenciamento de pacotes, pode executar esta verificação na sua pasta de projeto:
 
 <TerminalBlock>
 
@@ -129,30 +129,30 @@ npm ls react
 
 </TerminalBlock>
 
-If you see more than one React, you'll need to figure out why this happens and fix your dependency tree. For example, maybe a library you're using incorrectly specifies `react` as a dependency (rather than a peer dependency). Until that library is fixed, [Yarn resolutions](https://yarnpkg.com/lang/en/docs/selective-version-resolutions/) is one possible workaround.
+Se você ver mais de um React, precisará descobrir por que isso acontece e corrigir sua árvore de dependências. Por exemplo, talvez uma biblioteca que você está usando especifica incorretamente  `react`  como uma dependência (em vez de uma dependência peer). Até que essa biblioteca seja corrigida, [resoluções do Yarn](https://yarnpkg.com/lang/en/docs/selective-version-resolutions/) são uma possível solução alternativa.
 
-You can also try to debug this problem by adding some logs and restarting your development server:
+Você também pode tentar depurar este problema adicionando alguns logs e reiniciando seu servidor de desenvolvimento:
 
 ```js
-// Add this in node_modules/react-dom/index.js
+// Adicione isso em node_modules/react-dom/index.js
 window.React1 = require('react');
 
-// Add this in your component file
+// Adicione isso no seu arquivo de componente
 require('react-dom');
 window.React2 = require('react');
 console.log(window.React1 === window.React2);
 ```
 
-If it prints `false` then you might have two Reacts and need to figure out why that happened. [This issue](https://github.com/facebook/react/issues/13991) includes some common reasons encountered by the community.
+Se imprimir `false` então você pode ter dois Reacts e precisa descobrir por que isso aconteceu. [Este problema](https://github.com/facebook/react/issues/13991) inclui algumas razões comuns encontradas pela comunidade.
 
-This problem can also come up when you use `npm link` or an equivalent. In that case, your bundler might "see" two Reacts — one in application folder and one in your library folder. Assuming `myapp` and `mylib` are sibling folders, one possible fix is to run `npm link ../myapp/node_modules/react` from `mylib`. This should make the library use the application's React copy.
+Esse problema também pode ocorrer quando você usa `npm link` ou equivalente. Nesse caso, seu bundler pode "ver" dois Reacts — um na pasta da aplicação e outro na pasta da sua biblioteca. Supondo que `myapp` e `mylib` sejam pastas irmãs, uma possível correção é executar `npm link ../myapp/node_modules/react` a partir de `mylib`. Isso deve fazer com que a biblioteca use a cópia do React da aplicação.
 
 <Note>
 
-In general, React supports using multiple independent copies on one page (for example, if an app and a third-party widget both use it). It only breaks if `require('react')` resolves differently between the component and the `react-dom` copy it was rendered with.
+Em geral, o React suporta o uso de várias cópias independentes em uma página (por exemplo, se um aplicativo e um widget de terceiros usarem). Ele só quebra se `require('react')` for resolvido de maneira diferente entre o componente e a cópia do `react-dom` com a qual foi renderizado.
 
 </Note>
 
-## Other Causes {/*other-causes*/}
+## Outras Causas {/*other-causes*/}
 
-If none of this worked, please comment in [this issue](https://github.com/facebook/react/issues/13991) and we'll try to help. Try to create a small reproducing example — you might discover the problem as you're doing it.
+Se nada disso funcionou, por favor comente neste [problema](https://github.com/facebook/react/issues/13991) e tentaremos ajudar. Tente criar um pequeno exemplo reproduzível — você pode descobrir o problema enquanto faz isso.
diff --git a/src/content/warnings/react-dom-test-utils.md b/src/content/warnings/react-dom-test-utils.md
index 794bb1d11..04e213a7b 100644
--- a/src/content/warnings/react-dom-test-utils.md
+++ b/src/content/warnings/react-dom-test-utils.md
@@ -1,34 +1,34 @@
 ---
-title: react-dom/test-utils Deprecation Warnings
+title: Avisos de Depreciação do react-dom/test-utils
 ---
 
-## ReactDOMTestUtils.act() warning {/*reactdomtestutilsact-warning*/}
+## Aviso do ReactDOMTestUtils.act() {/*reactdomtestutilsact-warning*/}
 
-`act` from `react-dom/test-utils` has been deprecated in favor of `act` from `react`.
+O `act` de `react-dom/test-utils` foi depreciado em favor do `act` do `react`.
 
-Before:
+Antes:
 
 ```js
 import {act} from 'react-dom/test-utils';
 ```
 
-After:
+Depois:
 
 ```js
 import {act} from 'react';
 ```
 
-## Rest of ReactDOMTestUtils APIS {/*rest-of-reactdomtestutils-apis*/}
+## Resto das APIs do ReactDOMTestUtils {/*rest-of-reactdomtestutils-apis*/}
 
-All APIs except `act` have been removed.
+Todas as APIs, exceto `act`, foram removidas.
 
-The React Team recommends migrating your tests to [@testing-library/react](https://testing-library.com/docs/react-testing-library/intro/) for a modern and well supported testing experience.
+A equipe do React recomenda migrar seus testes para [@testing-library/react](https://testing-library.com/docs/react-testing-library/intro/) para uma experiência de teste moderna e bem suportada.
 
 ### ReactDOMTestUtils.renderIntoDocument {/*reactdomtestutilsrenderintodocument*/}
 
-`renderIntoDocument` can be replaced with `render` from `@testing-library/react`.
+O `renderIntoDocument` pode ser substituído por `render` de `@testing-library/react`.
 
-Before:
+Antes:
 
 ```js
 import {renderIntoDocument} from 'react-dom/test-utils';
@@ -36,7 +36,7 @@ import {renderIntoDocument} from 'react-dom/test-utils';
 renderIntoDocument(<Component />);
 ```
 
-After:
+Depois:
 
 ```js
 import {render} from '@testing-library/react';
@@ -46,9 +46,9 @@ render(<Component />);
 
 ### ReactDOMTestUtils.Simulate {/*reactdomtestutilssimulate*/}
 
-`Simulate` can be replaced with `fireEvent` from `@testing-library/react`.
+`Simulate` pode ser substituído por `fireEvent` de `@testing-library/react`.
 
-Before:
+Antes:
 
 ```js
 import {Simulate} from 'react-dom/test-utils';
@@ -57,7 +57,7 @@ const element = document.querySelector('button');
 Simulate.click(element);
 ```
 
-After:
+Depois:
 
 ```js
 import {fireEvent} from '@testing-library/react';
@@ -66,9 +66,9 @@ const element = document.querySelector('button');
 fireEvent.click(element);
 ```
 
-Be aware that `fireEvent` dispatches an actual event on the element and doesn't just synthetically call the event handler.
+Esteja ciente de que `fireEvent` dispara um evento real no elemento e não apenas chama sinteticamente o manipulador de eventos.
 
-### List of all removed APIs {/*list-of-all-removed-apis-list-of-all-removed-apis*/}
+### Lista de todas as APIs removidas {/*list-of-all-removed-apis-list-of-all-removed-apis*/}
 
 - `mockComponent()`
 - `isElement()`
diff --git a/src/content/warnings/react-test-renderer.md b/src/content/warnings/react-test-renderer.md
index 7926922d1..ae7cca5e1 100644
--- a/src/content/warnings/react-test-renderer.md
+++ b/src/content/warnings/react-test-renderer.md
@@ -1,14 +1,14 @@
 ---
-title: react-test-renderer Deprecation Warnings
+title: Avisos de Depreciação do react-test-renderer
 ---
 
-## ReactTestRenderer.create() warning {/*reacttestrenderercreate-warning*/}
+## Aviso do ReactTestRenderer.create() {/*reacttestrenderercreate-warning*/}
 
-react-test-renderer is deprecated. A warning will fire whenever calling ReactTestRenderer.create() or ReactShallowRender.render(). The react-test-renderer package will remain available on NPM but will not be maintained and may break with new React features or changes to React's internals.
+O react-test-renderer está descontinuado. Um aviso será emitido sempre que ReactTestRenderer.create() ou ReactShallowRender.render() forem chamados. O pacote react-test-renderer permanecerá disponível no NPM, mas não será mantido e pode quebrar com novos recursos do React ou mudanças nos internos do React.
 
-The React Team recommends migrating your tests to [@testing-library/react](https://testing-library.com/docs/react-testing-library/intro/) or [@testing-library/react-native](https://callstack.github.io/react-native-testing-library/docs/getting-started) for a modern and well supported testing experience.
+A equipe do React recomenda migrar seus testes para [@testing-library/react](https://testing-library.com/docs/react-testing-library/intro/) ou [@testing-library/react-native](https://callstack.github.io/react-native-testing-library/docs/getting-started) para uma experiência de teste moderna e bem suportada.
 
 
-## new ShallowRenderer() warning {/*new-shallowrenderer-warning*/}
+## Novo Aviso do ShallowRenderer() {/*new-shallowrenderer-warning*/}
 
-The react-test-renderer package no longer exports a shallow renderer at `react-test-renderer/shallow`. This was simply a repackaging of a previously extracted separate package: `react-shallow-renderer`. Therefore you can continue using the shallow renderer in the same way by installing it directly. See [Github](https://github.com/enzymejs/react-shallow-renderer) / [NPM](https://www.npmjs.com/package/react-shallow-renderer).
\ No newline at end of file
+O pacote react-test-renderer não exporta mais um shallow renderer em `react-test-renderer/shallow`. . Isto era simplesmente uma reembalagem de um pacote separado anteriormente extraído: `react-shallow-renderer`. Portanto, você pode continuar usando o shallow renderer da mesma maneira, instalando-o diretamente. Veja [Github](https://github.com/enzymejs/react-shallow-renderer) / [NPM](https://www.npmjs.com/package/react-shallow-renderer).
\ No newline at end of file
diff --git a/src/content/warnings/special-props.md b/src/content/warnings/special-props.md
index 1646b531a..95932a9c4 100644
--- a/src/content/warnings/special-props.md
+++ b/src/content/warnings/special-props.md
@@ -1,7 +1,7 @@
 ---
-title: Special Props Warning
+title: Aviso sobre Props Especiais
 ---
 
-Most props on a JSX element are passed on to the component, however, there are two special props (`ref` and `key`) which are used by React, and are thus not forwarded to the component.
+A maioria das props em um elemento JSX são passadas para o componente, no entanto, há duas props especiais (`ref` and `key`) que são usadas pelo React e, portanto, não são encaminhadas para o componente.
 
-For instance, you can't read `props.key` from a component. If you need to access the same value within the child component, you should pass it as a different prop (ex: `<ListItemWrapper key={result.id} id={result.id} />` and read `props.id`). While this may seem redundant, it's important to separate app logic from hints to React.
+Por exemplo, você não pode ler `props.key` de um componente. Se você precisar acessar o mesmo valor dentro do componente filho, deve passá-lo como uma prop diferente (ex: `<ListItemWrapper key={result.id} id={result.id} />` e ler `props.id`). Embora isso possa parecer redundante, é importante separar a lógica da aplicação das dicas para o React.
\ No newline at end of file
diff --git a/src/content/warnings/unknown-prop.md b/src/content/warnings/unknown-prop.md
index 80bcdb142..b25eb7cc2 100644
--- a/src/content/warnings/unknown-prop.md
+++ b/src/content/warnings/unknown-prop.md
@@ -1,38 +1,38 @@
 ---
-title: Unknown Prop Warning
+title: Aviso de Prop Desconhecida
 ---
 
-The unknown-prop warning will fire if you attempt to render a DOM element with a prop that is not recognized by React as a legal DOM attribute/property. You should ensure that your DOM elements do not have spurious props floating around.
+O aviso de prop desconhecida será acionado se você tentar renderizar um elemento DOM com uma prop que não é reconhecida pelo React como um atributo/prop legal do DOM. Você deve garantir que seus elementos DOM não tenham props espúrias.
 
-There are a couple of likely reasons this warning could be appearing:
+Existem algumas razões prováveis para esse aviso aparecer:
 
-1. Are you using `{...props}` or `cloneElement(element, props)`? When copying props to a child component, you should ensure that you are not accidentally forwarding props that were intended only for the parent component. See common fixes for this problem below.
+1. Você está usando `{...props}` ou `cloneElement(element, props)`? Ao copiar props para um componente filho, você deve garantir que não está acidentalmente encaminhando props que foram destinadas apenas para o componente pai. Veja correções comuns para esse problema abaixo.
 
-2. You are using a non-standard DOM attribute on a native DOM node, perhaps to represent custom data. If you are trying to attach custom data to a standard DOM element, consider using a custom data attribute as described [on MDN](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_data_attributes).
+2. Você está usando um atributo DOM não padrão em um nó DOM nativo, talvez para representar dados personalizados. Se você está tentando anexar dados personalizados a um elemento DOM padrão, considere usar um atributo de dados personalizado conforme descrito [no MDN](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_data_attributes).
 
-3. React does not yet recognize the attribute you specified. This will likely be fixed in a future version of React. React will allow you to pass it without a warning if you write the attribute name lowercase.
+3. O React ainda não reconhece o atributo que você especificou. Isso provavelmente será corrigido em uma versão futura do React. O React permitirá que você passe isso sem um aviso se você escrever o nome do atributo em minúsculas.
 
-4. You are using a React component without an upper case, for example `<myButton />`. React interprets it as a DOM tag because React JSX transform uses the upper vs. lower case convention to distinguish between user-defined components and DOM tags. For your own React components, use PascalCase. For example, write `<MyButton />` instead of `<myButton />`.
+4. Você está usando um componente React sem maiúscula, por exemplo `<myButton />`. O React interpreta isso como uma tag do DOM porque a transformação JSX do React usa a convenção de maiúsculas vs. minúsculas para distinguir entre componentes definidos pelo usuário e tags do DOM. Para seus próprios componentes React, use PascalCase. Por exemplo, escreva `<MyButton />` em vez de `<myButton />`.
 
 ---
 
-If you get this warning because you pass props like `{...props}`, your parent component needs to "consume" any prop that is intended for the parent component and not intended for the child component. Example:
+Se você receber esse aviso porque está passando props como `{...props}`, seu componente pai precisa "consumir" qualquer prop que seja destinada ao componente pai e não destinada ao componente filho. Exemplo:
 
-**Bad:** Unexpected `layout` prop is forwarded to the `div` tag.
+**Ruim:** A prop `layout` inesperada é encaminhada para a tag `div`.
 
 ```js
 function MyDiv(props) {
   if (props.layout === 'horizontal') {
-    // BAD! Because you know for sure "layout" is not a prop that <div> understands.
+    // RUIM! Porque você sabe com certeza que "layout" não é uma prop que <div> entende.
     return <div {...props} style={getHorizontalStyle()} />
   } else {
-    // BAD! Because you know for sure "layout" is not a prop that <div> understands.
+    // RUIM! Porque você sabe com certeza que "layout" não é uma prop que <div> entende.
     return <div {...props} style={getVerticalStyle()} />
   }
 }
 ```
 
-**Good:** The spread syntax can be used to pull variables off props, and put the remaining props into a variable.
+**Bom:** A sintaxe de espalhamento pode ser usada para retirar variáveis de props e colocar as props restantes em uma variável.
 
 ```js
 function MyDiv(props) {
@@ -45,7 +45,7 @@ function MyDiv(props) {
 }
 ```
 
-**Good:** You can also assign the props to a new object and delete the keys that you're using from the new object. Be sure not to delete the props from the original `this.props` object, since that object should be considered immutable.
+**Bom:**  Você também pode atribuir as props a um novo objeto e excluir as chaves que você está usando do novo objeto. Certifique-se de não excluir as props do objeto original `this.props`, pois esse objeto deve ser considerado imutável.
 
 ```js
 function MyDiv(props) {