`, o qual ele mesmo possui o parente `body`.
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/react-and-redux/connect-redux-to-react.md b/curriculum/challenges/portuguese/03-front-end-libraries/react-and-redux/connect-redux-to-react.md
index 02b7950c37..0eb37f1d02 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/react-and-redux/connect-redux-to-react.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/react-and-redux/connect-redux-to-react.md
@@ -8,7 +8,7 @@ dashedName: connect-redux-to-react
# --description--
-Agora que você escreveu ambas as funções `mapStateToProps()` and the `mapDispatchToProps()`, você pode usá-las para mapear `state` e `dispatch` para `props` de um de seus componentes React. O método `connect` do Redux React pode lidar com essa tarefa. Esse método recebe dois argumentos opcionais, `mapStateToProps()` e `mapDispatchToProps()`. Eles são opcionais porque você pode ter um componente que precisa apenas acessar o `state`, mas não precisa despachar nenhuma ação, ou vice versa.
+Agora que você escreveu ambas as funções `mapStateToProps()` e `mapDispatchToProps()`, você pode usá-las para mapear `state` e `dispatch` para `props` de um de seus componentes React. O método `connect` do Redux React pode lidar com essa tarefa. Esse método recebe dois argumentos opcionais, `mapStateToProps()` e `mapDispatchToProps()`. Eles são opcionais porque você pode ter um componente que precisa apenas acessar o `state`, mas não precisa despachar nenhuma ação, ou vice versa.
Para usar esse método, passe nas funções como argumentos, e imediatamente chame o resultado com seu componente. Essa sintaxe é um pouco incomum e se parece com:
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/react-and-redux/extract-local-state-into-redux.md b/curriculum/challenges/portuguese/03-front-end-libraries/react-and-redux/extract-local-state-into-redux.md
index 9d8aa93f81..6c01ba521e 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/react-and-redux/extract-local-state-into-redux.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/react-and-redux/extract-local-state-into-redux.md
@@ -12,7 +12,7 @@ Você está quase pronto! Lembre-se que você escreveu todo o código Redux para
# --instructions--
-No componente `Presentational`, primeiro, remova a propriedade `messages` no `state` local. Essas mensagens serão gerenciadas pelo Redux. Em seguida, modifique o método `submitMessage()` para que ele despache `submitNewMessage()` de `this.props`, e passe no input de mensagem atual do `state` local como um argumento. Como você removeu `mensagens` do state local, também remova aqui a propriedade `messages` da chamada para `this.setState()`. Finalmente, modifique o método `render()` para que ele mapeie as mensagens recebidas de `props` ao invés do `state`.
+No componente `Presentational`, primeiro, remova a propriedade `messages` no `state` local. Essas mensagens serão gerenciadas pelo Redux. Em seguida, modifique o método `submitMessage()` para que ele despache `submitNewMessage()` de `this.props`, e passe no input de mensagem atual do `state` local como um argumento. Como você removeu `messages` do state local, também remova aqui a propriedade `messages` da chamada para `this.setState()`. Finalmente, modifique o método `render()` para que ele mapeie as mensagens recebidas de `props` ao invés do `state`.
Quando essas alterações forem feitas, o aplicativo continuará a funcionar do mesmo jeito, exceto que o Redux gerencia o estado. Este exemplo também ilustra como um componente pode ter um `state` local: seu componente ainda monitora a entrada do usuário localmente em seu próprio `state`. Você pode ver como o Redux fornece um framework de gerenciamento de estado útil em cima do React. Você alcançou o mesmo resultado usando apenas o state local do React no início, e isso geralmente é possível com aplicativos simples. No entanto, como seus aplicativos se tornam maiores e mais complexos, seu gerenciamento de estado também fica mais complexo, e esse é o problema que o Redux resolve.
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/react-and-redux/manage-state-locally-first.md b/curriculum/challenges/portuguese/03-front-end-libraries/react-and-redux/manage-state-locally-first.md
index 4888779c00..862e8e4769 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/react-and-redux/manage-state-locally-first.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/react-and-redux/manage-state-locally-first.md
@@ -58,7 +58,7 @@ async () => {
};
```
-`.map` deve ser usado no array de `mensagens`.
+`.map` deve ser usado no array de `messages`.
```js
assert(code.match(/this\.state\.messages\.map/g));
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/react-and-redux/map-dispatch-to-props.md b/curriculum/challenges/portuguese/03-front-end-libraries/react-and-redux/map-dispatch-to-props.md
index 0c776fdd97..235e6c2132 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/react-and-redux/map-dispatch-to-props.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/react-and-redux/map-dispatch-to-props.md
@@ -8,7 +8,7 @@ dashedName: map-dispatch-to-props
# --description--
-A função `mapDispatchToProps()` é usada para fornecer criadores de ação específicos para seus componentes React, para que eles possam despachar ações ao store Redux. É semelhante em estrutura à função `mapStateToProps()` que você escreveu no último desafio. Isso retorna um objeto que mapeia as ações de despache para nomes de propriedades, o que se torna `props` do componente. No entanto, em vez de retornar um pedaço do `state`, cada propriedade retorna uma função que chama `dispatch` com um criador de ação e quaisquer dados de ação relevantes. Você tem acesso a este `dispatch` porque ele foi passado para `mapDispatchToProps()` como um parâmetro quando você define a função, assim como você passou o estado `` para `mapStateToProps()`. Nos bastidores, React Redux está usando `store.dispatch()` do Redux para realizar estes despachos com `mapDispatchToProps()`. Isso é semelhante a como ele usa `store.subscribe()` para componentes que são mapeados para o `state`.
+A função `mapDispatchToProps()` é usada para fornecer criadores de ação específicos para seus componentes React, para que eles possam despachar ações ao store Redux. É semelhante em estrutura à função `mapStateToProps()` que você escreveu no último desafio. Isso retorna um objeto que mapeia as ações de despache para nomes de propriedades, o que se torna `props` do componente. No entanto, em vez de retornar um pedaço do `state`, cada propriedade retorna uma função que chama `dispatch` com um criador de ação e quaisquer dados de ação relevantes. Você tem acesso a este `dispatch` porque ele foi passado para `mapDispatchToProps()` como um parâmetro quando você define a função, assim como você passou o `state` para `mapStateToProps()`. Nos bastidores, React Redux está usando `store.dispatch()` do Redux para realizar estes despachos com `mapDispatchToProps()`. Isso é semelhante a como ele usa `store.subscribe()` para componentes que são mapeados para o `state`.
Por exemplo, você tem o criador de ação `loginUser()` que recebe um `username` como uma ação payload. O objeto retornado do `mapDispatchToProps()` para este criador da ação pareceria algo como:
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/react/add-inline-styles-in-react.md b/curriculum/challenges/portuguese/03-front-end-libraries/react/add-inline-styles-in-react.md
index c3e2f020f1..ebf2aca110 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/react/add-inline-styles-in-react.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/react/add-inline-styles-in-react.md
@@ -14,11 +14,11 @@ Todas as unidades de valor de comprimento das propriedades (como `height`,`width
# --instructions--
-Se você tem um grande conjunto de estilos, você pode atribuir um `objeto` de estilo para uma constante para te ajudar a manter o código organizado. Declare suas constantes de estilo como variáveis globais no topo do arquivo. Inicialize a constante `styles` e atribua um `object` com três propriedades de estilo e os seus valores à constante. Dê a `div` a color (cor) `purple (roxo)`, um font-size (tamanho de fonte) de `40` e um border (borda) de `2px solid purple`. Em seguida, defina o atributo `style` para ser igual a constante `styles`.
+Se você tem um grande conjunto de estilos, você pode atribuir um `object` de estilo para uma constante para te ajudar a manter o código organizado. Declare suas constantes de estilo como variáveis globais no topo do arquivo. Inicialize a constante `styles` e atribua um `object` com três propriedades de estilo e os seus valores à constante. Dê a `div` a color (cor) `purple`, um font-size (tamanho de fonte) de `40` e um border (borda) de `2px solid purple`. Em seguida, defina o atributo `style` para ser igual a constante `styles`.
# --hints--
-A variável `styles` deve ser um `objeto` com três propriedades.
+A variável `styles` deve ser um `object` com três propriedades.
```js
assert(Object.keys(styles).length === 3);
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/react/create-a-complex-jsx-element.md b/curriculum/challenges/portuguese/03-front-end-libraries/react/create-a-complex-jsx-element.md
index fd56ab4662..0c58efb77b 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/react/create-a-complex-jsx-element.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/react/create-a-complex-jsx-element.md
@@ -16,7 +16,7 @@ Este único elemento pai envolveria todos os outros níveis de elementos aninhad
Por exemplo, vários elementos JSX escritos como irmãos sem elemento encapsulador pai não vai transpilar.
-Aqui está um exemplo:
+Exemplo:
**JSX válido:**
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/react/create-a-controlled-form.md b/curriculum/challenges/portuguese/03-front-end-libraries/react/create-a-controlled-form.md
index 69aceef356..65eb3d5f8c 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/react/create-a-controlled-form.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/react/create-a-controlled-form.md
@@ -18,7 +18,7 @@ Adicionamos um botão que envia o formulário. Você pode ver que tem o `type` d
**Nota:** Você deve chamar o evento `event.preventDefault()` no manipulador de envio, para evitar o comportamento de envio de formulário padrão que atualizará a página web. Por conveniência, o comportamento padrão foi desabilitado aqui para impedir que atualizações redefinam o código do desafio.
-Finalmente cria uma tag `h1` após o `form` que renderiza o valor `sumbit` do `estado` do componente. Em seguida você pode digitar no formulário e clicar o botão (ou pressionar enter), e você deve ver seu input renderizado na página.
+Finalmente cria uma tag `h1` após o `form` que renderiza o valor `submit` do `state` do componente. Em seguida você pode digitar no formulário e clicar o botão (ou pressionar enter), e você deve ver seu input renderizado na página.
# --hints--
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/react/create-a-react-component.md b/curriculum/challenges/portuguese/03-front-end-libraries/react/create-a-react-component.md
index e75fbae548..b5b48c5a43 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/react/create-a-react-component.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/react/create-a-react-component.md
@@ -24,7 +24,7 @@ class Kitten extends React.Component {
}
```
-Isso cria a classe ES6 `Kitten` que extende a classe `React.Component`. Então a classe `Kitten` agora possui acesso a diversos recursos úteis do React, como local state e lifecycle hooks. Não se preocupe se você não estiver familiarizado com esses termos ainda, eles serão abordados em detalhes maiores nos desafios futuros. Também note que a classe `Kitten` possui um `construtor` definido dentro dele que chama `super()`. O construtor usa `super()` para chamar o construtor da classe pai, nesse caso `React.Component`. O construtor é um método especial usado durante a inicialização de objetos que são criados com a palavra-chave `class`. É uma boa prática chamar o `constructor` de um componente com `super`, e passar `props` para ambos. Isso garante que o componente é inicializado corretamente. Por agora, saiba que é padrão que esse código seja incluído. Em breve você verá outros usos para o construtor assim como para `props`.
+Isso cria a classe ES6 `Kitten` que extende a classe `React.Component`. Então a classe `Kitten` agora possui acesso a diversos recursos úteis do React, como local state e lifecycle hooks. Não se preocupe se você não estiver familiarizado com esses termos ainda, eles serão abordados em detalhes maiores nos desafios futuros. Também note que a classe `Kitten` possui um `constructor` definido dentro dele que chama `super()`. O construtor usa `super()` para chamar o construtor da classe pai, nesse caso `React.Component`. O construtor é um método especial usado durante a inicialização de objetos que são criados com a palavra-chave `class`. É uma boa prática chamar o `constructor` de um componente com `super`, e passar `props` para ambos. Isso garante que o componente é inicializado corretamente. Por agora, saiba que é padrão que esse código seja incluído. Em breve você verá outros usos para o construtor assim como para `props`.
# --instructions--
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/react/introducing-inline-styles.md b/curriculum/challenges/portuguese/03-front-end-libraries/react/introducing-inline-styles.md
index 6efc7ee8a0..7234a15293 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/react/introducing-inline-styles.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/react/introducing-inline-styles.md
@@ -18,7 +18,7 @@ Você aplica estilos em linha em elementos JSX similares a como você faz isso e
Mellow Yellow
```
-Elementos JSX usam o atributo style`, mas por causa da forma como o JSX é transpilado, você não pode definir o valor para uma
string`. Em vez disso, você o definiu para ser igual a um `objeto` JavaScript. Exemplo:
+Elementos JSX usam o atributo `style`, mas por causa da forma como o JSX é transpilado, você não pode definir o valor para uma `string`. Em vez disso, você o definiu para ser igual a um `objeto` JavaScript. Exemplo:
```jsx
Mellow Yellow
@@ -45,7 +45,7 @@ assert(
);
```
-O elemento `div` deve ter a cor `vermelha`.
+O elemento `div` deve ter a cor `red`.
```js
assert(
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/react/override-default-props.md b/curriculum/challenges/portuguese/03-front-end-libraries/react/override-default-props.md
index 29d7b4a766..9175bfdd14 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/react/override-default-props.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/react/override-default-props.md
@@ -12,7 +12,7 @@ A habilidade de definir props padrões é um recurso útil em React. A maneira d
# --instructions--
-O componente `ShoppingCart` agora renderiza um componente filho `Itens`. Este componente `Itens` tem uma prop padrão `quantidade ` definida como o número inteiro `0`. Substitua a prop padrão passando o valor de `10` para `quantity`.
+O componente `ShoppingCart` agora renderiza um componente filho `Itens`. Este componente `Items` tem uma prop padrão `quantity` definida como o número inteiro `0`. Substitua a prop padrão passando o valor de `10` para `quantity`.
**Nota:** Lembre-se de que a sintaxe para adicionar uma prop a um componente fica semelhante à forma como você adiciona atributos HTML. No entanto, uma vez que o valor para `quantity` é um número inteiro, ele não irá entre aspas mas deve estar entre chaves. Por exemplo, `{100}`. Esta sintaxe diz para JSX interpretar o valor entre chaves diretamente como JavaScript.
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/react/render-conditionally-from-props.md b/curriculum/challenges/portuguese/03-front-end-libraries/react/render-conditionally-from-props.md
index eb2cb7ab5e..a43ea0c9ce 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/react/render-conditionally-from-props.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/react/render-conditionally-from-props.md
@@ -8,7 +8,7 @@ dashedName: render-conditionally-from-props
# --description--
-Até agora, você viu como usar o `if/else`, `&&`, e o operador ternário (`condição ? expressãoSeVerdadeiro: expressãoSeFalso`) para tomar decisões condicionais sobre o que renderizar e quando. No entanto, resta um tópico importante para discutir que permite que você combine todos esses conceitos com outro poderoso recurso React: props. Usar props para renderizar condicionalmente código é muito comum entre desenvolvedores React — isto é, eles usam o valor de uma determinada propriedade para tomar decisões automaticamente sobre o que renderizar.
+Até agora, você viu como usar o `if/else`, `&&`, e o operador ternário (`condition ? expressionIfTrue : expressionIfFalse`) para tomar decisões condicionais sobre o que renderizar e quando. No entanto, resta um tópico importante para discutir que permite que você combine todos esses conceitos com outro poderoso recurso React: props. Usar props para renderizar condicionalmente código é muito comum entre desenvolvedores React — isto é, eles usam o valor de uma determinada propriedade para tomar decisões automaticamente sobre o que renderizar.
Neste desafio, você vai configurar um componente filho para tomar decisões de renderização com base em props. Você também usará o operador ternário, mas você pode ver como vários dos outros conceitos que foram abordados nos últimos desafios poderão ser igualmente úteis neste contexto.
@@ -16,7 +16,7 @@ Neste desafio, você vai configurar um componente filho para tomar decisões de
O editor de código tem dois componentes que estão parcialmente definidos para você: um pai chamado `GameOfChance`, e uma filho chamado `Results`. Eles são usados para criar um jogo simples onde o usuário pressiona um botão para ver se ele vence ou perde.
-Primeiro, você precisará de uma expressão simples que retorna aleatoriamente um valor diferente toda vez que for executado. Você pode usar `Math.random()`. Esse método retorna um valor entre `0` (inclusivo) e `1` (exclusivo) a cada vez que é chamado. Portanto, para probabilidades 50/50, use `Math.random() >= .5` na sua expressão. Estatísticas falando, essa expressão retornará `verdadeiro` 50% das vezes, e `falso` os outros 50%. No método de renderização, substitua `null` pela expressão acima para completar a declaração de variável.
+Primeiro, você precisará de uma expressão simples que retorna aleatoriamente um valor diferente toda vez que for executado. Você pode usar `Math.random()`. Esse método retorna um valor entre `0` (inclusivo) e `1` (exclusivo) a cada vez que é chamado. Portanto, para probabilidades 50/50, use `Math.random() >= .5` na sua expressão. Estatísticas falando, essa expressão retornará `true` 50% das vezes, e `false` os outros 50%. No método de renderização, substitua `null` pela expressão acima para completar a declaração de variável.
Agora você tem uma expressão que pode usar para tomar uma decisão aleatória no código. Em seguida, você precisa implementar isso. Renderize o componente `Results` como filho de `GameOfChance`, e passe `expression` como uma prop chamada `fiftyFifty`. No componente `Results`, escreva uma expressão ternária para renderizar o elemento `h1` com o texto `You Win!` ou `You Lose!` baseado na prop `fiftyFifty` que está sendo passada de `GameOfChance`. Finalmente, certifique-se de que o método `handleClick()` está contando corretamente cada turno para que o usuário saiba quantas vezes jogou. Isso também serve para que o usuário saiba que o componente realmente atualizou caso vença ou perca duas vezes consecutivas.
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/react/set-state-with-this.setstate.md b/curriculum/challenges/portuguese/03-front-end-libraries/react/set-state-with-this.setstate.md
index b12d72e5f8..96ca746db1 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/react/set-state-with-this.setstate.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/react/set-state-with-this.setstate.md
@@ -8,7 +8,7 @@ dashedName: set-state-with-this-setstate
# --description--
-Os desafios anteriores abordaram `state` de componente e como inicializar state no `construtor`. Há também uma maneira de alterar o `state` do componente. React fornece um método para atualizar o componente `state` chamado `setState`. Você chama o método `setState` dentro da sua classe de componente assim: `this.setState()`, passando como parâmetro um objeto com pares de valor chave. As chaves são suas propriedades do estado e os valores são dados do estado atualizados. Por exemplo, se armazenássemos um `username` em state e quiséssemos atualizá-lo, ficaria assim:
+Os desafios anteriores abordaram `state` de componente e como inicializar state no `constructor`. Há também uma maneira de alterar o `state` do componente. React fornece um método para atualizar o componente `state` chamado `setState`. Você chama o método `setState` dentro da sua classe de componente assim: `this.setState()`, passando como parâmetro um objeto com pares de valor chave. As chaves são suas propriedades do estado e os valores são dados do estado atualizados. Por exemplo, se armazenássemos um `username` em state e quiséssemos atualizá-lo, ficaria assim:
```jsx
this.setState({
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/react/use--for-a-more-concise-conditional.md b/curriculum/challenges/portuguese/03-front-end-libraries/react/use--for-a-more-concise-conditional.md
index 67bf794cb1..83600a55ca 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/react/use--for-a-more-concise-conditional.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/react/use--for-a-more-concise-conditional.md
@@ -8,13 +8,13 @@ dashedName: use--for-a-more-concise-conditional
# --description--
-As declarações `if/else` funcionaram no último desafio, mas há uma maneira mais concisa de alcançar o mesmo resultado. Imagine que está a monitorar várias condições num componente e que pretende que diferentes elementos sejam renderizados, dependendo de cada uma destas condições. Se você escrever muitas instruções `else if` para retornar interfaces de usuário ligeiramente diferentes, você pode repetir código o que deixa espaço para erros. Ao invés disso, você pode usar o operador lógico `&&` para executar a lógica condicional de uma forma mais concisa. Isto é possível porque você quer verificar se uma condição é `verdadeira`, e se é, retorna uma marcação. Um exemplo:
+As declarações `if/else` funcionaram no último desafio, mas há uma maneira mais concisa de alcançar o mesmo resultado. Imagine que está a monitorar várias condições num componente e que pretende que diferentes elementos sejam renderizados, dependendo de cada uma destas condições. Se você escrever muitas instruções `else if` para retornar interfaces de usuário ligeiramente diferentes, você pode repetir código o que deixa espaço para erros. Ao invés disso, você pode usar o operador lógico `&&` para executar a lógica condicional de uma forma mais concisa. Isto é possível porque você quer verificar se uma condição é `true`, e se é, retorna uma marcação. Exemplo:
```jsx
{condition && markup
}
```
-Se a `condition` for `verdadeira`, a marcação será retornada. Se a condição for `falsa`, a operação retornará imediatamente `false` após avaliar a `condition` e não retornará nada. Você pode incluir essas declarações diretamente em seu JSX e juntar várias condições, escrevendo `&&` após cada uma. Isso permite que você lide com uma lógica condicional mais complexa em seu método `render()` sem repetir muito código.
+Se a `condition` for `true`, a marcação será retornada. Se a condição for `false`, a operação retornará imediatamente `false` após avaliar a `condition` e não retornará nada. Você pode incluir essas declarações diretamente em seu JSX e juntar várias condições, escrevendo `&&` após cada uma. Isso permite que você lide com uma lógica condicional mais complexa em seu método `render()` sem repetir muito código.
# --instructions--
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/react/use-advanced-javascript-in-react-render-method.md b/curriculum/challenges/portuguese/03-front-end-libraries/react/use-advanced-javascript-in-react-render-method.md
index 8c39a9e958..eec72d5452 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/react/use-advanced-javascript-in-react-render-method.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/react/use-advanced-javascript-in-react-render-method.md
@@ -18,14 +18,15 @@ No código fornecido, o método `render` tem uma matriz que contém 20 frases pa
# --hints--
-O componente MagicEightBall` deve existir e deve renderizar à página.
+O componente `MagicEightBall` deve existir e deve renderizar à página.
-
assert.strictEqual(
+```js
+assert.strictEqual(
Enzyme.mount(React.createElement(MagicEightBall)).find('MagicEightBall')
.length,
1
);
-`
+```
O primeiro filho de `MagicEightBall` deve ser um elemento `input`.
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/react/use-array.filter-to-dynamically-filter-an-array.md b/curriculum/challenges/portuguese/03-front-end-libraries/react/use-array.filter-to-dynamically-filter-an-array.md
index b1e047c6a9..ec3fb3eb63 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/react/use-array.filter-to-dynamically-filter-an-array.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/react/use-array.filter-to-dynamically-filter-an-array.md
@@ -40,7 +40,7 @@ assert(
);
```
-`MyComponent` deve retornar os elementos `div`, `h1` e em seguida uma lista não ordenada contendo elementos `li` para cada usuário que possui o status online como sendo `true (verdadeiro)`.
+`MyComponent` deve retornar os elementos `div`, `h1` e em seguida uma lista não ordenada contendo elementos `li` para cada usuário que possui o status online como sendo `true`.
```js
(() => {
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/react/use-array.map-to-dynamically-render-elements.md b/curriculum/challenges/portuguese/03-front-end-libraries/react/use-array.map-to-dynamically-render-elements.md
index 9b93712e86..4b2b6a7d77 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/react/use-array.map-to-dynamically-render-elements.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/react/use-array.map-to-dynamically-render-elements.md
@@ -16,7 +16,7 @@ Por exemplo, você cria um aplicativo "Lista de Coisas a Fazer" simples. Como pr
O editor de código tem a maioria do componente `MyToDoList` configurado. Parte deste código deve parecer familiar se você completou o desafio de formulário controlado. Você notará um `textarea` e um `button`, junto com alguns métodos que rastreiam seus estados, mas nada é renderizado na página ainda.
-Dentro do `construtor`, crie um objeto `this.state` e defina dois estados: `userInput` deve ser inicializado como uma string vazia, e `toDoList` deve ser inicializado como um array vazio. Em seguida, exclua o comentário no método `render()` ao lado da variável `itens`. Em seu lugar, mapeie sobre o array `toDoList` armazenado no estado interno do componente e renderize dinamicamente um `li` para cada item. Tente inserir a string `eat, code, sleep, repeat` dentro do `textarea`, depois clique no botão e veja o que acontece.
+Dentro do `constructor`, crie um objeto `this.state` e defina dois estados: `userInput` deve ser inicializado como uma string vazia, e `toDoList` deve ser inicializado como um array vazio. Em seguida, exclua o comentário no método `render()` ao lado da variável `items`. Em seu lugar, mapeie sobre o array `toDoList` armazenado no estado interno do componente e renderize dinamicamente um `li` para cada item. Tente inserir a string `eat, code, sleep, repeat` dentro do `textarea`, depois clique no botão e veja o que acontece.
**Nota:** Você pode saber que todos os elementos filhos do irmão criados por uma operação de mapeamento como esta precisam ser fornecidos com um atributo `key` exclusivo. Não se preocupe, este é o tema do próximo desafio.
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/react/use-state-to-toggle-an-element.md b/curriculum/challenges/portuguese/03-front-end-libraries/react/use-state-to-toggle-an-element.md
index b1d3bbf52d..54e1f6ab07 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/react/use-state-to-toggle-an-element.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/react/use-state-to-toggle-an-element.md
@@ -38,11 +38,11 @@ Observe que você tem que envolver o objeto literalmente entre parênteses, caso
`MyComponent` tem uma propriedade `visibilty` que foi inicializada como `false`. O método de renderização retorna uma view se o valor de `visibility` for verdadeiro e uma view diferente se for falsa.
-Atualmente, não há forma de atualizar a propriedade `visibility` no `state` do componente. O valor deve alternar entre verdadeiro e falso. Há um manipulador de cliques no botão que aciona um método de classe chamado `toggleVisibility()`. Passe uma função para `setState` para definir esse método para que o `state` de `visibility` alterne para o valor oposto quando o método for chamado. Se `visibilidade` for `falso`, o método define para `verdadeiro`, e vice-versa.
+Atualmente, não há forma de atualizar a propriedade `visibility` no `state` do componente. O valor deve alternar entre verdadeiro e falso. Há um manipulador de cliques no botão que aciona um método de classe chamado `toggleVisibility()`. Passe uma função para `setState` para definir esse método para que o `state` de `visibility` alterne para o valor oposto quando o método for chamado. Se `visibility` for `false`, o método define para `true`, e vice-versa.
Finalmente, clique no botão para ver a renderização condicional do componente com base no seu `state`.
-**Dica:** Não se esqueça de vincular a palavra-chave `this` ao método no `construtor`!
+**Dica:** Não se esqueça de vincular a palavra-chave `this` ao método no `constructor`!
# --hints--
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/react/write-a-react-component-from-scratch.md b/curriculum/challenges/portuguese/03-front-end-libraries/react/write-a-react-component-from-scratch.md
index f688cfa313..f67363c8ec 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/react/write-a-react-component-from-scratch.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/react/write-a-react-component-from-scratch.md
@@ -29,7 +29,7 @@ Deve haver um componente React chamado `MyComponent`.
);
```
-`MeuComponente` deve conter uma tag `h1` com texto `My First React Component!` Letras maiúsculas e minúsculas, e pontuação importam.
+`MyComponent` deve conter uma tag `h1` com texto `My First React Component!` Letras maiúsculas e minúsculas, e pontuação importam.
```js
assert(
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/redux/combine-multiple-reducers.md b/curriculum/challenges/portuguese/03-front-end-libraries/redux/combine-multiple-reducers.md
index e9464557bc..420bff88b5 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/redux/combine-multiple-reducers.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/redux/combine-multiple-reducers.md
@@ -29,7 +29,7 @@ Existem as funções `counterReducer()` e `authReducer()` fornecidas no editor d
# --hints--
-O `counterReducer` deve incrementar e decrementar o `estado`.
+O `counterReducer` deve incrementar e decrementar o `state`.
```js
assert(
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/redux/copy-an-object-with-object.assign.md b/curriculum/challenges/portuguese/03-front-end-libraries/redux/copy-an-object-with-object.assign.md
index fc3299795a..5bbb6db324 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/redux/copy-an-object-with-object.assign.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/redux/copy-an-object-with-object.assign.md
@@ -8,17 +8,17 @@ dashedName: copy-an-object-with-object-assign
# --description--
-Os últimos desafios funcionaram com matrizes, mas também existem maneiras de ajudar a impor a imutabilidade do state quando o state for um `objeto`. Uma ferramenta útil para lidar com objetos é o `Object.assign()`. `Object.assign()` recebe um objeto alvo e objetos fonte e mapeia propriedades dos objetos de origem para o objeto alvo. Qualquer propriedades correspondentes são substituídas por propriedades nos objetos de origem. Esse comportamento é comumente usado para fazer cópias rasas de objetos, passando um objeto vazio como o primeiro argumento seguido do(s) objeto(s) que você deseja copiar. Um exemplo:
+Os últimos desafios funcionaram com matrizes, mas também existem maneiras de ajudar a impor a imutabilidade do state quando o state for um `object`. Uma ferramenta útil para lidar com objetos é o `Object.assign()`. `Object.assign()` recebe um objeto alvo e objetos fonte e mapeia propriedades dos objetos de origem para o objeto alvo. Qualquer propriedades correspondentes são substituídas por propriedades nos objetos de origem. Esse comportamento é comumente usado para fazer cópias rasas de objetos, passando um objeto vazio como o primeiro argumento seguido do(s) objeto(s) que você deseja copiar. Exemplo:
```js
const newObject = Object.assign({}, obj1, obj2);
```
-Isso cria `newObject` como um novo `objeto`, que contém as propriedades que atualmente existem em `obj1` e `obj2`.
+Isso cria `newObject` como um novo `object`, que contém as propriedades que atualmente existem em `obj1` e `obj2`.
# --instructions--
-O estado e ações do Redux foram modificados para manipular um `objeto` para o `state`. Edite o código para retornar um novo objeto `state` para ações com tipo `ONLINE`, que define a propriedade `status` para a string `online`. Tente usar `Object.assign()` para completar o desafio.
+O estado e ações do Redux foram modificados para manipular um `object` para o `state`. Edite o código para retornar um novo objeto `state` para ações com tipo `ONLINE`, que define a propriedade `status` para a string `online`. Tente usar `Object.assign()` para completar o desafio.
# --hints--
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/redux/never-mutate-state.md b/curriculum/challenges/portuguese/03-front-end-libraries/redux/never-mutate-state.md
index 352f170234..edd54f0246 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/redux/never-mutate-state.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/redux/never-mutate-state.md
@@ -12,7 +12,7 @@ Estes desafios finais descrevem vários métodos de aplicação do princípio fu
Se você tirasse um snapshot do estado de um aplicativo Redux ao longo do tempo, você veria algo como `state 1`, `state 2`, `state 3`,`state 4`, `...` e assim por diante onde cada estado pode ser semelhante ao último, mas cada um é um dado distinto. Esta imutabilidade, na verdade, é o que fornece recursos como a depuração de viagem no tempo (time-travel debugging) que você pode ter ouvido sobre.
-Redux não impõe ativamente a imutabilidade do state em seu store ou reducers, essa responsabilidade é do programador. Felizmente, o JavaScript (especialmente ES6) fornece várias ferramentas úteis que você pode usar para impor a imutabilidade do seu estado, tanto se é uma `string`, `number`, `array` ou `objeto`. Observe que as strings e números são valores primitivos e são imutáveis por natureza. Em outras palavras, 3 é sempre 3. Você não pode alterar o valor do número 3. Um `array` ou `objeto`, no entanto, são mutáveis. Na prática, seu estado provavelmente consistirá em um `array` ou `objeto`, visto que se trata de estruturas de dados úteis para a representação de muitos tipos de informação.
+Redux não impõe ativamente a imutabilidade do state em seu store ou reducers, essa responsabilidade é do programador. Felizmente, o JavaScript (especialmente ES6) fornece várias ferramentas úteis que você pode usar para impor a imutabilidade do seu estado, tanto se é uma `string`, `number`, `array` ou `objeto`. Observe que as strings e números são valores primitivos e são imutáveis por natureza. Em outras palavras, 3 é sempre 3. Você não pode alterar o valor do número 3. Um `array` ou `objeto`, no entanto, são mutáveis. Na prática, seu estado provavelmente consistirá em um `array` ou `object`, visto que se trata de estruturas de dados úteis para a representação de muitos tipos de informação.
# --instructions--
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions.md b/curriculum/challenges/portuguese/03-front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions.md
index a75a2e8c55..e1a47ef294 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions.md
@@ -40,7 +40,7 @@ assert(receivedData('data').type === RECEIVED_DATA);
assert(typeof asyncDataReducer === 'function');
```
-Despachando o criador de ação `requestingData` deve atualizar a propriedade `state` do store de buscar para `verdadeiro`.
+Despachando o criador de ação `requestingData` deve atualizar a propriedade `state` do store de buscar para `true`.
```js
assert(
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/sass/split-your-styles-into-smaller-chunks-with-partials.md b/curriculum/challenges/portuguese/03-front-end-libraries/sass/split-your-styles-into-smaller-chunks-with-partials.md
index 82ca5b8d5f..524c56badc 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/sass/split-your-styles-into-smaller-chunks-with-partials.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/sass/split-your-styles-into-smaller-chunks-with-partials.md
@@ -18,11 +18,11 @@ Por exemplo, se todos os seus mixins são salvos em uma partial chamada "\_mixin
@import 'mixins'
```
-Observe que o sublinhado e a extensão de arquivo não são necessários na instrução import` - Sass entende que é partial. Uma vez que um partial é importado para um arquivo, todas as variáveis, mixins e outro código estão disponíveis para uso.
+Observe que o sublinhado e a extensão de arquivo não são necessários na instrução `import` - Sass entende que é partial. Uma vez que um partial é importado para um arquivo, todas as variáveis, mixins e outro código estão disponíveis para uso.
-
--instructions--
+# --instructions--
-
Escreva uma declaração @import` para importar uma partial chamada `_variables.scss` para o arquivo main.scss.
+Escreva uma declaração `@import` para importar uma partial chamada `_variables.scss` para o arquivo main.scss.
# --hints--
diff --git a/curriculum/challenges/portuguese/03-front-end-libraries/sass/use-each-to-map-over-items-in-a-list.md b/curriculum/challenges/portuguese/03-front-end-libraries/sass/use-each-to-map-over-items-in-a-list.md
index b1f15b5ea6..66bf74b824 100644
--- a/curriculum/challenges/portuguese/03-front-end-libraries/sass/use-each-to-map-over-items-in-a-list.md
+++ b/curriculum/challenges/portuguese/03-front-end-libraries/sass/use-each-to-map-over-items-in-a-list.md
@@ -16,7 +16,7 @@ O último desafio mostrou como a diretiva `@for` usa valores de início e fim pa
}
```
-Um mapa possui uma sintaxe ligeiramente diferente. Aqui está um exemplo:
+Um mapa possui uma sintaxe ligeiramente diferente. Exemplo:
```scss
$colors: (color1: blue, color2: red, color3: green);
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/add-document-elements-with-d3.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/add-document-elements-with-d3.md
index ea44782e9c..d166715fb0 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/add-document-elements-with-d3.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/add-document-elements-with-d3.md
@@ -1,6 +1,6 @@
---
id: 587d7fa6367417b2b2512bc2
-title: Add Document Elements with D3
+title: Adicionar elementos de documento com D3
challengeType: 6
forumTopicId: 301474
dashedName: add-document-elements-with-d3
@@ -8,23 +8,23 @@ dashedName: add-document-elements-with-d3
# --description--
-D3 has several methods that let you add and change elements in your document.
+O D3 tem vários métodos que permitem adicionar e alterar elementos ao documento.
-The `select()` method selects one element from the document. It takes an argument for the name of the element you want and returns an HTML node for the first element in the document that matches the name. Here's an example:
+O método `select()` seleciona um elemento do documento. Ele recebe um argumento para o nome do elemento que você deseja e retorna um nó de HTML para o primeiro elemento do documento que corresponde ao nome. Exemplo:
```js
const anchor = d3.select("a");
```
-The above example finds the first anchor tag on the page and saves an HTML node for it in the variable `anchor`. You can use the selection with other methods. The `d3` part of the example is a reference to the D3 object, which is how you access D3 methods.
+O exemplo acima encontra a primeira tag de âncora na página e salva um nó de HTML para ela na variável `anchor`. Você pode usar a seleção com outros métodos. A parte que diz `d3` do exemplo é uma referência ao objeto do D3, que é a maneira de acessar os métodos do D3.
-Two other useful methods are `append()` and `text()`.
+Dois outros métodos úteis são `append()` e `text()`.
-The `append()` method takes an argument for the element you want to add to the document. It appends an HTML node to a selected item, and returns a handle to that node.
+O método `append()` tem um argumento para o elemento que você deseja adicionar ao documento. Ele anexa um nó de HTML a um item selecionado e retorna um identificador para esse nó.
-The `text()` method either sets the text of the selected node, or gets the current text. To set the value, you pass a string as an argument inside the parentheses of the method.
+O método `text()` define o texto do nó selecionado ou obtém o texto atual. Para definir o valor, você passa uma string como um argumento dentro dos parênteses do método.
-Here's an example that selects an unordered list, appends a list item, and adds text:
+Aqui está um exemplo que seleciona uma lista não ordenada, associa um item de lista e adiciona texto:
```js
d3.select("ul")
@@ -32,45 +32,45 @@ d3.select("ul")
.text("Very important item");
```
-D3 allows you to chain several methods together with periods to perform a number of actions in a row.
+O D3 permite que você encadeie vários métodos juntamente com períodos para realizar várias ações em sequência.
# --instructions--
-Use the `select` method to select the `body` tag in the document. Then `append` an `h1` tag to it, and add the text `Learning D3` into the `h1` element.
+Use o método `select` para selecionar a tag `body` do documento. Em seguida, use o método `append` em uma tag `h1` e adicione o texto `Learning D3` no elemento `h1`.
# --hints--
-The `body` should have one `h1` element.
+A tag `body` deve ter um elemento `h1`.
```js
assert($('body').children('h1').length == 1);
```
-The `h1` element should have the text `Learning D3` in it.
+O elemento `h1` deve conter o texto `Learning D3`.
```js
assert($('h1').text() == 'Learning D3');
```
-Your code should access the `d3` object.
+O código deve acessar o objeto `d3`.
```js
assert(code.match(/d3/g));
```
-Your code should use the `select` method.
+O código deve usar o método `select`.
```js
assert(code.match(/\.select/g));
```
-Your code should use the `append` method.
+O código deve usar o método `append`.
```js
assert(code.match(/\.append/g));
```
-Your code should use the `text` method.
+O código deve usar o método `text`.
```js
assert(code.match(/\.text/g));
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/add-inline-styling-to-elements.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/add-inline-styling-to-elements.md
index 9c538755d7..1adf66f7ab 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/add-inline-styling-to-elements.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/add-inline-styling-to-elements.md
@@ -1,6 +1,6 @@
---
id: 587d7fa7367417b2b2512bc6
-title: Add Inline Styling to Elements
+title: Adicionar estilo em linha aos elementos
challengeType: 6
forumTopicId: 301475
dashedName: add-inline-styling-to-elements
@@ -8,9 +8,9 @@ dashedName: add-inline-styling-to-elements
# --description--
-D3 lets you add inline CSS styles on dynamic elements with the `style()` method.
+O D3 permite adicionar estilos CSS em linha em elementos dinâmicos com o método `style()`.
-The `style()` method takes a comma-separated key-value pair as an argument. Here's an example to set the selection's text color to blue:
+O método `style()` receb um par chave-valor separado por vírgulas como argumento. Aqui está um exemplo para definir a cor do texto da seleção como azul:
```js
selection.style("color","blue");
@@ -18,17 +18,17 @@ selection.style("color","blue");
# --instructions--
-Add the `style()` method to the code in the editor to make all the displayed text have a `font-family` of `verdana`.
+Adicione o método `style()` ao código no editor para fazer com que todo o texto exibido tenha a `font-family` `verdana`.
# --hints--
-Your `h2` elements should have a `font-family` of `verdana`.
+Os elementos `h2` devem ter a propriedade `font-family` `verdana`.
```js
assert($('h2').css('font-family') == 'verdana');
```
-Your code should use the `style()` method.
+O código deve usar o método `style()`.
```js
assert(code.match(/\.style/g));
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/add-labels-to-d3-elements.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/add-labels-to-d3-elements.md
index d0da292c76..30a65efc22 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/add-labels-to-d3-elements.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/add-labels-to-d3-elements.md
@@ -1,6 +1,6 @@
---
id: 587d7faa367417b2b2512bd2
-title: Add Labels to D3 Elements
+title: Adicionar etiquetas aos elementos D3
challengeType: 6
forumTopicId: 301476
dashedName: add-labels-to-d3-elements
@@ -8,69 +8,69 @@ dashedName: add-labels-to-d3-elements
# --description--
-D3 lets you label a graph element, such as a bar, using the SVG `text` element.
+O D3 permite adicionar etiquetas a um elemento gráfico, como uma barra, usando o elemento `text` do SVG.
-Like the `rect` element, a `text` element needs to have `x` and `y` attributes, to place it on the SVG canvas. It also needs to access the data to display those values.
+Assim como o elemento `rect`, um elemento `text` precisa ter atributos `x` e `y` para ser inserido no canvas do SVG. Ele também precisa de ter acesso aos dados para exibir esses valores.
-D3 gives you a high level of control over how you label your bars.
+O D3 dá a você um alto nível de controle sobre como você etiqueta suas barras.
# --instructions--
-The code in the editor already binds the data to each new `text` element. First, append `text` nodes to the `svg`. Next, add attributes for the `x` and `y` coordinates. They should be calculated the same way as the `rect` ones, except the `y` value for the `text` should make the label sit 3 units higher than the bar. Finally, use the D3 `text()` method to set the label equal to the data point value.
+O código no editor já vincula os dados a cada novo elemento `text`. Primeiro, insira nós `text` no `svg`. Em seguida, adicione atributos às coordenadas `x` e `y`. Eles devem ser calculados da mesma forma que os atributos de `rect`, exceto pelo fato de que o valor de `y` para `text` fará com que a etiqueta fique 3 unidades acima da barra. Por fim, use o método `text()` do D3 para definir a nova etiqueta como o valor do ponto de dados.
-**Note:** For the label to sit higher than the bar, decide if the `y` value for the `text` should be 3 greater or 3 less than the `y` value for the bar.
+**Observação:** para a etiqueta ficar mais alta do que a barra, decida se o valor de `y` para o `text` deve ser 3 a mais ou 3 a menos do que o valor de `y` da barra.
# --hints--
-The first `text` element should have a label of `12` and a `y` value of `61`.
+O primeiro elemento `text` deve ter uma etiqueta com o valor `12` e um `y` com o valor de `61`.
```js
assert($('text').eq(0).text() == '12' && $('text').eq(0).attr('y') == '61');
```
-The second `text` element should have a label of `31` and a `y` value of `4`.
+O segundo elemento `text` deve ter uma etiqueta com o valor `31` e um `y` com o valor de `4`.
```js
assert($('text').eq(1).text() == '31' && $('text').eq(1).attr('y') == '4');
```
-The third `text` element should have a label of `22` and a `y` value of `31`.
+O terceiro elemento `text` deve ter uma etiqueta com o valor `22` e um `y` com o valor de `31`.
```js
assert($('text').eq(2).text() == '22' && $('text').eq(2).attr('y') == '31');
```
-The fourth `text` element should have a label of `17` and a `y` value of `46`.
+O quarto elemento `text` deve ter uma etiqueta com o valor `17` e um `y` com o valor de `46`.
```js
assert($('text').eq(3).text() == '17' && $('text').eq(3).attr('y') == '46');
```
-The fifth `text` element should have a label of `25` and a `y` value of `22`.
+O quinto elemento `text` deve ter uma etiqueta com o valor `25` e um `y` com o valor de `22`.
```js
assert($('text').eq(4).text() == '25' && $('text').eq(4).attr('y') == '22');
```
-The sixth `text` element should have a label of `18` and a `y` value of `43`.
+O sexto elemento `text` deve ter uma etiqueta com o valor `18` e um `y` com o valor de `43`.
```js
assert($('text').eq(5).text() == '18' && $('text').eq(5).attr('y') == '43');
```
-The seventh `text` element should have a label of `29` and a `y` value of `10`.
+O sétimo elemento `text` deve ter uma etiqueta com o valor `29` e um `y` com o valor de `10`.
```js
assert($('text').eq(6).text() == '29' && $('text').eq(6).attr('y') == '10');
```
-The eighth `text` element should have a label of `14` and a `y` value of `55`.
+O oitavo elemento `text` deve ter uma etiqueta com o valor `14` e um `y` com o valor de `55`.
```js
assert($('text').eq(7).text() == '14' && $('text').eq(7).attr('y') == '55');
```
-The ninth `text` element should have a label of `9` and a `y` value of `70`.
+O nono elemento `text` deve ter uma etiqueta com o valor `9` e um `y` com o valor de `70`.
```js
assert($('text').eq(8).text() == '9' && $('text').eq(8).attr('y') == '70');
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles.md
index a2cd64c0a4..da81d3cbd2 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles.md
@@ -1,6 +1,6 @@
---
id: 587d7fab367417b2b2512bd9
-title: Add Labels to Scatter Plot Circles
+title: Adicionar etiquetas aos círculos do diagrama de dispersão
challengeType: 6
forumTopicId: 301477
dashedName: add-labels-to-scatter-plot-circles
@@ -8,25 +8,25 @@ dashedName: add-labels-to-scatter-plot-circles
# --description--
-You can add text to create labels for the points in a scatter plot.
+Você pode adicionar texto para criar etiquetas para os pontos em um diagrama de dispersão.
-The goal is to display the comma-separated values for the first (`x`) and second (`y`) fields of each item in `dataset`.
+O objetivo é exibir os valores separados por vírgula para o primeiro (`x`) e para o segundo (`y`) campo de cada item do `dataset`.
-The `text` nodes need `x` and `y` attributes to position it on the SVG canvas. In this challenge, the `y` value (which determines height) can use the same value that the `circle` uses for its `cy` attribute. The `x` value can be slightly larger than the `cx` value of the `circle`, so the label is visible. This will push the label to the right of the plotted point.
+Os nós de `text` precisam de atributos `x` e `y` para posicioná-los no canvas do SVG. Neste desafio, o valor de `y` (que determina a altura) pode usar o mesmo valor que `circle` usa para o seu atributo `cy`. O valor de `x` pode ser ligeiramente maior que do que o valor de `cx` de `circle`. Assim, a etiqueta estará visível. Isto empurrará a etiqueta para a direita do ponto traçado.
# --instructions--
-Label each point on the scatter plot using the `text` elements. The text of the label should be the two values separated by a comma and a space. For example, the label for the first point is `34, 78`. Set the `x` attribute so it's `5` units more than the value you used for the `cx` attribute on the `circle`. Set the `y` attribute the same way that's used for the `cy` value on the `circle`.
+Dê uma etiqueta a cada ponto no diagrama de dispersão usando o elemento `text`. O texto da etiqueta deve ter os dois valores separados por uma vírgula e um espaço. Por exemplo, a etiqueta para o primeiro ponto será `34, 78`. Defina o atributo `x` para que seja de `5` unidades a mais do que o valor usado para o atributo `cx` em `circle`. Defina o atributo `y` para que seja igual ao valor de `cy` em `circle`.
# --hints--
-Your code should have 10 `text` elements.
+O código deve ter 10 elementos `text`.
```js
assert($('text').length == 10);
```
-The first label should have text of `34, 78`, an `x` value of `39`, and a `y` value of `422`.
+A primeira etiqueta deve ter o texto `34, 78`, um valor de `x` de `39` e um valor de `y` de `422`.
```js
assert(
@@ -36,7 +36,7 @@ assert(
);
```
-The second label should have text of `109, 280`, an `x` value of `114`, and a `y` value of `220`.
+A segunda etiqueta deve ter o texto `109, 280`, um valor de `x` de `114` e um valor de `y` de `220`.
```js
assert(
@@ -46,7 +46,7 @@ assert(
);
```
-The third label should have text of `310, 120`, an `x` value of `315`, and a `y` value of `380`.
+A terceira etiqueta deve ter o texto `310, 120`, um valor de `x` de `315` e um valor de `y` de `380`.
```js
assert(
@@ -56,7 +56,7 @@ assert(
);
```
-The fourth label should have text of `79, 411`, an `x` value of `84`, and a `y` value of `89`.
+A quarta etiqueta deve ter o texto `79, 411`, um valor de `x` de `84` e um valor de `y` de `89`.
```js
assert(
@@ -66,7 +66,7 @@ assert(
);
```
-The fifth label should have text of `420, 220`, an `x` value of `425`, and a `y` value of `280`.
+A quinta etiqueta deve ter o texto `420, 220`, um valor de `x` de `425` e um valor de `y` de `280`.
```js
assert(
@@ -76,7 +76,7 @@ assert(
);
```
-The sixth label should have text of `233, 145`, an `x` value of `238`, and a `y` value of `355`.
+A sexta etiqueta deve ter o texto `233, 145`, um valor de `x` de `238` e um valor de `y` de `355`.
```js
assert(
@@ -86,7 +86,7 @@ assert(
);
```
-The seventh label should have text of `333, 96`, an `x` value of `338`, and a `y` value of `404`.
+A sétima etiqueta deve ter o texto `333, 96`, um valor de `x` de `338` e um valor de `y` de `404`.
```js
assert(
@@ -96,7 +96,7 @@ assert(
);
```
-The eighth label should have text of `222, 333`, an `x` value of `227`, and a `y` value of `167`.
+A oitava etiqueta deve ter o texto `222, 333`, um valor de `x` de `227` e um valor de `y` de `167`.
```js
assert(
@@ -106,7 +106,7 @@ assert(
);
```
-The ninth label should have text of `78, 320`, an `x` value of `83`, and a `y` value of `180`.
+A nona etiqueta deve ter o texto `78, 320`, um valor de `x` de `83` e um valor de `y` de `180`.
```js
assert(
@@ -116,7 +116,7 @@ assert(
);
```
-The tenth label should have text of `21, 123`, an `x` value of `26`, and a `y` value of `377`.
+A décima etiqueta deve ter o texto `21, 123`, um valor de `x` de `26` e um valor de `y` de `377`.
```js
assert(
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/change-styles-based-on-data.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/change-styles-based-on-data.md
index 1ed6ae7d5e..2f65f1d48d 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/change-styles-based-on-data.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/change-styles-based-on-data.md
@@ -1,6 +1,6 @@
---
id: 587d7fa7367417b2b2512bc7
-title: Change Styles Based on Data
+title: Alterar estilos com base nos dados
challengeType: 6
forumTopicId: 301479
dashedName: change-styles-based-on-data
@@ -8,9 +8,9 @@ dashedName: change-styles-based-on-data
# --description--
-D3 is about visualization and presentation of data. It's likely you'll want to change the styling of elements based on the data. You can use a callback function in the `style()` method to change the styling for different elements.
+O D3 tem a ver com a visualização e a apresentação dos dados. Você provavelmente vai querer alterar o estilo de elementos com base nos dados. Você pode usar uma função de callback no método `style()` para mudar a estilização para elementos diferentes.
-For example, you may want to color a data point blue if it has a value less than 20, and red otherwise. You can use a callback function in the `style()` method and include the conditional logic. The callback function uses the `d` parameter to represent the data point:
+Por exemplo, pode ser que você queira colorir um ponto dos dados em azul se ele tiver um valor inferior a 20, ou em vermelho se for igual ou superior. Você pode usar uma função de callback no método `style()` e incluir uma lógica condicional. A função de callback usa o parâmetro `d` para representar o ponto de dados:
```js
selection.style("color", (d) => {
@@ -18,65 +18,65 @@ selection.style("color", (d) => {
});
```
-The `style()` method is not limited to setting the `color` - it can be used with other CSS properties as well.
+O método `style()` não é limitado a definir `color` - ele também pode ser usado com outras propriedades do CSS.
# --instructions--
-Add the `style()` method to the code in the editor to set the `color` of the `h2` elements conditionally. Write the callback function so if the data value is less than 20, it returns red, otherwise it returns green.
+Adicione o método `style()` ao código no editor para definir `color` para os elementos `h2` de modo condicional. Escreva a função de callback de modo que, se o valor do dado for inferior a 20, ela retornará "red" (vermelho). Do contrário, retornará "green" (verde).
-**Note:** You can use if-else logic, or the ternary operator.
+**Observação:** você pode usar a lógica de if-else ou o operador ternário.
# --hints--
-The first `h2` should have a `color` of red.
+O primeiro `h2` deve ter `color` definido como "red".
```js
assert($('h2').eq(0).css('color') == 'rgb(255, 0, 0)');
```
-The second `h2` should have a `color` of green.
+O segundo `h2` deve ter `color` definido como "green".
```js
assert($('h2').eq(1).css('color') == 'rgb(0, 128, 0)');
```
-The third `h2` should have a `color` of green.
+O terceiro `h2` deve ter `color` definido como "green".
```js
assert($('h2').eq(2).css('color') == 'rgb(0, 128, 0)');
```
-The fourth `h2` should have a `color` of red.
+O quarto `h2` deve ter `color` definido como "red".
```js
assert($('h2').eq(3).css('color') == 'rgb(255, 0, 0)');
```
-The fifth `h2` should have a `color` of green.
+O quinto `h2` deve ter `color` definido como "green".
```js
assert($('h2').eq(4).css('color') == 'rgb(0, 128, 0)');
```
-The sixth `h2` should have a `color` of red.
+O quinto `h2` deve ter `color` definido como "red".
```js
assert($('h2').eq(5).css('color') == 'rgb(255, 0, 0)');
```
-The seventh `h2` should have a `color` of green.
+O sétimo `h2` deve ter `color` definido como "green".
```js
assert($('h2').eq(6).css('color') == 'rgb(0, 128, 0)');
```
-The eighth `h2` should have a `color` of red.
+O oitavo `h2` deve ter `color` definido como "red".
```js
assert($('h2').eq(7).css('color') == 'rgb(255, 0, 0)');
```
-The ninth `h2` should have a `color` of red.
+O nono `h2` deve ter `color` definido como "red".
```js
assert($('h2').eq(8).css('color') == 'rgb(255, 0, 0)');
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/change-the-color-of-an-svg-element.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/change-the-color-of-an-svg-element.md
index 4e0d47f93c..15864487ef 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/change-the-color-of-an-svg-element.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/change-the-color-of-an-svg-element.md
@@ -1,6 +1,6 @@
---
id: 587d7fa9367417b2b2512bd1
-title: Change the Color of an SVG Element
+title: Alterar a cor de um elemento do SVG
challengeType: 6
forumTopicId: 301480
dashedName: change-the-color-of-an-svg-element
@@ -8,17 +8,17 @@ dashedName: change-the-color-of-an-svg-element
# --description--
-The bars are in the right position, but they are all the same black color. SVG has a way to change the color of the bars.
+As barras estão na posição certa, mas são todas iguais, da cor preta. O SVG tem uma forma de alterar a cor das barras.
-In SVG, a `rect` shape is colored with the `fill` attribute. It supports hex codes, color names, and rgb values, as well as more complex options like gradients and transparency.
+No SVG, uma forma `rect` é colorida com o atributo `fill`. Esse atributo tem suporte de código hexadecimal, nomes de cores e valores rgb, bem como opções mais complexas, como gradientes e transparência.
# --instructions--
-Add an `attr()` method to set the `fill` of all the bars to the color navy.
+Adicione um método `attr()` para definir a propriedade `fill` de todas as barras com a cor "navy" (azul-marinho).
# --hints--
-The bars should all have a `fill` color of navy.
+As barras devem ter a propriedade `fill` com a cor "navy".
```js
assert($('rect').css('fill') == 'rgb(0, 0, 128)');
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/change-the-presentation-of-a-bar-chart.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/change-the-presentation-of-a-bar-chart.md
index 46b6e2613d..25c38132e1 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/change-the-presentation-of-a-bar-chart.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/change-the-presentation-of-a-bar-chart.md
@@ -1,6 +1,6 @@
---
id: 587d7fa8367417b2b2512bca
-title: Change the Presentation of a Bar Chart
+title: Alterar a apresentação de um gráfico de barras
challengeType: 6
forumTopicId: 301481
dashedName: change-the-presentation-of-a-bar-chart
@@ -8,21 +8,21 @@ dashedName: change-the-presentation-of-a-bar-chart
# --description--
-The last challenge created a bar chart, but there are a couple of formatting changes that could improve it:
+No último desafio, criamos um gráfico de barras, mas há algumas mudanças de formatação que poderiam melhorá-lo:
-1) Add space between each bar to visually separate them, which is done by adding a margin to the CSS for the `bar` class
+1) Adicione espaço entre cada barra para separá-las visualmente. Isso é feito adicionando uma margem ao CSS para a classe `bar`
-2) Increase the height of the bars to better show the difference in values, which is done by multiplying the value by a number to scale the height
+2) Aumente a altura das barras para mostrar melhor a diferença dos valores. Isso é feito multiplicando o valor por um número para dimensionar a altura
# --instructions--
-First, add a `margin` of `2px` to the `bar` class in the `style` tag. Next, change the callback function in the `style()` method so it returns a value `10` times the original data value (plus the `px`).
+Primeiro, adicione uma `margin` de `2px` à classe `bar` na tag `style`. Depois, altere a função de callback no método `style()` para que retorne um valor `10` vezes maior que o valor original dos dados (e a expressão `px`).
-**Note:** Multiplying each data point by the *same* constant only alters the scale. It's like zooming in, and it doesn't change the meaning of the underlying data.
+**Observação:** multiplicar cada ponto dos dados pela *mesma* constante somente altera a escala. É como fazer um zoom. Isso não altera o significado dos dados subjacentes.
# --hints--
-The first `div` should have a `height` of `120` pixels and a `margin` of `2` pixels.
+A primeira `div` deve ter uma `height` de `120` pixels e uma `margin` de `2` pixels.
```js
assert(
@@ -31,7 +31,7 @@ assert(
);
```
-The second `div` should have a `height` of `310` pixels and a `margin` of `2` pixels.
+A segunda `div` deve ter uma `height` de `310` pixels e uma `margin` de `2` pixels.
```js
assert(
@@ -40,7 +40,7 @@ assert(
);
```
-The third `div` should have a `height` of `220` pixels and a `margin` of `2` pixels.
+A terceira `div` deve ter uma `height` de `220` pixels e uma `margin` de `2` pixels.
```js
assert(
@@ -49,7 +49,7 @@ assert(
);
```
-The fourth `div` should have a `height` of `170` pixels and a `margin` of `2` pixels.
+A quarta `div` deve ter uma `height` de `170` pixels e uma `margin` de `2` pixels.
```js
assert(
@@ -58,7 +58,7 @@ assert(
);
```
-The fifth `div` should have a `height` of `250` pixels and a `margin` of `2` pixels.
+A quinta `div` deve ter uma `height` de `250` pixels e uma `margin` de `2` pixels.
```js
assert(
@@ -67,7 +67,7 @@ assert(
);
```
-The sixth `div` should have a `height` of `180` pixels and a `margin` of `2` pixels.
+A sexta `div` deve ter uma `height` de `180` pixels e uma `margin` de `2` pixels.
```js
assert(
@@ -76,7 +76,7 @@ assert(
);
```
-The seventh `div` should have a `height` of `290` pixels and a `margin` of `2` pixels.
+A sétima `div` deve ter uma `height` de `290` pixels e uma `margin` de `2` pixels.
```js
assert(
@@ -85,7 +85,7 @@ assert(
);
```
-The eighth `div` should have a `height` of `140` pixels and a `margin` of `2` pixels.
+A oitava `div` deve ter uma `height` de `140` pixels e uma `margin` de `2` pixels.
```js
assert(
@@ -94,7 +94,7 @@ assert(
);
```
-The ninth `div` should have a `height` of `90` pixels and a `margin` of `2` pixels.
+A nona `div` deve ter uma `height` de `90` pixels e uma `margin` de `2` pixels.
```js
assert(
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/create-a-bar-for-each-data-point-in-the-set.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/create-a-bar-for-each-data-point-in-the-set.md
index e988030673..44d0e776a3 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/create-a-bar-for-each-data-point-in-the-set.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/create-a-bar-for-each-data-point-in-the-set.md
@@ -1,6 +1,6 @@
---
id: 587d7fa8367417b2b2512bcd
-title: Create a Bar for Each Data Point in the Set
+title: Criar uma barra para cada ponto de dados no conjunto
challengeType: 6
forumTopicId: 301482
dashedName: create-a-bar-for-each-data-point-in-the-set
@@ -8,9 +8,9 @@ dashedName: create-a-bar-for-each-data-point-in-the-set
# --description--
-The last challenge added only one rectangle to the `svg` element to represent a bar. Here, you'll combine what you've learned so far about `data()`, `enter()`, and SVG shapes to create and append a rectangle for each data point in `dataset`.
+O último desafio adicionou apenas um retângulo ao elemento `svg` para representar uma barra. Aqui, você vai combinar o que você aprendeu até agora sobre `data()`, `enter()` e formas do SVG para criar e incluir um retângulo para cada ponto de dados no `dataset`.
-A previous challenge showed the format for how to create and append a `div` for each item in `dataset`:
+Um desafio anterior mostrou o formato para criar e acrescentar um `div` para cada item no `dataset`:
```js
d3.select("body").selectAll("div")
@@ -19,33 +19,33 @@ d3.select("body").selectAll("div")
.append("div")
```
-There are a few differences working with `rect` elements instead of `div` elements. The `rect` elements must be appended to an `svg` element, not directly to the `body`. Also, you need to tell D3 where to place each `rect` within the `svg` area. The bar placement will be covered in the next challenge.
+Existem algumas diferenças ao trabalhar com elementos `rect` em vez de elementos `div`. Os elementos `rect` devem ser incluídos em um elemento `svg`, não diretamente no `body`. Além disso, você precisa dizer ao D3 onde colocar cada `rect` na área do `svg`. O posicionamento da barra será tratado no próximo desafio.
# --instructions--
-Use the `data()`, `enter()`, and `append()` methods to create and append a `rect` for each item in `dataset`. The bars should display all on top of each other; this will be fixed in the next challenge.
+Use os métodos `data()`, `enter()` e `append()` para criar e incluir um `rect` para cada item no `dataset`. As barras devem ser exibidas em cima umas das outras. Isto será corrigido no próximo desafio.
# --hints--
-Your document should have 9 `rect` elements.
+O documento deve ter 9 elementos `rect`.
```js
assert($('rect').length == 9);
```
-Your code should use the `data()` method.
+O código deve usar o método `data()`.
```js
assert(code.match(/\.data/g));
```
-Your code should use the `enter()` method.
+O código deve usar o método `enter()`.
```js
assert(code.match(/\.enter/g));
```
-Your code should use the `append()` method.
+O código deve usar o método `append()`.
```js
assert(code.match(/\.append/g));
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3.md
index d118740df6..88ee392f4d 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3.md
@@ -1,6 +1,6 @@
---
id: 587d7fab367417b2b2512bda
-title: Create a Linear Scale with D3
+title: Criar uma escala linear com o D3
challengeType: 6
forumTopicId: 301483
dashedName: create-a-linear-scale-with-d3
@@ -8,41 +8,41 @@ dashedName: create-a-linear-scale-with-d3
# --description--
-The bar and scatter plot charts both plotted data directly onto the SVG canvas. However, if the height of a bar or one of the data points were larger than the SVG height or width values, it would go outside the SVG area.
+O gráfico de barras e o diagrama de dispersão traçam os dados diretamente no canvas do SVG. No entanto, se a altura de uma barra ou de um dos pontos de dados for maior que os valores de altura ou de largura do SVG, acabaria saindo dá área do SVG.
-In D3, there are scales to help plot data. `scales` are functions that tell the program how to map a set of raw data points onto the pixels of the SVG canvas.
+No D3, há escalas para ajudar a traçar os dados. As `scales` são funções que dizem ao programa como mapear um conjunto de pontos de dados brutos para os pixels do canvas do SVG.
-For example, say you have a 100x500-sized SVG canvas and you want to plot Gross Domestic Product (GDP) for a number of countries. The set of numbers would be in the billion or trillion-dollar range. You provide D3 a type of scale to tell it how to place the large GDP values into that 100x500-sized area.
+Por exemplo, digamos que você tem um canvas de SVG de 100x500 de tamanho e que deseja representar o produto interno bruto (PIB) de vários países. O conjunto dos números estaria na faixa de bilhões ou trilhões de dólares. Você fornece ao D3 um tipo de escala para dizer como colocar os grandes valores do PIB naquela área de tamanho de 100x500.
-It's unlikely you would plot raw data as-is. Before plotting it, you set the scale for your entire data set, so that the `x` and `y` values fit your canvas width and height.
+É improvável que você trace os dados brutos como estão. Antes de desenhá-los, defina a escala de todo o seu conjunto de dados, de modo que os valores de `x` e `y` se ajustem à largura e à altura do canvas.
-D3 has several scale types. For a linear scale (usually used with quantitative data), there is the D3 method `scaleLinear()`:
+O D3 tem vários tipos de escala. Para uma escala linear (geralmente usada com dados quantitativos), existe o método `scaleLinear()` do D3:
```js
const scale = d3.scaleLinear()
```
-By default, a scale uses the identity relationship. The value of the input is the same as the value of the output. A separate challenge covers how to change this.
+Por padrão, uma escala usa a relação de identidade. O valor de entrada é o mesmo que o valor de saída. Um desafio separado trata da maneira de alterar esta situação.
# --instructions--
-Change the `scale` variable to create a linear scale. Then set the `output` variable to the scale called with an input argument of `50`.
+Altere a variável `scale` para criar uma escala linear. Em seguida, defina a variável `output` como a escala chamada com um argumento de entrada de `50`.
# --hints--
-The text in the `h2` should be `50`.
+O texto no `h2` deve ser `50`.
```js
assert($('h2').text() == '50');
```
-Your code should use the `scaleLinear()` method.
+O código deve usar o método `scaleLinear()`.
```js
assert(code.match(/\.scaleLinear/g));
```
-The `output` variable should call `scale` with an argument of `50`.
+A variável `output` deve chamar a `scale` com um argumento de `50`.
```js
assert(output == 50 && code.match(/scale\(\s*?50\s*?\)/g));
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles.md
index 5f4bd1e056..e4e2bace2c 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles.md
@@ -1,6 +1,6 @@
---
id: 587d7fab367417b2b2512bd7
-title: Create a Scatterplot with SVG Circles
+title: Criar um diagrama de dispersão com círculos do SVG
challengeType: 6
forumTopicId: 301484
dashedName: create-a-scatterplot-with-svg-circles
@@ -8,19 +8,19 @@ dashedName: create-a-scatterplot-with-svg-circles
# --description--
-A scatter plot is another type of visualization. It usually uses circles to map data points, which have two values each. These values tie to the `x` and `y` axes, and are used to position the circle in the visualization.
+Um diagrama de dispersão é outro tipo de visualização. Ele geralmente usa círculos para mapear pontos de dados, que têm dois valores cada. Esses valores estão relacionados aos eixos `x` e `y`, sendo usados para posicionar o círculo na visualização.
-SVG has a `circle` tag to create the circle shape. It works a lot like the `rect` elements you used for the bar chart.
+O SVG tem uma tag `circle` para criar a forma do círculo. Funciona muito parecido com os elementos `rect` que você usou para o gráfico de barras.
# --instructions--
-Use the `data()`, `enter()`, and `append()` methods to bind `dataset` to new `circle` elements that are appended to the SVG canvas.
+Use os métodos `data()`, `enter()` e `append()` para associar o `dataset` aos novos elementos de `circle` que são incluídos no canvas do SVG.
-**Note:** The circles won't be visible because we haven't set their attributes yet. We'll do that in the next challenge.
+**Observação:** os círculos não serão visíveis porque ainda não definimos seus atributos. Faremos isso no próximo desafio.
# --hints--
-Your code should have 10 `circle` elements.
+O código deve ter 10 elementos `circle`.
```js
assert($('circle').length == 10);
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/display-shapes-with-svg.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/display-shapes-with-svg.md
index 71a39ddaf1..4df76df69d 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/display-shapes-with-svg.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/display-shapes-with-svg.md
@@ -1,6 +1,6 @@
---
id: 587d7fa8367417b2b2512bcc
-title: Display Shapes with SVG
+title: Exibir formas com o SVG
challengeType: 6
forumTopicId: 301485
dashedName: display-shapes-with-svg
@@ -8,47 +8,47 @@ dashedName: display-shapes-with-svg
# --description--
-The last challenge created an `svg` element with a given width and height, which was visible because it had a `background-color` applied to it in the `style` tag. The code made space for the given width and height.
+O último desafio criou um elemento `svg` com uma determinada largura e altura, que era visível porque tinha uma `background-color` aplicada a ele na tag `style`. O código criou espaço para a largura e altura fornecidas.
-The next step is to create a shape to put in the `svg` area. There are a number of supported shapes in SVG, such as rectangles and circles. They are used to display data. For example, a rectangle (``) SVG shape could create a bar in a bar chart.
+O próximo passo é criar uma forma para colocar na área do `svg`. Há várias formas suportadas no SVG, como retângulos e círculos. Elas são usadas para exibir dados. Por exemplo, a forma do retângulo (``) do SVG pode criar uma barra em um gráfico de barras.
-When you place a shape into the `svg` area, you can specify where it goes with `x` and `y` coordinates. The origin point of (0, 0) is in the upper-left corner. Positive values for `x` push the shape to the right, and positive values for `y` push the shape down from the origin point.
+Quando você coloca uma forma na área do `svg`, você pode especificar onde ela vai com as coordenadas `x` e `y`. O ponto de origem (0, 0) está no canto superior esquerdo. Valores positivos para `x` empurram a forma para a direita, enquanto valores positivos para `y` empurram a forma para baixo do ponto de origem.
-To place a shape in the middle of the 500 (width) x 100 (height) `svg` from last challenge, the `x` coordinate would be 250 and the `y` coordinate would be 50.
+Para colocar uma forma no meio do `svg` de 500 (largura) x 100 (altura) do último desafio, a coordenada `x` seria 250 e a coordenada `y` seria 50.
-An SVG `rect` has four attributes. There are the `x` and `y` coordinates for where it is placed in the `svg` area. It also has a `height` and `width` to specify the size.
+Uma forma `rect` do SVG tem quatro atributos. Existem as coordenadas `x` e `y`, para onde elas são colocadas na área do `svg`. Ela também tem `height` e `width` para especificar o tamanho.
# --instructions--
-Add a `rect` shape to the `svg` using `append()`, and give it a `width` attribute of `25` and `height` attribute of `100`. Also, give the `rect` `x` and `y` attributes each set to `0`.
+Adicione uma forma `rect` ao `svg` usando `append()`. Dê a ele um atributo `width` de `25` e uma `height` de `100`. Além disso, dê aos atributos de `rect`, `x` e `y`, o valor de `0`.
# --hints--
-Your document should have 1 `rect` element.
+O documento deve ter 1 elemento `rect`.
```js
assert($('rect').length == 1);
```
-The `rect` element should have a `width` attribute set to `25`.
+O elemento `rect` deve ter um atributo `width` com o valor de `25`.
```js
assert($('rect').attr('width') == '25');
```
-The `rect` element should have a `height` attribute set to `100`.
+O elemento `rect` deve ter um atributo `height` com o valor de `100`.
```js
assert($('rect').attr('height') == '100');
```
-The `rect` element should have an `x` attribute set to `0`.
+O elemento `rect` deve ter um atributo `x` com o valor de `0`.
```js
assert($('rect').attr('x') == '0');
```
-The `rect` element should have a `y` attribute set to `0`.
+O elemento `rect` deve ter um atributo `y` com o valor de `0`.
```js
assert($('rect').attr('y') == '0');
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/dynamically-change-the-height-of-each-bar.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/dynamically-change-the-height-of-each-bar.md
index 33463161a2..59dac315fb 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/dynamically-change-the-height-of-each-bar.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/dynamically-change-the-height-of-each-bar.md
@@ -1,6 +1,6 @@
---
id: 587d7fa9367417b2b2512bcf
-title: Dynamically Change the Height of Each Bar
+title: Alterar dinamicamente a altura de cada barra
challengeType: 6
forumTopicId: 301486
dashedName: dynamically-change-the-height-of-each-bar
@@ -8,7 +8,7 @@ dashedName: dynamically-change-the-height-of-each-bar
# --description--
-The height of each bar can be set to the value of the data point in the array, similar to how the `x` value was set dynamically.
+A altura de cada barra pode ser definida como o valor do ponto de dados no array, de modo semelhante a como o valor de `x` foi definido dinamicamente.
```js
selection.attr("property", (d, i) => {
@@ -16,65 +16,65 @@ selection.attr("property", (d, i) => {
})
```
-Here `d` would be the data point value, and `i` would be the index of the data point in the array.
+Aqui, `d` seria o valor do ponto de dados, enquanto `i` seria o índice do ponto de dados no array.
# --instructions--
-Change the callback function for the `height` attribute to return the data value times 3.
+Altere a função de callback para o atributo `height` para que retorne o valor dos dados vezes 3.
-**Note:** Remember that multiplying all data points by the same constant scales the data (like zooming in). It helps to see the differences between bar values in this example.
+**Observação:** lembre-se de que multiplicar todos os dados redimensiona os dados (como se déssemos um zoom). Neste exemplo, ajuda a ver as diferenças entre os valores da barra.
# --hints--
-The first `rect` should have a `height` of `36`.
+O primeiro `rect` deve ter uma `height` de `36`.
```js
assert($('rect').eq(0).attr('height') == '36');
```
-The second `rect` should have a `height` of `93`.
+O segundo `rect` deve ter uma `height` de `93`.
```js
assert($('rect').eq(1).attr('height') == '93');
```
-The third `rect` should have a `height` of `66`.
+O terceiro `rect` deve ter uma `height` de `66`.
```js
assert($('rect').eq(2).attr('height') == '66');
```
-The fourth `rect` should have a `height` of `51`.
+O quarto `rect` deve ter uma `height` de `51`.
```js
assert($('rect').eq(3).attr('height') == '51');
```
-The fifth `rect` should have a `height` of `75`.
+O quinto `rect` deve ter uma `height` de `75`.
```js
assert($('rect').eq(4).attr('height') == '75');
```
-The sixth `rect` should have a `height` of `54`.
+O sexto `rect` deve ter uma `height` de `54`.
```js
assert($('rect').eq(5).attr('height') == '54');
```
-The seventh `rect` should have a `height` of `87`.
+O sétimo `rect` deve ter uma `height` de `87`.
```js
assert($('rect').eq(6).attr('height') == '87');
```
-The eighth `rect` should have a `height` of `42`.
+O oitavo `rect` deve ter uma `height` de `42`.
```js
assert($('rect').eq(7).attr('height') == '42');
```
-The ninth `rect` should have a `height` of `27`.
+O nono `rect` deve ter uma `height` de `27`.
```js
assert($('rect').eq(8).attr('height') == '27');
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/dynamically-set-the-coordinates-for-each-bar.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/dynamically-set-the-coordinates-for-each-bar.md
index ad10065163..5f87068afd 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/dynamically-set-the-coordinates-for-each-bar.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/dynamically-set-the-coordinates-for-each-bar.md
@@ -1,6 +1,6 @@
---
id: 587d7fa9367417b2b2512bce
-title: Dynamically Set the Coordinates for Each Bar
+title: Definir dinamicamente as coordenadas para cada barra
challengeType: 6
forumTopicId: 301487
dashedName: dynamically-set-the-coordinates-for-each-bar
@@ -8,13 +8,13 @@ dashedName: dynamically-set-the-coordinates-for-each-bar
# --description--
-The last challenge created and appended a rectangle to the `svg` element for each point in `dataset` to represent a bar. Unfortunately, they were all stacked on top of each other.
+No último desafio, você criou e anexou um retângulo ao elemento `svg` para cada ponto do `dataset` para representar uma barra. Infelizmente, todos eles ficaram empilhados um sobre o outro.
-The placement of a rectangle is handled by the `x` and `y` attributes. They tell D3 where to start drawing the shape in the `svg` area. The last challenge set them each to 0, so every bar was placed in the upper-left corner.
+O posicionamento de um retângulo é realizado pelos atributos `x` e `y`. Eles dizem ao D3 onde começar a desenhar a forma na área `svg`. O último desafio os definiu como 0. Então, todas as barras foram colocadas no canto superior esquerdo.
-For a bar chart, all of the bars should sit on the same vertical level, which means the `y` value stays the same (at 0) for all bars. The `x` value, however, needs to change as you add new bars. Remember that larger `x` values push items farther to the right. As you go through the array elements in `dataset`, the `x` value should increase.
+Para um gráfico de barras, todas as barras devem ficar no mesmo nível vertical, o que significa que o valor de `y` permanece o mesmo (0) para todas as barras. O valor de `x`, no entanto, precisa ser alterado conforme você adiciona novas barras. Lembre-se de que valores de `x` maiores empurram os itens mais para a direita. À medida que você passa pelos elementos do array no `dataset`, o valor de `x` deve aumentar.
-The `attr()` method in D3 accepts a callback function to dynamically set that attribute. The callback function takes two arguments, one for the data point itself (usually `d`) and one for the index of the data point in the array. The second argument for the index is optional. Here's the format:
+O método `attr()` do D3 aceita uma função de callback para definir dinamicamente esse atributo. A função de callback recebe dois argumentos, um para os dados em si (geralmente `d`) e um para o índice do ponto dos dados no array. O segundo argumento para o índice é opcional. Este é o formato:
```js
selection.attr("property", (d, i) => {
@@ -22,65 +22,65 @@ selection.attr("property", (d, i) => {
})
```
-It's important to note that you do NOT need to write a `for` loop or use `forEach()` to iterate over the items in the data set. Recall that the `data()` method parses the data set, and any method that's chained after `data()` is run once for each item in the data set.
+É importante notar que você NÃO precisa escrever um laço `for` ou usar `forEach()` para iterar pelos itens no conjunto de dados. Lembre-se de que o método `data()` analisa o conjunto de dados. Qualquer método que seja encadeado após `data()` é executado uma vez por cada item no conjunto de dados.
# --instructions--
-Change the `x` attribute callback function so it returns the index times 30.
+Altere a função de callback `x` para que ela retorne o índice 30 vezes.
-**Note:** Each bar has a width of 25, so increasing each `x` value by 30 adds some space between the bars. Any value greater than 25 would work in this example.
+**Observação:** cada barra tem uma largura de 25, então aumentar cada valor de `x` por 30 adiciona algum espaço entre as barras. Qualquer valor superior a 25 poderia servir neste exemplo.
# --hints--
-The first `rect` should have an `x` value of `0`.
+O primeiro `rect` deve ter um valor de `x` igual a `0`.
```js
assert($('rect').eq(0).attr('x') == '0');
```
-The second `rect` should have an `x` value of `30`.
+O segundo `rect` deve ter um valor de `x` igual a `30`.
```js
assert($('rect').eq(1).attr('x') == '30');
```
-The third `rect` should have an `x` value of `60`.
+O terceiro `rect` deve ter um valor de `x` igual a `60`.
```js
assert($('rect').eq(2).attr('x') == '60');
```
-The fourth `rect` should have an `x` value of `90`.
+O quarto `rect` deve ter um valor de `x` igual a `90`.
```js
assert($('rect').eq(3).attr('x') == '90');
```
-The fifth `rect` should have an `x` value of `120`.
+O quinto `rect` deve ter um valor de `x` igual a `120`.
```js
assert($('rect').eq(4).attr('x') == '120');
```
-The sixth `rect` should have an `x` value of `150`.
+O sexto `rect` deve ter um valor de `x` igual a `150`.
```js
assert($('rect').eq(5).attr('x') == '150');
```
-The seventh `rect` should have an `x` value of `180`.
+O sétimo `rect` deve ter um valor de `x` igual a `180`.
```js
assert($('rect').eq(6).attr('x') == '180');
```
-The eighth `rect` should have an `x` value of `210`.
+O oitavo `rect` deve ter um valor de `x` igual a `210`.
```js
assert($('rect').eq(7).attr('x') == '210');
```
-The ninth `rect` should have an `x` value of `240`.
+O nono `rect` deve ter um valor de `x` igual a `240`.
```js
assert($('rect').eq(8).attr('x') == '240');
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/invert-svg-elements.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/invert-svg-elements.md
index 66156ef887..cd92056cf4 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/invert-svg-elements.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/invert-svg-elements.md
@@ -1,6 +1,6 @@
---
id: 587d7fa9367417b2b2512bd0
-title: Invert SVG Elements
+title: Inverter elementos do SVG
challengeType: 6
forumTopicId: 301488
dashedName: invert-svg-elements
@@ -8,73 +8,73 @@ dashedName: invert-svg-elements
# --description--
-You may have noticed the bar chart looked like it's upside-down, or inverted. This is because of how SVG uses (x, y) coordinates.
+Você pode ter percebido que o gráfico de barras parecia estar de cabeça para baixo ou invertido. Isso ocorre porque o SVG usa coordenadas (x, y).
-In SVG, the origin point for the coordinates is in the upper-left corner. An `x` coordinate of 0 places a shape on the left edge of the SVG area. A `y` coordinate of 0 places a shape on the top edge of the SVG area. Higher `x` values push the rectangle to the right. Higher `y` values push the rectangle down.
+No SVG, o ponto de origem para as coordenadas está no canto superior esquerdo. Uma coordenada `x` de 0 coloca uma forma na borda esquerda da área do SVG. Uma coordenada `y` de 0 coloca uma forma na borda superior da área do SVG. Valores mais altos de `x` empurram o retângulo para a direita. Valores mais altos de `y` empurram o retângulo para baixo.
-To make the bars right-side-up, you need to change the way the `y` coordinate is calculated. It needs to account for both the height of the bar and the total height of the SVG area.
+Para fazer as barras ficarem na posição correta, você precisa alterar a maneira como a coordenada `y` é calculada. Isso precisa levar em conta tanto a altura da barra quanto a altura total da área do SVG.
-The height of the SVG area is 100. If you have a data point of 0 in the set, you would want the bar to start at the bottom of the SVG area (not the top). To do this, the `y` coordinate needs a value of 100. If the data point value were 1, you would start with a `y` coordinate of 100 to set the bar at the bottom. Then you need to account for the height of the bar of 1, so the final `y` coordinate would be 99.
+A altura da área do SVG é 100. Se você tem um ponto de dados de 0 no conjunto, você deve esperar que a barra comece na parte inferior da área do SVG (não na parte superior). Para fazer isso, a coordenada `y` precisa de um valor de 100. Se o valor do ponto de dados for 1, você começaria com uma coordenada `y` de 100 para definir a barra na parte inferior. Em seguida, você precisa levar em conta a altura da barra de 1. Assim, a coordenada `y` final seria 99.
-The `y` coordinate that is `y = heightOfSVG - heightOfBar` would place the bars right-side-up.
+A coordenada `y` que é `y = heightOfSVG - heightOfBar` colocaria as barras na posição correta.
# --instructions--
-Change the callback function for the `y` attribute to set the bars right-side-up. Remember that the `height` of the bar is 3 times the data value `d`.
+Altere a função de callback para o atributo `y` para definir a posição das barras no lugar certo. Lembre-se de que a `height` da barra é 3 vezes o valor do dado `d`.
-**Note:** In general, the relationship is `y = h - m * d`, where `m` is the constant that scales the data points.
+**Observação:** em geral, a relação é `y = h - m * d`, onde `m` é a constante que dimensiona os pontos de dados.
# --hints--
-The first `rect` should have a `y` value of `64`.
+O primeiro `rect` deve ter um valor de `y` igual a `64`.
```js
assert($('rect').eq(0).attr('y') == h - dataset[0] * 3);
```
-The second `rect` should have a `y` value of `7`.
+O segundo `rect` deve ter um valor de `y` igual a `7`.
```js
assert($('rect').eq(1).attr('y') == h - dataset[1] * 3);
```
-The third `rect` should have a `y` value of `34`.
+O terceiro `rect` deve ter um valor de `y` igual a `34`.
```js
assert($('rect').eq(2).attr('y') == h - dataset[2] * 3);
```
-The fourth `rect` should have a `y` value of `49`.
+O quarto `rect` deve ter um valor de `y` igual a `49`.
```js
assert($('rect').eq(3).attr('y') == h - dataset[3] * 3);
```
-The fifth `rect` should have a `y` value of `25`.
+O quinto `rect` deve ter um valor de `y` igual a `25`.
```js
assert($('rect').eq(4).attr('y') == h - dataset[4] * 3);
```
-The sixth `rect` should have a `y` value of `46`.
+O sexto `rect` deve ter um valor de `y` igual a `46`.
```js
assert($('rect').eq(5).attr('y') == h - dataset[5] * 3);
```
-The seventh `rect` should have a `y` value of `13`.
+O sétimo `rect` deve ter um valor de `y` igual a `13`.
```js
assert($('rect').eq(6).attr('y') == h - dataset[6] * 3);
```
-The eighth `rect` should have a `y` value of `58`.
+O oitavo `rect` deve ter um valor de `y` igual a `58`.
```js
assert($('rect').eq(7).attr('y') == h - dataset[7] * 3);
```
-The ninth `rect` should have a `y` value of `73`.
+O nono `rect` deve ter um valor de `y` igual a `73`.
```js
assert($('rect').eq(8).attr('y') == h - dataset[8] * 3);
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/learn-about-svg-in-d3.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/learn-about-svg-in-d3.md
index f5fba672e9..583b6a0895 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/learn-about-svg-in-d3.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/learn-about-svg-in-d3.md
@@ -1,6 +1,6 @@
---
id: 587d7fa8367417b2b2512bcb
-title: Learn About SVG in D3
+title: Aprender sobre o SVG no D3
challengeType: 6
forumTopicId: 301489
dashedName: learn-about-svg-in-d3
@@ -8,35 +8,35 @@ dashedName: learn-about-svg-in-d3
# --description--
-SVG stands for Scalable Vector Graphics.
+SVG é a abreviação de Scalable Vector Graphics.
-Here "scalable" means that, if you zoom in or out on an object, it would not appear pixelated. It scales with the display system, whether it's on a small mobile screen or a large TV monitor.
+Aqui, "scalable" significa que, se você der zoom ou se afastar do objeto, ele não parecerá pixelado. Ele se redimensiona com o sistema de exibição, seja na tela pequena de um dispositivo móvel, seja em um monitor grande de TV.
-SVG is used to make common geometric shapes. Since D3 maps data into a visual representation, it uses SVG to create the shapes for the visualization. SVG shapes for a web page must go within an HTML `svg` tag.
+O SVG é usado para fazer formas geométricas comuns. Como o D3 faz o mapeamento dos dados em uma representação visual, ele usa o SVG para criar as formas para a visualização. As formas do SVG para um página da web devem ir dentro de uma tag `svg`.
-CSS can be scalable when styles use relative units (such as `vh`, `vw`, or percentages), but using SVG is more flexible to build data visualizations.
+O CSS pode ser dimensionável quando os estilos usam unidades relativas (como `vh`, `vw` ou porcentagens), mas usar o SVG é mais flexível para criar visualizações de dados.
# --instructions--
-Add an `svg` node to the `body` using `append()`. Give it a `width` attribute set to the provided `w` constant and a `height` attribute set to the provided `h` constant using the `attr()` or `style()` methods for each. You'll see it in the output because there's a `background-color` of pink applied to it in the `style` tag.
+Adicione um nó do `svg` ao `body` usando `append()`. Dê um atributo `width` definido para a constante `w` fornecida e um atributo `height` definido para a constante `h` fornecida usando os métodos `attr()` ou `style()` para cada um. Você verá o nó no resultado porque há uma `background-color` rosa aplicada a ele na tag `style`.
-**Note:** When using `attr()` width and height attributes do not have units. This is the building block of scaling - the element will always have a 5:1 width to height ratio, no matter what the zoom level is.
+**Observação:** ao usar `attr()`, os atributos width e height não têm unidades. Este é o bloco de construção do dimensionamento - o elemento terá sempre uma proporção de 5:1 da largura para a altura, não importando o nível de zoom.
# --hints--
-Your document should have 1 `svg` element.
+O documento deve ter 1 elemento `svg`.
```js
assert($('svg').length == 1);
```
-The `svg` element should have a `width` attribute set to `500` or styled to have a width of `500px`.
+O elemento `svg` deve ter um atributo `width` definido como `500` ou estilizado para ter uma largura de `500px`.
```js
assert($('svg').attr('width') == '500' || $('svg').css('width') == '500px');
```
-The `svg` element should have a `height` attribute set to `100` or styled to have a height of `100px`.
+O elemento `svg` deve ter um atributo `height` definido como `100` ou estilizado para ter uma largura de `100px`.
```js
assert($('svg').attr('height') == '100' || $('svg').css('height') == '100px');
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/select-a-group-of-elements-with-d3.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/select-a-group-of-elements-with-d3.md
index bf0acc7b43..4ca475a745 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/select-a-group-of-elements-with-d3.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/select-a-group-of-elements-with-d3.md
@@ -1,6 +1,6 @@
---
id: 587d7fa6367417b2b2512bc3
-title: Select a Group of Elements with D3
+title: Selecionar um grupo de elementos com D3
challengeType: 6
forumTopicId: 301490
dashedName: select-a-group-of-elements-with-d3
@@ -8,21 +8,21 @@ dashedName: select-a-group-of-elements-with-d3
# --description--
-D3 also has the `selectAll()` method to select a group of elements. It returns an array of HTML nodes for all the items in the document that match the input string. Here's an example to select all the anchor tags in a document:
+O D3 também tem o método `selectAll()` para selecionar um grupo de elementos. Ele retorna um array de nós de HTML para todos os itens no documento que correspondem à string de entrada. Aqui está um exemplo para selecionar todas as tags de âncora em um documento:
```js
const anchors = d3.selectAll("a");
```
-Like the `select()` method, `selectAll()` supports method chaining, and you can use it with other methods.
+Assim como o método `select()`, o `selectAll()` suporta encadeamento de métodos e você pode usá-lo com outros métodos.
# --instructions--
-Select all of the `li` tags in the document, and change their text to the string `list item` by chaining the `.text()` method.
+Selecione todas as tags `li` do documento e altere o texto delas para a string `list item`, encadeando o método `.text()`.
# --hints--
-There should be 3 `li` elements on the page, and the text in each one should say `list item`. Capitalization and spacing should match exactly.
+Deve haver 3 elementos `li` na página, e o texto em cada um deve dizer `list item`. A capitalização e o espaçamento devem coincidir com exatidão.
```js
assert(
@@ -32,13 +32,13 @@ assert(
);
```
-Your code should access the `d3` object.
+O código deve acessar o objeto `d3`.
```js
assert(code.match(/d3/g));
```
-Your code should use the `selectAll` method.
+O código deve usar o método `selectAll`.
```js
assert(code.match(/\.selectAll/g));
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale.md
index 5a678c5dd0..1cd6002bfb 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale.md
@@ -1,6 +1,6 @@
---
id: 587d7fac367417b2b2512bdb
-title: Set a Domain and a Range on a Scale
+title: Definir um domínio e uma imagem em uma escala
challengeType: 6
forumTopicId: 301491
dashedName: set-a-domain-and-a-range-on-a-scale
@@ -8,13 +8,13 @@ dashedName: set-a-domain-and-a-range-on-a-scale
# --description--
-By default, scales use the identity relationship. This means the input value maps to the output value. However, scales can be much more flexible and interesting.
+Por padrão, as escalas usam a relação de identidade. Isso significa que o valor de entrada mapeia para o valor de saída. Entretanto, as escalas podem ser muito mais flexíveis e interessantes.
-Say a dataset has values ranging from 50 to 480. This is the input information for a scale, also known as the domain.
+Digamos que um conjunto de dados tenha valores em um intervalo de 50 a 480. Esta é a informação de entrada para uma escala, também conhecida como o domínio.
-You want to map those points along the `x` axis on the SVG canvas, between 10 units and 500 units. This is the output information, also known as the range.
+Você deseja mapear esses pontos sobre o eixo `x` no canvas do SVG, entre 10 e 500 unidades. Esta é a informação de saída, também conhecida como o imagem.
-The `domain()` and `range()` methods set these values for the scale. Both methods take an array of at least two elements as an argument. Here's an example:
+Os métodos `domain()` e `range()` definem esses valores para a escala. Os dois métodos recebem um array de pelo menos dois elementos como argumento. Exemplo:
```js
scale.domain([50, 480]);
@@ -26,43 +26,43 @@ scale(750)
d3.scaleLinear()
```
-In order, the following values would be displayed in the console: `10`, `500`, `323.37`, and `807.67`.
+Em ordem, os valores a seguir serão exibidos no console: `10`, `500`, `323.37` e `807.67`.
-Notice that the scale uses the linear relationship between the domain and range values to figure out what the output should be for a given number. The minimum value in the domain (50) maps to the minimum value (10) in the range.
+Observe que a escala usa a relação linear entre os valores do domínio e da imagem para descobrir qual deve ser a saída para um determinado número. O valor mínimo no domínio (50) é mapeado para o valor mínimo (10) na imagem.
# --instructions--
-Create a scale and set its domain to `[250, 500]` and range to `[10, 150]`.
+Crie uma escala e defina seu domínio como `[250, 500]` e sua imagem (range) como `[10, 150]`.
-**Note:** You can chain the `domain()` and `range()` methods onto the `scale` variable.
+**Observação:** você pode encadear os métodos `domain()` e `range()` na variável `scale`.
# --hints--
-Your code should use the `domain()` method.
+O código deve usar o método `domain()`.
```js
assert(code.match(/\.domain/g));
```
-The `domain()` of the `scale` should be set to `[250, 500]`.
+O `domain()` de `scale` deve ser definido como `[250, 500]`.
```js
assert(JSON.stringify(scale.domain()) == JSON.stringify([250, 500]));
```
-Your code should use the `range()` method.
+O código deve usar o método `range()`.
```js
assert(code.match(/\.range/g));
```
-The `range()` of the `scale` should be set to `[10, 150]`.
+O `range()` de `scale` deve ser definido como `[10, 150]`.
```js
assert(JSON.stringify(scale.range()) == JSON.stringify([10, 150]));
```
-The text in the `h2` should be `-102`.
+O texto no `h2` deve ser `-102`.
```js
assert($('h2').text() == '-102');
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/style-d3-labels.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/style-d3-labels.md
index 934932f51f..7b03c1eacf 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/style-d3-labels.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/style-d3-labels.md
@@ -1,6 +1,6 @@
---
id: 587d7faa367417b2b2512bd3
-title: Style D3 Labels
+title: Estilizar as etiquetas do D3
challengeType: 6
forumTopicId: 301492
dashedName: style-d3-labels
@@ -8,21 +8,21 @@ dashedName: style-d3-labels
# --description--
-D3 methods can add styles to the bar labels. The `fill` attribute sets the color of the text for a `text` node. The `style()` method sets CSS rules for other styles, such as `font-family` or `font-size`.
+Os métodos do D3 podem adicionar estilos às etiquetas das barras. O atributo `fill` define a cor do texto para um nó `text`. O método `style()` define as regras do CSS para outros estilos, como `font-family` ou `font-size`.
# --instructions--
-Set the `font-size` of the `text` elements to `25px`, and the color of the text to red.
+Defina o `font-size` dos elementos `text` para `25px` e a cor do texto para "red" (vermelho).
# --hints--
-The labels should all have a `fill` color of red.
+As etiquetas devem ter a propriedade `fill` com a cor "red".
```js
assert($('text').css('fill') == 'rgb(255, 0, 0)');
```
-The labels should all have a `font-size` of `25` pixels.
+As etiquetas devem ter um `font-size` de `25` pixels.
```js
assert($('text').css('font-size') == '25px');
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/update-the-height-of-an-element-dynamically.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/update-the-height-of-an-element-dynamically.md
index 27dd13a1b9..41532fc4f1 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/update-the-height-of-an-element-dynamically.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/update-the-height-of-an-element-dynamically.md
@@ -1,6 +1,6 @@
---
id: 587d7fa8367417b2b2512bc9
-title: Update the Height of an Element Dynamically
+title: Atualizar a altura de um elemento dinamicamente
challengeType: 6
forumTopicId: 301493
dashedName: update-the-height-of-an-element-dynamically
@@ -8,13 +8,13 @@ dashedName: update-the-height-of-an-element-dynamically
# --description--
-The previous challenges covered how to display data from an array and how to add CSS classes. You can combine these lessons to create a simple bar chart. There are two steps to this:
+Os desafios anteriores tratavam da forma como exibir os dados de um array e como adicionar classes do CSS. Você pode combinar essas lições para criar um gráfico de barras simples. Há duas etapas para isso:
-1) Create a `div` for each data point in the array
+1) Crie uma `div` para cada ponto de dados no array
-2) Give each `div` a dynamic height, using a callback function in the `style()` method that sets height equal to the data value
+2) Dê a cada `div` uma altura dinâmica usando uma função de callback no método `style()`, que define a altura igual ao valor de dado
-Recall the format to set a style using a callback function:
+Lembre-se do formato para definir um estilo usando uma função de callback:
```js
selection.style("cssProperty", (d) => d)
@@ -22,59 +22,59 @@ selection.style("cssProperty", (d) => d)
# --instructions--
-Add the `style()` method to the code in the editor to set the `height` property for each element. Use a callback function to return the value of the data point with the string `px` added to it.
+Adicione o método `style()` ao código no editor para definir a propriedade `height` para cada elemento. Use uma função de callback para retornar o valor do ponto de dados com a string `px` adicionada a ele.
# --hints--
-The first `div` should have a `height` of `12` pixels.
+A primeira `div` deve ter uma `height` de `12` pixels.
```js
assert($('div').eq(0)[0].style.height === '12px');
```
-The second `div` should have a `height` of `31` pixels.
+A segunda `div` deve ter uma `height` de `31` pixels.
```js
assert($('div').eq(1)[0].style.height === '31px');
```
-The third `div` should have a `height` of `22` pixels.
+A terceira `div` deve ter uma `height` de `22` pixels.
```js
assert($('div').eq(2)[0].style.height === '22px');
```
-The fourth `div` should have a `height` of `17` pixels.
+A quarta `div` deve ter uma `height` de `17` pixels.
```js
assert($('div').eq(3)[0].style.height === '17px');
```
-The fifth `div` should have a `height` of `25` pixels.
+A quinta `div` deve ter uma `height` de `25` pixels.
```js
assert($('div').eq(4)[0].style.height === '25px');
```
-The sixth `div` should have a `height` of `18` pixels.
+A sexta `div` deve ter uma `height` de `18` pixels.
```js
assert($('div').eq(5)[0].style.height === '18px');
```
-The seventh `div` should have a `height` of `29` pixels.
+A sétima `div` deve ter uma `height` de `29` pixels.
```js
assert($('div').eq(6)[0].style.height === '29px');
```
-The eighth `div` should have a `height` of `14` pixels.
+A oitava `div` deve ter uma `height` de `14` pixels.
```js
assert($('div').eq(7)[0].style.height === '14px');
```
-The ninth `div` should have a `height` of `9` pixels.
+A nona `div` deve ter uma `height` de `9` pixels.
```js
assert($('div').eq(8)[0].style.height === '9px');
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements.md
index e02248743c..e548759436 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements.md
@@ -1,6 +1,6 @@
---
id: 587d7fac367417b2b2512bde
-title: Use a Pre-Defined Scale to Place Elements
+title: Usar uma escala predefinida para definir o local dos elementos
challengeType: 6
forumTopicId: 301494
dashedName: use-a-pre-defined-scale-to-place-elements
@@ -8,32 +8,32 @@ dashedName: use-a-pre-defined-scale-to-place-elements
# --description--
-With the scales set up, it's time to map the scatter plot again. The scales are like processing functions that turn the `x` and `y` raw data into values that fit and render correctly on the SVG canvas. They keep the data within the screen's plotting area.
+Com as escalas configuradas, é hora de mapear novamente o diagrama de dispersão. As escalas são como funções de processamento que transformam os valores `x` e `y` dos dados brutos em valores que se ajustem e que sejam renderizados corretamente no canvas do SVG. Eles mantêm os dados dentro da área de plotagem da tela.
-You set the coordinate attribute values for an SVG shape with the scaling function. This includes `x` and `y` attributes for `rect` or `text` elements, or `cx` and `cy` for `circles`. Here's an example:
+Você define os valores dos atributos das coordenadas para uma forma do SVG com a função de dimensionamento. Isso inclui os atributos `x` e `y` para `rect`, elementos `text`, ou `cx` e `cy` para `circles`. Exemplo:
```js
shape
.attr("x", (d) => xScale(d[0]))
```
-Scales set shape coordinate attributes to place the data points onto the SVG canvas. You don't need to apply scales when you display the actual data value, for example, in the `text()` method for a tooltip or label.
+As escalas definem atributos de coordenadas de forma a colocar os pontos de dados no canvas do SVG. Você não precisa aplicar as escalas quando exibir o valor real dos dados, por exemplo, no método `text()` para uma dica ou etiqueta.
# --instructions--
-Use `xScale` and `yScale` to position both the `circle` and `text` shapes onto the SVG canvas. For the `circles`, apply the scales to set the `cx` and `cy` attributes. Give them a radius of `5` units, too.
+Use `xScale` e `yScale` para posicionar ambas as formas, `circle` e `text`, no canvas do SVG. Para os `circles`, aplique as escalas para definir os atributos `cx` e `cy`. Dê a elas um raio de `5` unidades, também.
-For the `text` elements, apply the scales to set the `x` and `y` attributes. The labels should be offset to the right of the dots. To do this, add `10` units to the `x` data value before passing it to the `xScale`.
+Para os elementos `text`, aplique as escalas para definir os atributos `x` e `y`. As etiquetas devem ser deslocadas para a direita dos pontos. Para fazer isso, adicione `10` unidades ao valor de `x` dos dados antes de passá-lo para `xScale`.
# --hints--
-Your code should have 10 `circle` elements.
+O código deve ter 10 elementos `circle`.
```js
assert($('circle').length == 10);
```
-The first `circle` element should have a `cx` value of approximately `91` and a `cy` value of approximately `368` after applying the scales. It should also have an `r` value of `5`.
+O primeiro elemento `circle` deve ter um valor de `cx` de aproximadamente `91` e um valor de `cy` de aproximadamente `368` após a aplicação das escalas. Ele também deve ter um valor `r` de `5`.
```js
assert(
@@ -43,7 +43,7 @@ assert(
);
```
-The second `circle` element should have a `cx` value of approximately `159` and a `cy` value of approximately `181` after applying the scales. It should also have an `r` value of `5`.
+O segundo elemento `circle` deve ter um valor de `cx` de aproximadamente `159` e um valor de `cy` de aproximadamente `181` após a aplicação das escalas. Ele também deve ter um valor `r` de `5`.
```js
assert(
@@ -53,7 +53,7 @@ assert(
);
```
-The third `circle` element should have a `cx` value of approximately `340` and a `cy` value of approximately `329` after applying the scales. It should also have an `r` value of `5`.
+O terceiro elemento `circle` deve ter um valor de `cx` de aproximadamente `340` e um valor de `cy` de aproximadamente `329` após a aplicação das escalas. Ele também deve ter um valor `r` de `5`.
```js
assert(
@@ -63,7 +63,7 @@ assert(
);
```
-The fourth `circle` element should have a `cx` value of approximately `131` and a `cy` value of approximately `60` after applying the scales. It should also have an `r` value of `5`.
+O quarto elemento `circle` deve ter um valor de `cx` de aproximadamente `131` e um valor de `cy` de aproximadamente `60` após a aplicação das escalas. Ele também deve ter um valor `r` de `5`.
```js
assert(
@@ -73,7 +73,7 @@ assert(
);
```
-The fifth `circle` element should have a `cx` value of approximately `440` and a `cy` value of approximately `237` after applying the scales. It should also have an `r` value of `5`.
+O quinto elemento `circle` deve ter um valor de `cx` de aproximadamente `440` e um valor de `cy` de aproximadamente `237` após a aplicação das escalas. Ele também deve ter um valor `r` de `5`.
```js
assert(
@@ -83,7 +83,7 @@ assert(
);
```
-The sixth `circle` element should have a `cx` value of approximately `271` and a `cy` value of approximately `306` after applying the scales. It should also have an `r` value of `5`.
+O sexto elemento `circle` deve ter um valor de `cx` de aproximadamente `271` e um valor de `cy` de aproximadamente `306` após a aplicação das escalas. Ele também deve ter um valor `r` de `5`.
```js
assert(
@@ -93,7 +93,7 @@ assert(
);
```
-The seventh `circle` element should have a `cx` value of approximately `361` and a `cy` value of approximately `351` after applying the scales. It should also have an `r` value of `5`.
+O sétimo elemento `circle` deve ter um valor de `cx` de aproximadamente `361` e um valor de `cy` de aproximadamente `351` após a aplicação das escalas. Ele também deve ter um valor `r` de `5`.
```js
assert(
@@ -103,7 +103,7 @@ assert(
);
```
-The eighth `circle` element should have a `cx` value of approximately `261` and a `cy` value of approximately `132` after applying the scales. It should also have an `r` value of `5`.
+O oitavo elemento `circle` deve ter um valor de `cx` de aproximadamente `261` e um valor de `cy` de aproximadamente `132` após a aplicação das escalas. Ele também deve ter um valor `r` de `5`.
```js
assert(
@@ -113,7 +113,7 @@ assert(
);
```
-The ninth `circle` element should have a `cx` value of approximately `131` and a `cy` value of approximately `144` after applying the scales. It should also have an `r` value of `5`.
+O nono elemento `circle` deve ter um valor de `cx` de aproximadamente `131` e um valor de `cy` de aproximadamente `144` após a aplicação das escalas. Ele também deve ter um valor `r` de `5`.
```js
assert(
@@ -123,7 +123,7 @@ assert(
);
```
-The tenth `circle` element should have a `cx` value of approximately `79` and a `cy` value of approximately `326` after applying the scales. It should also have an `r` value of `5`.
+O décimo elemento `circle` deve ter um valor de `cx` de aproximadamente `79` e um valor de `cy` de aproximadamente `326` após a aplicação das escalas. Ele também deve ter um valor `r` de `5`.
```js
assert(
@@ -133,13 +133,13 @@ assert(
);
```
-Your code should have 10 `text` elements.
+O código deve ter 10 elementos `text`.
```js
assert($('text').length == 10);
```
-The first label should have an `x` value of approximately `100` and a `y` value of approximately `368` after applying the scales.
+A primeira etiqueta deve ter um valor de `x` de aproximadamente `100` e um valor de `y` de aproximadamente `368` após aplicar as escalas.
```js
assert(
@@ -148,7 +148,7 @@ assert(
);
```
-The second label should have an `x` value of approximately `168` and a `y` value of approximately `181` after applying the scales.
+A segunda etiqueta deve ter um valor de `x` de aproximadamente `168` e um valor de `y` de aproximadamente `181` após aplicar as escalas.
```js
assert(
@@ -157,7 +157,7 @@ assert(
);
```
-The third label should have an `x` value of approximately `350` and a `y` value of approximately `329` after applying the scales.
+A terceira etiqueta deve ter um valor de `x` de aproximadamente `350` e um valor de `y` de aproximadamente `329` após aplicar as escalas.
```js
assert(
@@ -166,7 +166,7 @@ assert(
);
```
-The fourth label should have an `x` value of approximately `141` and a `y` value of approximately `60` after applying the scales.
+A quarta etiqueta deve ter um valor de `x` de aproximadamente `141` e um valor de `y` de aproximadamente `60` após aplicar as escalas.
```js
assert(
@@ -175,7 +175,7 @@ assert(
);
```
-The fifth label should have an `x` value of approximately `449` and a `y` value of approximately `237` after applying the scales.
+A quinta etiqueta deve ter um valor de `x` de aproximadamente `449` e um valor de `y` de aproximadamente `237` após aplicar as escalas.
```js
assert(
@@ -184,7 +184,7 @@ assert(
);
```
-The sixth label should have an `x` value of approximately `280` and a `y` value of approximately `306` after applying the scales.
+A sexta etiqueta deve ter um valor de `x` de aproximadamente `280` e um valor de `y` de aproximadamente `306` após aplicar as escalas.
```js
assert(
@@ -193,7 +193,7 @@ assert(
);
```
-The seventh label should have an `x` value of approximately `370` and a `y` value of approximately `351` after applying the scales.
+A sétima etiqueta deve ter um valor de `x` de aproximadamente `370` e um valor de `y` de aproximadamente `351` após aplicar as escalas.
```js
assert(
@@ -202,7 +202,7 @@ assert(
);
```
-The eighth label should have an `x` value of approximately `270` and a `y` value of approximately `132` after applying the scales.
+A oitava etiqueta deve ter um valor de `x` de aproximadamente `270` e um valor de `y` de aproximadamente `132` após aplicar as escalas.
```js
assert(
@@ -211,7 +211,7 @@ assert(
);
```
-The ninth label should have an `x` value of approximately `140` and a `y` value of approximately `144` after applying the scales.
+A nona etiqueta deve ter um valor de `x` de aproximadamente `140` e um valor de `y` de aproximadamente `144` após aplicar as escalas.
```js
assert(
@@ -220,7 +220,7 @@ assert(
);
```
-The tenth label should have an `x` value of approximately `88` and a `y` value of approximately `326` after applying the scales.
+A décima etiqueta deve ter um valor de `x` de aproximadamente `88` e um valor de `y` de aproximadamente `326` após aplicar as escalas.
```js
assert(
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/use-dynamic-scales.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/use-dynamic-scales.md
index 92889986bd..7437099651 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/use-dynamic-scales.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/use-dynamic-scales.md
@@ -1,6 +1,6 @@
---
id: 587d7fac367417b2b2512bdd
-title: Use Dynamic Scales
+title: Usar escalas dinâmicas
challengeType: 6
forumTopicId: 301495
dashedName: use-dynamic-scales
@@ -8,13 +8,13 @@ dashedName: use-dynamic-scales
# --description--
-The D3 `min()` and `max()` methods are useful to help set the scale.
+Os métodos `min()` e `max()` do D3 são úteis para definir a escala.
-Given a complex data set, one priority is to set the scale so the visualization fits the SVG container's width and height. You want all the data plotted inside the SVG canvas so it's visible on the web page.
+Dado um conjunto de dados complexos, uma prioridade é definir a escala para que a visualização se encaixe na largura e na altura do contêiner do SVG. Você quer todos os dados plotados dentro do canvas do SVG para que sejam visíveis na página da web.
-The example below sets the x-axis scale for scatter plot data. The `domain()` method passes information to the scale about the raw data values for the plot. The `range()` method gives it information about the actual space on the web page for the visualization.
+O exemplo abaixo define a escala do eixo x para dados do diagrama de dispersão. O método `domain()` passa informações para a escala sobre os valores dos dados brutos para a plotagem. O método `range()` dá a ela informações sobre o espaço real na página da web para a visualização.
-In the example, the domain goes from 0 to the maximum in the set. It uses the `max()` method with a callback function based on the x values in the arrays. The range uses the SVG canvas' width (`w`), but it includes some padding, too. This puts space between the scatter plot dots and the edge of the SVG canvas.
+No exemplo, o domínio vai de 0 ao valor máximo do conjunto. Ele usa o método `max()` com uma função de callback baseada nos valores de x nos arrays. A imagem (range) usa a largura do canvas do SVG (`w`), mas também inclui algum preenchimento. Isso coloca o espaço entre os pontos do diagrama de dispersão e a borda do canvas do SVG.
```js
const dataset = [
@@ -38,29 +38,29 @@ const xScale = d3.scaleLinear()
.range([padding, w - padding]);
```
-The padding may be confusing at first. Picture the x-axis as a horizontal line from 0 to 500 (the width value for the SVG canvas). Including the padding in the `range()` method forces the plot to start at 30 along that line (instead of 0), and end at 470 (instead of 500).
+O preenchimento pode ser confuso no começo. Imagine o eixo x como uma linha horizontal de 0 a 500 (o valor de largura para o canvas do SVG). Incluir o preenchimento no método `range()` força o gráfico a começar de 30 ao longo dessa linha (em vez de 0) e terminar em 470 (em vez de 500).
# --instructions--
-Use the `yScale` variable to create a linear y-axis scale. The domain should start at zero and go to the maximum `y` value in the set. The range should use the SVG height (`h`) and include padding.
+Use a variável `yScale` para criar uma escala linear no eixo y. O domínio deve começar em zero e ir até o valor de `y` máximo no conjunto. A imagem (range) deve usar a altura do SVG (`h`) e incluir o preenchimento.
-**Note:** Remember to keep the plot right-side-up. When you set the range for the y coordinates, the higher value (height minus padding) is the first argument, and the lower value is the second argument.
+**Observação:** lembre-se de manter o gráfico na posição correta. Quando você define a imagem como as coordenadas y, o valor maior (altura menos o preenchimento) é o primeiro argumento, enquanto o valor menor é o segundo argumento.
# --hints--
-The text in the `h2` should be `30`.
+O texto no `h2` deve ser `30`.
```js
assert(output == 30 && $('h2').text() == '30');
```
-The `domain()` of yScale should be equivalent to `[0, 411]`.
+O `domain()` de yScale deve ser equivalente a `[0, 411]`.
```js
assert(JSON.stringify(yScale.domain()) == JSON.stringify([0, 411]));
```
-The `range()` of yScale should be equivalent to `[470, 30]`.
+O `range()` de yScale deve ser equivalente a `[470, 30]`.
```js
assert(JSON.stringify(yScale.range()) == JSON.stringify([470, 30]));
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/use-the-d3.max-and-d3.min-functions-to-find-minimum-and-maximum-values-in-a-dataset.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/use-the-d3.max-and-d3.min-functions-to-find-minimum-and-maximum-values-in-a-dataset.md
index 7736dd35ef..c18efcab60 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/use-the-d3.max-and-d3.min-functions-to-find-minimum-and-maximum-values-in-a-dataset.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/use-the-d3.max-and-d3.min-functions-to-find-minimum-and-maximum-values-in-a-dataset.md
@@ -1,7 +1,7 @@
---
id: 587d7fac367417b2b2512bdc
title: >-
- Use the d3.max and d3.min Functions to Find Minimum and Maximum Values in a Dataset
+ Usar as funções d3.max e d3.min para encontrar valores mínimos e máximos em um conjunto de dados
challengeType: 6
forumTopicId: 301496
dashedName: >-
@@ -10,11 +10,11 @@ dashedName: >-
# --description--
-The D3 methods `domain()` and `range()` set that information for your scale based on the data. There are a couple methods to make that easier.
+Os métodos `domain()` e `range()` do D3 definem essas informações para sua escala com base nos dados. Existem alguns métodos que tornam isso mais fácil.
-Often when you set the domain, you'll want to use the minimum and maximum values within the data set. Trying to find these values manually, especially in a large data set, may cause errors.
+Muitas vezes, quando você define o domínio, vai querer usar os valores mínimo e máximo dentro do conjunto de dados. Tentar encontrar esses valores manualmente, especialmente em um conjunto grande de dados, pode causar erros.
-D3 has two methods - `min()` and `max()` to return this information. Here's an example:
+O D3 tem dois métodos - `min()` e `max()` - para retornar essa informação. Exemplo:
```js
const exampleData = [34, 234, 73, 90, 6, 52];
@@ -22,28 +22,28 @@ d3.min(exampleData)
d3.max(exampleData)
```
-A dataset may have nested arrays, like the `[x, y]` coordinate pairs that were in the scatter plot example. In that case, you need to tell D3 how to calculate the maximum and minimum. Fortunately, both the `min()` and `max()` methods take a callback function. In this example, the callback function's argument `d` is for the current inner array. The callback needs to return the element from the inner array (the `x` or `y` value) over which you want to compute the maximum or minimum. Here's an example for how to find the min and max values with an array of arrays:
+Um conjunto de dados pode ter arrays aninhados, como os pares de coordenadas `[x, y]` que estavam no diagrama de dispersão do exemplo. Nesse caso, você precisa dizer ao D3 como calcular o máximo e o mínimo. Felizmente, ambos os métodos `min()` e `max()` têm uma função de callback. Neste exemplo, o argumento da função de callback `d` é para o array interno atual. A função de callback precisa retornar o elemento do array interno (o valor `x` ou `y`) sobre o qual você deseja calcular o máximo ou o mínimo. Aqui vemos um exemplo de como encontrar os valores mínimo e máximo em um array de arrays:
```js
const locationData = [[1, 7],[6, 3],[8, 3]];
const minX = d3.min(locationData, (d) => d[0]);
```
-`minX` would have the value `1`.
+`minX` teria o valor `1`.
# --instructions--
-The `positionData` array holds sub arrays of x, y, and z coordinates. Use a D3 method to find the maximum value of the z coordinate (the third value) from the arrays and save it in the `output` variable.
+O array `positionData` contém subarrays das coordenadas x, y e z. Use um método do D3 para encontrar o valor máximo da coordenada z (o terceiro valor) entre os arrays e salvá-lo na variável `output`.
# --hints--
-The text in the `h2` should be `8`.
+O texto no `h2` deve ser `8`.
```js
assert(output == 8 && $('h2').text() == '8');
```
-Your code should use the `max()` method.
+O código deve usar o método `max()`.
```js
assert(
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/work-with-data-in-d3.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/work-with-data-in-d3.md
index bcf31464ca..a0a2d31c53 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/work-with-data-in-d3.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/work-with-data-in-d3.md
@@ -1,6 +1,6 @@
---
id: 587d7fa7367417b2b2512bc4
-title: Work with Data in D3
+title: Trabalhar com dados no D3
challengeType: 6
forumTopicId: 301497
dashedName: work-with-data-in-d3
@@ -8,15 +8,15 @@ dashedName: work-with-data-in-d3
# --description--
-The D3 library focuses on a data-driven approach. When you have a set of data, you can apply D3 methods to display it on the page. Data comes in many formats, but this challenge uses a simple array of numbers.
+A biblioteca D3 concentra-se numa abordagem baseada em dados. Quando você tem um conjunto de dados, você pode aplicar os métodos do D3 para exibi-los na página. Os dados vêm em vários formatos, mas este desafio usa um arrays simples de números.
-The first step is to make D3 aware of the data. The `data()` method is used on a selection of DOM elements to attach the data to those elements. The data set is passed as an argument to the method.
+O primeiro passo é sensibilizar o D3 para os dados. O método `data()` é usado em uma seleção de elementos do DOM para anexar os dados a esses elementos. O conjunto de dados é passado como um argumento ao método.
-A common workflow pattern is to create a new element in the document for each piece of data in the set. D3 has the `enter()` method for this purpose.
+Um padrão comum de fluxo de trabalho é criar um novo elemento no documento para cada parte dos dados no conjunto. O D3 tem o método `enter()` para esse propósito.
-When `enter()` is combined with the `data()` method, it looks at the selected elements from the page and compares them to the number of data items in the set. If there are fewer elements than data items, it creates the missing elements.
+Quando `enter()` é combinado com o método `data()`, ele olha para os elementos selecionados da página e os compara com o número de itens de dados no conjunto. Se houver menos elementos do que itens de dados, ele criará os elementos que faltam.
-Here is an example that selects a `ul` element and creates a new list item based on the number of entries in the array:
+Aqui está um exemplo que seleciona um elemento `ul` e cria um novo item de lista baseado no número de entradas no array:
```html
@@ -32,21 +32,21 @@ Here is an example that selects a `ul` element and creates a new list item based
```
-It may seem confusing to select elements that don't exist yet. This code is telling D3 to first select the `ul` on the page. Next, select all list items, which returns an empty selection. Then the `data()` method reviews the dataset and runs the following code three times, once for each item in the array. The `enter()` method sees there are no `li` elements on the page, but it needs 3 (one for each piece of data in `dataset`). New `li` elements are appended to the `ul` and have the text `New item`.
+Pode parecer confuso selecionar elementos que ainda não existem. Este código está dizendo para o D3 selecionar primeiro o `ul` na página. Em seguida, selecionar todos os itens da lista, o que retorna uma seleção vazia. Então, o método `data()` revisa o conjunto de dados e executa o código a seguir três vezes, uma vez para cada item do array. O método `enter()` vê que não há elementos `li` na página, mas precisa de 3 (um para cada dado no `dataset`). Novos elementos `li` são anexados ao `ul` e têm o texto `New item`.
# --instructions--
-Select the `body` node, then select all `h2` elements. Have D3 create and append an `h2` tag for each item in the `dataset` array. The text in the `h2` should say `New Title`. Your code should use the `data()` and `enter()` methods.
+Selecione o nó de `body` e todos os elementos `h2`. Faça com que o D3 crie e anexe uma tag `h2` para cada item no array do `dataset`. O texto no `h2` deve dizer `New Title`. O código deve usar os métodos `data()` e `enter()`.
# --hints--
-Your document should have 9 `h2` elements.
+O documento deve ter 9 elementos `h2`.
```js
assert($('h2').length == 9);
```
-The text in the `h2` elements should say `New Title`. The capitalization and spacing should match exactly.
+O texto no `h2` deve dizer `New Title`. A capitalização e o espaçamento devem coincidir com exatidão.
```js
assert(
@@ -56,13 +56,13 @@ assert(
);
```
-Your code should use the `data()` method.
+O código deve usar o método `data()`.
```js
assert(code.match(/\.data/g));
```
-Your code should use the `enter()` method.
+O código deve usar o método `enter()`.
```js
assert(code.match(/\.enter/g));
diff --git a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/work-with-dynamic-data-in-d3.md b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/work-with-dynamic-data-in-d3.md
index 3b4a59ff1f..3d78cc6f77 100644
--- a/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/work-with-dynamic-data-in-d3.md
+++ b/curriculum/challenges/portuguese/04-data-visualization/data-visualization-with-d3/work-with-dynamic-data-in-d3.md
@@ -1,6 +1,6 @@
---
id: 587d7fa7367417b2b2512bc5
-title: Work with Dynamic Data in D3
+title: Trabalhar com dados dinâmicos no D3
challengeType: 6
forumTopicId: 301498
dashedName: work-with-dynamic-data-in-d3
@@ -8,75 +8,75 @@ dashedName: work-with-dynamic-data-in-d3
# --description--
-The last two challenges cover the basics of displaying data dynamically with D3 using the `data()` and `enter()` methods. These methods take a data set and, together with the `append()` method, create a new DOM element for each entry in the data set.
+Os dois últimos desafios cobrem o básico da exibição de dados dinamicamente com o D3 usando os métodos `data()` e `enter()`. Esses métodos requerem um conjunto de dados e, junto com o método `append()`, criam um novo elemento do DOM para cada entrada no conjunto de dados.
-In the previous challenge, you created a new `h2` element for each item in the `dataset` array, but they all contained the same text, `New Title`. This is because you have not made use of the data that is bound to each of the `h2` elements.
+No desafio anterior, você criou um novo elemento `h2` para cada item no array do `dataset`, mas todos continham o mesmo texto, `New Title`. Isso ocorreu porque você ainda não utilizou os dados que estão associados a cada um dos elementos `h2`.
-The D3 `text()` method can take a string or a callback function as an argument:
+O método `text()` do D3 pode receber uma string ou uma função de callback como um argumento:
```js
selection.text((d) => d)
```
-In the example above, the parameter `d` refers to a single entry in the dataset that a selection is bound to.
+No exemplo acima, o parâmetro `d` se refere a uma única entrada no conjunto de dados a qual uma seleção está vinculada.
-Using the current example as context, the first `h2` element is bound to 12, the second `h2` element is bound to 31, the third `h2` element is bound to 22, and so on.
+Usando o exemplo atual como contexto, o primeiro elemento `h2` está ligado a 12, o segundo elemento `h2` está ligado a 31, o terceiro elemento `h2` está ligado a 22 e assim por diante.
# --instructions--
-Change the `text()` method so that each `h2` element displays the corresponding value from the `dataset` array with a single space and the string `USD`. For example, the first heading should be `12 USD`.
+Altere o método `text()` para que cada elemento `h2` exiba o valor correspondente do array do `dataset` com um único espaço e a string `USD`. Por exemplo, o primeiro título deve ser `12 USD`.
# --hints--
-The first `h2` should have the text `12 USD`.
+O primeiro `h2` deve ter o texto `12 USD`.
```js
assert($('h2').eq(0).text() == '12 USD');
```
-The second `h2` should have the text `31 USD`.
+O segundo `h2` deve ter o texto `31 USD`.
```js
assert($('h2').eq(1).text() == '31 USD');
```
-The third `h2` should have the text `22 USD`.
+O terceiro `h2` deve ter o texto `22 USD`.
```js
assert($('h2').eq(2).text() == '22 USD');
```
-The fourth `h2` should have the text `17 USD`.
+O quarto `h2` deve ter o texto `17 USD`.
```js
assert($('h2').eq(3).text() == '17 USD');
```
-The fifth `h2` should have the text `25 USD`.
+O quinto `h2` deve ter o texto `25 USD`.
```js
assert($('h2').eq(4).text() == '25 USD');
```
-The sixth `h2` should have the text `18 USD`.
+O sexto `h2` deve ter o texto `18 USD`.
```js
assert($('h2').eq(5).text() == '18 USD');
```
-The seventh `h2` should have the text `29 USD`.
+O sétimo `h2` deve ter o texto `29 USD`.
```js
assert($('h2').eq(6).text() == '29 USD');
```
-The eighth `h2` should have the text `14 USD`.
+O oitavo `h2` deve ter o texto `14 USD`.
```js
assert($('h2').eq(7).text() == '14 USD');
```
-The ninth `h2` should have the text `9 USD`.
+O nono `h2` deve ter o texto `9 USD`.
```js
assert($('h2').eq(8).text() == '9 USD');
diff --git a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/data-cleaning-with-dataframes.md b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/data-cleaning-with-dataframes.md
index 887af41702..8785e7ede5 100644
--- a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/data-cleaning-with-dataframes.md
+++ b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/data-cleaning-with-dataframes.md
@@ -1,6 +1,6 @@
---
id: 5e9a093a74c4063ca6f7c15e
-title: Data Cleaning with DataFrames
+title: Limpar os dados com DataFrames
challengeType: 11
videoId: sTMN_pdI6S0
dashedName: data-cleaning-with-dataframes
@@ -8,18 +8,18 @@ dashedName: data-cleaning-with-dataframes
# --description--
-*Instead of using notebooks.ai like it shows in the video, you can use Google Colab instead.*
+*Ao invés de usar notebooks.ai como foi mostrado no vídeo, você pode usar o Google Colab como substituto.*
-More resources:
+Mais recursos:
-- [Notebooks on GitHub](https://github.com/ine-rmotr-curriculum/data-cleaning-rmotr-freecodecamp)
-- [How to open Notebooks from GitHub using Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
+- [Notebooks no GitHub](https://github.com/ine-rmotr-curriculum/data-cleaning-rmotr-freecodecamp)
+- [Como abrir notebooks do GitHub usando o Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
# --question--
## --text--
-What will the following code print out?
+O que será impresso pelo código a seguir?
```py
import pandas as pd
diff --git a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/introduction-to-data-analysis.md b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/introduction-to-data-analysis.md
index a907b1568d..ce55b031a2 100644
--- a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/introduction-to-data-analysis.md
+++ b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/introduction-to-data-analysis.md
@@ -1,6 +1,6 @@
---
id: 5e9a093a74c4063ca6f7c14c
-title: Introduction to Data Analysis
+title: Introduzir a análise de dados
challengeType: 11
videoId: VJrP2FUzKP0
dashedName: introduction-to-data-analysis
@@ -8,7 +8,7 @@ dashedName: introduction-to-data-analysis
# --description--
-More resources:
+Mais recursos:
\- [Slides](https://docs.google.com/presentation/d/1cUIt8b2ySz-85_ykfeuuWsurccwTAuFPn782pZBzFsU/edit?usp=sharing)
@@ -16,23 +16,23 @@ More resources:
## --text--
-Which of the following is **not** part of Data Analysis?
+Qual das seguintes etapas **não** é parte da análise de dados?
## --answers--
-Building statistical models and data visualizations.
+Construir modelos estatísticos e visualizações de dados.
---
-Picking a desired conclusion for the analysis.
+Escolher uma conclusão desejada para a análise.
---
-Fixing incorrect values and removing invalid data.
+Corrigir valores incorretos e remover dados inválidos.
---
-Transforming data into an appropriate data structure.
+Transformar dados em uma estrutura de dados apropriada.
## --video-solution--
diff --git a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-algebra-and-size.md b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-algebra-and-size.md
index 454f7c5646..deb9a1ba2b 100644
--- a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-algebra-and-size.md
+++ b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-algebra-and-size.md
@@ -1,6 +1,6 @@
---
id: 5e9a093a74c4063ca6f7c157
-title: Numpy Algebra and Size
+title: Utilizar álgebra no NumPy e tamanho
challengeType: 11
videoId: XAT97YLOKD8
dashedName: numpy-algebra-and-size
@@ -8,34 +8,34 @@ dashedName: numpy-algebra-and-size
# --description--
-*Instead of using notebooks.ai like it shows in the video, you can use Google Colab instead.*
+*Ao invés de usar notebooks.ai como foi mostrado no vídeo, você pode usar o Google Colab como substituto.*
-More resources:
+Mais recursos:
-- [Notebooks on GitHub](https://github.com/ine-rmotr-curriculum/freecodecamp-intro-to-numpy)
-- [How to open Notebooks from GitHub using Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
+- [Notebooks no GitHub](https://github.com/ine-rmotr-curriculum/freecodecamp-intro-to-numpy)
+- [Como abrir notebooks do GitHub usando o Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
# --question--
## --text--
-What is the relationship between size of objects (such as lists and datatypes) in memory in Python's standard library and the NumPy library? Knowing this, what are the implications for performance?
+Qual é a relação entre o tamanho dos objetos (como listas e datatypes) na memória na biblioteca padrão do Python e na biblioteca do NumPy? Sabendo isto, quais são as implicações para o desempenho?
## --answers--
-Standard Python objects take up much more memory to store than NumPy objects; operations on comparable standard Python and NumPy objects complete in roughly the same time.
+Objetos Python padrão ocupam muito mais memória para armazenar que objetos do NumPy. Operações em objetos padrão comparáveis do Python e do NumPy são concluídas aproximadamente ao mesmo tempo.
---
-NumPy objects take up much more memory than standard Python objects; operations on NumPy objects complete very quickly compared to comparable objects in standard Python.
+Objetos do NumPy ocupam muito mais memória do que os objetos Python padrão. Operações nos objetos do NumPy são concluídas muito rapidamente em comparação a objetos comparáveis no Python padrão.
---
-NumPy objects take up much less memory than Standard Python objects; operations on Standard Python objects complete very quickly compared to comparable objects on NumPy Object.
+Objetos do NumPy ocupam muito menos memória do que os objetos Python padrão. Operações nos objetos do Python são concluídas muito rapidamente em comparação a objetos comparáveis no NumPy.
---
-Standard Python objects take up more memory than NumPy objects; operations on NumPy objects complete very quickly compared to comparable objects in standard Python.
+Objetos do Python padrão ocupam muito mais memória do que os objetos NumPy. Operações nos objetos do NumPy são concluídas muito rapidamente em comparação a objetos comparáveis no Python padrão.
## --video-solution--
diff --git a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-arrays.md b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-arrays.md
index b5504e836e..74d6845a60 100644
--- a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-arrays.md
+++ b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-arrays.md
@@ -1,6 +1,6 @@
---
id: 5e9a093a74c4063ca6f7c154
-title: Numpy Arrays
+title: Conhecer os arrays do NumPy
challengeType: 11
videoId: VDYVFHBL1AM
dashedName: numpy-arrays
@@ -8,18 +8,18 @@ dashedName: numpy-arrays
# --description--
-*Instead of using notebooks.ai like it shows in the video, you can use Google Colab instead.*
+*Ao invés de usar notebooks.ai como foi mostrado no vídeo, você pode usar o Google Colab como substituto.*
-More resources:
+Mais recursos:
-- [Notebooks on GitHub](https://github.com/ine-rmotr-curriculum/freecodecamp-intro-to-numpy)
-- [How to open Notebooks from GitHub using Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
+- [Notebooks no GitHub](https://github.com/ine-rmotr-curriculum/freecodecamp-intro-to-numpy)
+- [Como abrir notebooks do GitHub usando o Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
# --question--
## --text--
-What will the following code print out?
+O que será impresso pelo código a seguir?
```py
A = np.array([
diff --git a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-boolean-arrays.md b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-boolean-arrays.md
index f271dff4b0..3a124d5a17 100644
--- a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-boolean-arrays.md
+++ b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-boolean-arrays.md
@@ -1,6 +1,6 @@
---
id: 5e9a093a74c4063ca6f7c156
-title: Numpy Boolean Arrays
+title: Conhecer os arrays booleanos do NumPy
challengeType: 11
videoId: N1ttsMmcVMM
dashedName: numpy-boolean-arrays
@@ -8,18 +8,18 @@ dashedName: numpy-boolean-arrays
# --description--
-*Instead of using notebooks.ai like it shows in the video, you can use Google Colab instead.*
+*Ao invés de usar notebooks.ai como foi mostrado no vídeo, você pode usar o Google Colab como substituto.*
-More resources:
+Mais recursos:
-- [Notebooks on GitHub](https://github.com/ine-rmotr-curriculum/freecodecamp-intro-to-numpy)
-- [How to open Notebooks from GitHub using Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
+- [Notebooks no GitHub](https://github.com/ine-rmotr-curriculum/freecodecamp-intro-to-numpy)
+- [Como abrir notebooks do GitHub usando o Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
# --question--
## --text--
-What will the following code print out?
+O que será impresso pelo código a seguir?
```py
a = np.arange(5)
diff --git a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-introduction-a.md b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-introduction-a.md
index fc38697f40..ef90feccf7 100644
--- a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-introduction-a.md
+++ b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-introduction-a.md
@@ -1,6 +1,6 @@
---
id: 5e9a093a74c4063ca6f7c152
-title: Numpy Introduction A
+title: Introdução ao NumPy A
challengeType: 11
videoId: P-JjV6GBCmk
dashedName: numpy-introduction-a
@@ -8,30 +8,30 @@ dashedName: numpy-introduction-a
# --description--
-*Instead of using notebooks.ai like it shows in the video, you can use Google Colab instead.*
+*Ao invés de usar notebooks.ai como foi mostrado no vídeo, você pode usar o Google Colab como substituto.*
-More resources:
+Mais recursos:
-- [Notebooks on GitHub](https://github.com/ine-rmotr-curriculum/freecodecamp-intro-to-numpy)
-- [How to open Notebooks from GitHub using Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
+- [Notebooks no GitHub](https://github.com/ine-rmotr-curriculum/freecodecamp-intro-to-numpy)
+- [Como abrir notebooks do GitHub usando o Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
# --question--
## --text--
-Why is Numpy an important, but unpopular Python library?
+Por que o NumPy é uma biblioteca importante do Python mas não é popular?
## --answers--
-Often you won't work directly with Numpy.
+Muitas vezes, você não trabalhará diretamente com o NumPy.
---
-It is extremely slow.
+Ele é extremamente lento.
---
-Working with Numpy is difficult.
+Trabalhar com o NumPy é difícil.
## --video-solution--
diff --git a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-introduction-b.md b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-introduction-b.md
index a863e42074..2db1b53122 100644
--- a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-introduction-b.md
+++ b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/numpy-introduction-b.md
@@ -1,6 +1,6 @@
---
id: 5e9a093a74c4063ca6f7c153
-title: Numpy Introduction B
+title: Introdução ao NumPy B
challengeType: 11
videoId: YIqgrNLAZkA
dashedName: numpy-introduction-b
@@ -8,18 +8,18 @@ dashedName: numpy-introduction-b
# --description--
-*Instead of using notebooks.ai like it shows in the video, you can use Google Colab instead.*
+*Ao invés de usar notebooks.ai como foi mostrado no vídeo, você pode usar o Google Colab como substituto.*
-More resources:
+Mais recursos:
-- [Notebooks on GitHub](https://github.com/ine-rmotr-curriculum/freecodecamp-intro-to-numpy)
-- [How to open Notebooks from GitHub using Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
+- [Notebooks no GitHub](https://github.com/ine-rmotr-curriculum/freecodecamp-intro-to-numpy)
+- [Como abrir notebooks do GitHub usando o Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
# --question--
## --text--
-About how much memory does the integer `5` consume in plain Python?
+Quanta memória o inteiro `5` consome em Python puro, aproximadamente?
## --answers--
diff --git a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/pandas-conditional-selection-and-modifying-dataframes.md b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/pandas-conditional-selection-and-modifying-dataframes.md
index 3d17a73a55..6d3cd505dc 100644
--- a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/pandas-conditional-selection-and-modifying-dataframes.md
+++ b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/pandas-conditional-selection-and-modifying-dataframes.md
@@ -1,6 +1,6 @@
---
id: 5e9a093a74c4063ca6f7c15b
-title: Pandas Conditional Selection and Modifying DataFrames
+title: Selecionar com condições no Pandas e modificar DataFrames
challengeType: 11
videoId: BFlH0fN5xRQ
dashedName: pandas-conditional-selection-and-modifying-dataframes
@@ -8,18 +8,18 @@ dashedName: pandas-conditional-selection-and-modifying-dataframes
# --description--
-*Instead of using notebooks.ai like it shows in the video, you can use Google Colab instead.*
+*Ao invés de usar notebooks.ai como foi mostrado no vídeo, você pode usar o Google Colab como substituto.*
-More resources:
+Mais recursos:
-- [Notebooks on GitHub](https://github.com/ine-rmotr-curriculum/freecodecamp-intro-to-pandas)
-- [How to open Notebooks from GitHub using Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
+- [Notebooks no GitHub](https://github.com/ine-rmotr-curriculum/freecodecamp-intro-to-pandas)
+- [Como abrir notebooks do GitHub usando o Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
# --question--
## --text--
-What will the following code print out?
+O que será impresso pelo código a seguir?
```py
import pandas as pd
diff --git a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/pandas-creating-columns.md b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/pandas-creating-columns.md
index 7d20f76c4a..a47004441d 100644
--- a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/pandas-creating-columns.md
+++ b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/pandas-creating-columns.md
@@ -1,6 +1,6 @@
---
id: 5e9a093a74c4063ca6f7c15c
-title: Pandas Creating Columns
+title: Criar colunas com o Pandas
challengeType: 11
videoId: _sSo2XZoB3E
dashedName: pandas-creating-columns
@@ -8,24 +8,24 @@ dashedName: pandas-creating-columns
# --description--
-*Instead of using notebooks.ai like it shows in the video, you can use Google Colab instead.*
+*Ao invés de usar notebooks.ai como foi mostrado no vídeo, você pode usar o Google Colab como substituto.*
-More resources:
+Mais recursos:
-- [Notebooks on GitHub](https://github.com/ine-rmotr-curriculum/freecodecamp-intro-to-pandas)
-- [How to open Notebooks from GitHub using Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
+- [Notebooks no GitHub](https://github.com/ine-rmotr-curriculum/freecodecamp-intro-to-pandas)
+- [Como abrir notebooks do GitHub usando o Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
# --question--
## --text--
-What code would add a "Certificates per month" column to the `certificates_earned` DataFrame like the one below?
+Qual código adicionaria uma coluna "Certificates per month" ao DataFrame `certificates_earned` como este abaixo?
- Certificates Time (in months) Certificates per month
-Tom 8 16 0.50
-Kris 2 5 0.40
-Ahmad 5 9 0.56
-Beau 6 12 0.50
+ Certificates Time (in months) Longest streak
+Tom 8 16 13
+Kris 2 5 11
+Ahmad 5 9 9
+Beau 6 12 7
## --answers--
diff --git a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/pandas-indexing-and-conditional-selection.md b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/pandas-indexing-and-conditional-selection.md
index 1107f217f4..52153af461 100644
--- a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/pandas-indexing-and-conditional-selection.md
+++ b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/pandas-indexing-and-conditional-selection.md
@@ -1,6 +1,6 @@
---
id: 5e9a093a74c4063ca6f7c159
-title: Pandas Indexing and Conditional Selection
+title: Indexar no Pandas e selecionar de modo condicional
challengeType: 11
videoId: '-ZOrgV_aA9A'
dashedName: pandas-indexing-and-conditional-selection
@@ -8,18 +8,18 @@ dashedName: pandas-indexing-and-conditional-selection
# --description--
-*Instead of using notebooks.ai like it shows in the video, you can use Google Colab instead.*
+*Ao invés de usar notebooks.ai como foi mostrado no vídeo, você pode usar o Google Colab como substituto.*
-More resources:
+Mais recursos:
-- [Notebooks on GitHub](https://github.com/ine-rmotr-curriculum/freecodecamp-intro-to-pandas)
-- [How to open Notebooks from GitHub using Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
+- [Notebooks no GitHub](https://github.com/ine-rmotr-curriculum/freecodecamp-intro-to-pandas)
+- [Como abrir notebooks do GitHub usando o Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
# --question--
## --text--
-What will the following code print out?
+O que será impresso pelo código a seguir?
```py
import pandas as pd
diff --git a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/reading-data-csv-and-txt.md b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/reading-data-csv-and-txt.md
index 442d815a51..b89718d9c0 100644
--- a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/reading-data-csv-and-txt.md
+++ b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/reading-data-csv-and-txt.md
@@ -1,6 +1,6 @@
---
id: 5e9a093a74c4063ca6f7c162
-title: Reading Data CSV and TXT
+title: Ler dados de CSV e TXT
challengeType: 11
videoId: ViGEv0zOzUk
dashedName: reading-data-csv-and-txt
@@ -8,18 +8,18 @@ dashedName: reading-data-csv-and-txt
# --description--
-*Instead of using notebooks.ai like it shows in the video, you can use Google Colab instead.*
+*Ao invés de usar notebooks.ai como foi mostrado no vídeo, você pode usar o Google Colab como substituto.*
-More resources:
+Mais recursos:
-- [Notebooks on GitHub](https://github.com/ine-rmotr-curriculum/RDP-Reading-Data-with-Python-and-Pandas/tree/master/unit-1-reading-data-with-python-and-pandas/lesson-1-reading-csv-and-txt-files/files)
-- [How to open Notebooks from GitHub using Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
+- [Notebooks no GitHub](https://github.com/ine-rmotr-curriculum/RDP-Reading-Data-with-Python-and-Pandas/tree/master/unit-1-reading-data-with-python-and-pandas/lesson-1-reading-csv-and-txt-files/files)
+- [Como abrir notebooks do GitHub usando o Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
# --question--
## --text--
-How would you import the CSV file `data.csv` and store it in a DataFrame using the Pandas module?
+Como você importaria o arquivo CSV `data.csv` e o armazenaria em um DataFrame usando o módulo Pandas?
## --answers--
diff --git a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/reading-data-from-databases.md b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/reading-data-from-databases.md
index 9a6275ac38..668aa9d4f3 100644
--- a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/reading-data-from-databases.md
+++ b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-course/reading-data-from-databases.md
@@ -1,6 +1,6 @@
---
id: 5e9a093a74c4063ca6f7c163
-title: Reading Data from Databases
+title: Ler dados do banco de dados
challengeType: 11
videoId: MtgXS1MofRw
dashedName: reading-data-from-databases
@@ -8,30 +8,30 @@ dashedName: reading-data-from-databases
# --description--
-*Instead of using notebooks.ai like it shows in the video, you can use Google Colab instead.*
+*Ao invés de usar notebooks.ai como foi mostrado no vídeo, você pode usar o Google Colab como substituto.*
-More resources:
+Mais recursos:
-- [Notebooks on GitHub](https://github.com/ine-rmotr-curriculum/RDP-Reading-Data-with-Python-and-Pandas/tree/master/unit-1-reading-data-with-python-and-pandas/lesson-11-reading-data-from-relational-databases/files)
-- [How to open Notebooks from GitHub using Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
+- [Notebooks no GitHub](https://github.com/ine-rmotr-curriculum/RDP-Reading-Data-with-Python-and-Pandas/tree/master/unit-1-reading-data-with-python-and-pandas/lesson-11-reading-data-from-relational-databases/files)
+- [Como abrir notebooks do GitHub usando o Google Colab.](https://colab.research.google.com/github/googlecolab/colabtools/blob/master/notebooks/colab-github-demo.ipynb)
# --question--
## --text--
-What method does a `Cursor` instance have and what does it allow?
+Qual método uma instância de `Cursor` tem e o que esse método permite?
## --answers--
-The `Cursor` instance has a `.run()` method which allows you to run SQL queries.
+A instância de `Cursor` tem um método `.run()` que permite que você execute consultas SQL.
---
-The `Cursor` instance has a `.select()` method which allows you to select records.
+A instância de `Cursor` tem um método `.select()` que permite que você selecione registros.
---
-The `Cursor` instance has an `.execute()` method which will receive SQL parameters to run against the database.
+A instância de `Cursor` tem um método `.execute()`, que receberá parâmetros de SQL para serem executados no banco de dados.
## --video-solution--
diff --git a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-projects/page-view-time-series-visualizer.md b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-projects/page-view-time-series-visualizer.md
index f0501c882b..ebdafe6949 100644
--- a/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-projects/page-view-time-series-visualizer.md
+++ b/curriculum/challenges/portuguese/08-data-analysis-with-python/data-analysis-with-python-projects/page-view-time-series-visualizer.md
@@ -1,6 +1,6 @@
---
id: 5e46f802ac417301a38fb92b
-title: Page View Time Series Visualizer
+title: Visualizador de séries temporais de visitas de páginas
challengeType: 10
forumTopicId: 462369
dashedName: page-view-time-series-visualizer
@@ -8,17 +8,17 @@ dashedName: page-view-time-series-visualizer
# --description--
-For this project you will visualize time series data using a line chart, bar chart, and box plots. You will use Pandas, matplotlib, and seaborn to visualize a dataset containing the number of page views each day on the freeCodeCamp.org forum from 2016-05-09 to 2019-12-03. The data visualizations will help you understand the patterns in visits and identify yearly and monthly growth.
+Para este projeto, você vai visualizar dados de série de tempo usando um gráfico de linha, um gráfico de barras e diagramas de caixa. Você usará o Pandas, o matplotlib e o seaborn para visualizar um conjunto de dados contendo o número de visualizações de páginas todos os dias no fórum do freeCodeCamp.org de 09/05/2016 a 03/12/2019. As visualizações de dados ajudarão você a entender os padrões nas visitas e a identificar o crescimento anual e mensal.
-You can access [the full project description and starter code on Replit](https://replit.com/github/freeCodeCamp/boilerplate-page-view-time-series-visualizer).
+Você pode acessar [a descrição completa do projeto e o código inicial no Replit](https://replit.com/github/freeCodeCamp/boilerplate-page-view-time-series-visualizer).
-After going to that link, fork the project. Once you complete the project based on the instructions in 'README.md', submit your project link below.
+Depois de ir para esse link, faça fork no projeto. Depois que você completar o projeto com base nas instruções do 'README.md', envie o link do seu projeto abaixo.
-We are still developing the interactive instructional part of the data analysis with Python curriculum. For now, you will have to use other resources to learn how to pass this challenge.
+Ainda estamos desenvolvendo a parte instrucional interativa do currículo de análise de dados com Python. Por enquanto, você terá que usar outros recursos para aprender a vencer este desafio.
# --hints--
-It should pass all Python tests.
+Ele deve passar em todos os testes do Python.
```js
diff --git a/curriculum/challenges/portuguese/08-data-analysis-with-python/numpy/basics-of-numpy.md b/curriculum/challenges/portuguese/08-data-analysis-with-python/numpy/basics-of-numpy.md
index 57b1924af7..29c3626397 100644
--- a/curriculum/challenges/portuguese/08-data-analysis-with-python/numpy/basics-of-numpy.md
+++ b/curriculum/challenges/portuguese/08-data-analysis-with-python/numpy/basics-of-numpy.md
@@ -1,6 +1,6 @@
---
id: 5e9a0a8e09c5df3cc3600ed3
-title: Basics of Numpy
+title: Começar com o NumPy
challengeType: 11
videoId: f9QrZrKQMLI
dashedName: basics-of-numpy
@@ -10,7 +10,7 @@ dashedName: basics-of-numpy
## --text--
-What will the following code print?
+O que será impresso pelo código a seguir?
```python
b = np.array([[1.0,2.0,3.0],[3.0,4.0,5.0]])
diff --git a/curriculum/challenges/portuguese/08-data-analysis-with-python/numpy/mathematics.md b/curriculum/challenges/portuguese/08-data-analysis-with-python/numpy/mathematics.md
index f3b1a3c111..40d8291aa2 100644
--- a/curriculum/challenges/portuguese/08-data-analysis-with-python/numpy/mathematics.md
+++ b/curriculum/challenges/portuguese/08-data-analysis-with-python/numpy/mathematics.md
@@ -1,6 +1,6 @@
---
id: 5e9a0a8e09c5df3cc3600ed8
-title: Mathematics
+title: Matemática
challengeType: 11
videoId: 7txegvyhtVk
dashedName: mathematics
@@ -10,7 +10,7 @@ dashedName: mathematics
## --text--
-What is the value of `b` after running the following code?
+Qual é o valor de `b` depois de executar o seguinte código?
```py
import numpy as np
diff --git a/curriculum/challenges/portuguese/08-data-analysis-with-python/numpy/reorganizing-arrays.md b/curriculum/challenges/portuguese/08-data-analysis-with-python/numpy/reorganizing-arrays.md
index 7e4903c864..40d6637c47 100644
--- a/curriculum/challenges/portuguese/08-data-analysis-with-python/numpy/reorganizing-arrays.md
+++ b/curriculum/challenges/portuguese/08-data-analysis-with-python/numpy/reorganizing-arrays.md
@@ -1,6 +1,6 @@
---
id: 5e9a0a8e09c5df3cc3600ed9
-title: Reorganizing Arrays
+title: Reorganizar arrays
challengeType: 11
videoId: VNWAQbEM-C8
dashedName: reorganizing-arrays
@@ -10,7 +10,7 @@ dashedName: reorganizing-arrays
## --text--
-What code would produce the following array?
+Qual código produziria o array a seguir?
```py
[[1. 1.]
diff --git a/curriculum/challenges/portuguese/01-responsive-web-design/applied-accessibility/improve-accessibility-of-audio-content-with-the-audio-element.md b/curriculum/challenges/portuguese/01-responsive-web-design/applied-accessibility/improve-accessibility-of-audio-content-with-the-audio-element.md
index bdcc0b68c4..7b8e1f01f5 100644
--- a/curriculum/challenges/portuguese/01-responsive-web-design/applied-accessibility/improve-accessibility-of-audio-content-with-the-audio-element.md
+++ b/curriculum/challenges/portuguese/01-responsive-web-design/applied-accessibility/improve-accessibility-of-audio-content-with-the-audio-element.md
@@ -13,7 +13,7 @@ O elemento `audio` do HTML fornece significado semântico quando é utilizado pa
A tag `audio` suporta o atributo `controls`. Este atributo exibe os controles de reprodução, pausa e outras funcionalidades, além de oferecer suporte ao teclado. Este é um atributo booleano, o que significa que não precisa de um valor. Sua presença na tag ativa a configuração.
-Um exemplo:
+Exemplo:
```html