Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Translation to PT-BR Completed: "removing-effect-dependencies" #777

Open
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

anthonibs
Copy link

Tradução da Página "removing-effect-dependencies.md" para PT-BR

Foi realizada a tradução da página "removing-effect-dependencies", conforme solicitado. A tradução pode ser encontrada na issue #555.

Detalhes da Tradução


Se precisar de ajustes ou de mais informações, é só me avisar!

- Translated the section on handling effect dependencies in React.
- Improved clarity of explanations and examples.
- Added guidelines to avoid common bugs and best practices.

Next steps: complete the translation of the page and review the content.
Copy link

vercel bot commented Aug 26, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

1 Skipped Deployment
Name Status Preview Comments Updated (UTC)
pt-br-legacy-reactjs-org ⬜️ Ignored (Inspect) Visit Preview Aug 26, 2024 2:53pm

@anthonibs anthonibs marked this pull request as draft August 26, 2024 14:57
@anthonibs anthonibs marked this pull request as ready for review August 26, 2024 15:00
@anthonibs anthonibs marked this pull request as draft August 26, 2024 15:02
@anthonibs anthonibs marked this pull request as ready for review August 26, 2024 15:04
Copy link
Member

@jhonmike jhonmike left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I was unable to review the entire PR, but some comments are repeated throughout the document.

Thank you in advance for the translation, from what I read it is very good!

}

export default function App() {
const [roomId, setRoomId] = useState('general');
const [roomId, setRoomId] = useState('geral');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We avoid translating the code values, it seems like I'm translating a variable hehe

Suggested change
const [roomId, setRoomId] = useState('geral');
const [roomId, setRoomId] = useState('general');

Comment on lines +66 to +68
<option value="geral">geral</option>
<option value="viagem">viagem</option>
<option value="música">música</option>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
<option value="geral">geral</option>
<option value="viagem">viagem</option>
<option value="música">música</option>
<option value="general">geral</option>
<option value="travel">viagem</option>
<option value="music">música</option>

}

export default function App() {
const [roomId, setRoomId] = useState('general');
const [roomId, setRoomId] = useState('geral');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
const [roomId, setRoomId] = useState('geral');
const [roomId, setRoomId] = useState('general');

Comment on lines +141 to +143
<option value="geral">geral</option>
<option value="viagem">viagem</option>
<option value="música">música</option>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
<option value="geral">geral</option>
<option value="viagem">viagem</option>
<option value="música">música</option>
<option value="general">geral</option>
<option value="travel">viagem</option>
<option value="music">música</option>

@@ -230,27 +230,27 @@ import { useState, useEffect } from 'react';
import { createConnection } from './chat.js';

const serverUrl = 'https://localhost:1234';
const roomId = 'music';
const roomId = 'música';
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
const roomId = 'música';
const roomId = 'music';

Comment on lines +837 to +839
<option value="geral">geral</option>
<option value="viagem">viagem</option>
<option value="música">música</option>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
<option value="geral">geral</option>
<option value="viagem">viagem</option>
<option value="música">música</option>
<option value="general">geral</option>
<option value="travel">viagem</option>
<option value="music">música</option>

<input value={message} onChange={e => setMessage(e.target.value)} />
</>
);
}

export default function App() {
const [roomId, setRoomId] = useState('general');
const [roomId, setRoomId] = useState('geral');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
const [roomId, setRoomId] = useState('geral');
const [roomId, setRoomId] = useState('general');


In this example, when you press "Show", a welcome message fades in. The animation takes a second. When you press "Remove", the welcome message immediately disappears. The logic for the fade-in animation is implemented in the `animation.js` file as plain JavaScript [animation loop.](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame) You don't need to change that logic. You can treat it as a third-party library. Your Effect creates an instance of `FadeInAnimation` for the DOM node, and then calls `start(duration)` or `stop()` to control the animation. The `duration` is controlled by a slider. Adjust the slider and see how the animation changes.
Neste exemplo, ao pressionar "Mostrar", uma mensagem de boas-vindas aparece gradualmente. A animação leva um segundo. Quando você pressiona "Remover", a mensagem de boas-vindas desaparece imediatamente. A lógica para a animação de fade-in é implementada no arquivo `animation.js` como um [loop de animação](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame) em JavaScript. Você não precisa alterar essa lógica, pois pode tratá-la como uma biblioteca de terceiros. Seu Efeito cria uma instância de `FadeInAnimation` para o nó do DOM e depois chama `start(duration)` ou `stop()` para controlar a animação. A `duration` é controlada por um *slider*. Ajuste o *slider* e veja como a animação muda.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
Neste exemplo, ao pressionar "Mostrar", uma mensagem de boas-vindas aparece gradualmente. A animação leva um segundo. Quando você pressiona "Remover", a mensagem de boas-vindas desaparece imediatamente. A lógica para a animação de fade-in é implementada no arquivo `animation.js` como um [loop de animação](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame) em JavaScript. Você não precisa alterar essa lógica, pois pode tratá-la como uma biblioteca de terceiros. Seu Efeito cria uma instância de `FadeInAnimation` para o nó do DOM e depois chama `start(duration)` ou `stop()` para controlar a animação. A `duration` é controlada por um *slider*. Ajuste o *slider* e veja como a animação muda.
Neste exemplo, ao pressionar "Mostrar", uma mensagem de boas-vindas aparece gradualmente. A animação leva um segundo. Quando você pressiona "Remover", a mensagem de boas-vindas desaparece imediatamente. A lógica para a animação de fade-in é implementada no arquivo `animation.js` como um [loop de animação](https://developer.mozilla.org/pt-BR/docs/Web/API/window/requestAnimationFrame) em JavaScript. Você não precisa alterar essa lógica, pois pode tratá-la como uma biblioteca de terceiros. Seu Efeito cria uma instância de `FadeInAnimation` para o nó do DOM e depois chama `start(duration)` ou `stop()` para controlar a animação. A `duration` é controlada por um *slider*. Ajuste o *slider* e veja como a animação muda.

@jhonmike jhonmike added the needs review A pull request ready to be reviewed label Nov 1, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
needs review A pull request ready to be reviewed
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants