Merge pull request #113 from reactjs/gnuns-home-page

Translate Home Page

Author: cezaraugusto

README.md

@@ -57,10 +57,7 @@ The documentation is divided into several sections with a different tone and pur
 
 ## Translation
 
-If you are interested in translating `reactjs.org`, please see the current translation efforts at [isreacttranslatedyet.com](https://www.isreacttranslatedyet.com/).
-
-
-If your language does not have a translation and you would like to create one, please follow the instructions at [reactjs.org Translations](https://github.com/reactjs/reactjs.org-translation#translating-reactjsorg).
+If you are interested in translating `reactjs.org` to **pt-BR**, check the translation progress and claim a section/page to translate **[here](https://github.com/reactjs/pt-BR.reactjs.org/issues/1)**. Also, when translating any content, make sure you follow our **[Glossary](GLOSSARY.md)**.
 
 ## Troubleshooting
 

content/home/examples/a-component-using-external-plugins.js

@@ -2,7 +2,7 @@ class MarkdownEditor extends React.Component {
   constructor(props) {
     super(props);
     this.handleChange = this.handleChange.bind(this);
-    this.state = { value: 'Hello, **world**!' };
+    this.state = { value: 'Olá, **mundo**!' };
   }
 
   handleChange(e) {
@@ -17,16 +17,16 @@ class MarkdownEditor extends React.Component {
   render() {
     return (
       <div className="MarkdownEditor">
-        <h3>Input</h3>
+        <h3>Entrada</h3>
         <label htmlFor="markdown-content">
-          Enter some markdown
+          Escreva alguma coisa com markdown
         </label>
         <textarea
           id="markdown-content"
           onChange={this.handleChange}
           defaultValue={this.state.value}
         />
-        <h3>Output</h3>
+        <h3>Saída</h3>
         <div
           className="content"
           dangerouslySetInnerHTML={this.getRawMarkup()}

content/home/examples/a-component-using-external-plugins.md

@@ -1,7 +1,7 @@
 ---
-title: A Component Using External Plugins
+title: Um Componente Usando Plugins Externos
 order: 3
 domid: markdown-example
 ---
 
-React allows you to interface with other libraries and frameworks. This example uses **remarkable**, an external Markdown library, to convert the `<textarea>`'s value in real time.
+O React é flexível e facilita a interface com outras bibliotecas e frameworks. Este exemplo usa **remarkable**, uma biblioteca externa de Markdown, para converter o valor de uma `<textarea>` em tempo real.

content/home/examples/a-simple-component.js

@@ -2,7 +2,7 @@ class HelloMessage extends React.Component {
   render() {
     return (
       <div>
-        Hello {this.props.name}
+        Olá, {this.props.name}!
       </div>
     );
   }

content/home/examples/a-simple-component.md

@@ -1,9 +1,9 @@
 ---
-title: A Simple Component
+title: Um Componente Simples
 order: 0
 domid: hello-example
 ---
 
-React components implement a `render()` method that takes input data and returns what to display. This example uses an XML-like syntax called JSX. Input data that is passed into the component can be accessed by `render()` via `this.props`.
+Os componentes do React implementam um método `render()` que recebe os dados de entrada e retornam o que deve ser exibido. Este exemplo usa uma sintaxe parecida com XML chamada JSX. Os dados de entrada que são passados para o componente podem ser acessados no `render()` via `this.props`.
 
-**JSX is optional and not required to use React.** Try the [Babel REPL](babel://es5-syntax-example) to see the raw JavaScript code produced by the JSX compilation step.
+**O JSX é opcional e não é necessário para usar o React.** Teste o [Babel REPL](babel://es5-syntax-example) para ver o código JavaScript bruto produzido pela etapa de compilação do JSX.

content/home/examples/a-stateful-component.js

@@ -21,7 +21,7 @@ class Timer extends React.Component {
   render() {
     return (
       <div>
-        Seconds: {this.state.seconds}
+        Segundos: {this.state.seconds}
       </div>
     );
   }

content/home/examples/a-stateful-component.md

@@ -1,7 +1,7 @@
 ---
-title: A Stateful Component
+title: Um Componente com Estado (stateful component)
 order: 1
 domid: timer-example
 ---
 
-In addition to taking input data (accessed via `this.props`), a component can maintain internal state data (accessed via `this.state`). When a component's state data changes, the rendered markup will be updated by re-invoking `render()`.
+Além de receber dados de entrada (acessados via `this.props`), um componente pode manter dados do *state* interno (acessados via  `this.state`). Quando os dados do state de um componente são alterados, o código renderizado será atualizado invocando o método `render()` novamente.

content/home/examples/an-application.js

@@ -9,19 +9,19 @@ class TodoApp extends React.Component {
   render() {
     return (
       <div>
-        <h3>TODO</h3>
+        <h3>Tarefas</h3>
         <TodoList items={this.state.items} />
         <form onSubmit={this.handleSubmit}>
           <label htmlFor="new-todo">
-            What needs to be done?
+            O que precisa ser feito?
           </label>
           <input
             id="new-todo"
             onChange={this.handleChange}
             value={this.state.text}
           />
           <button>
-            Add #{this.state.items.length + 1}
+            Adicionar #{this.state.items.length + 1}
           </button>
         </form>
       </div>

content/home/examples/an-application.md

@@ -1,7 +1,7 @@
 ---
-title: An Application
+title: Uma Aplicação
 order: 2
 domid: todos-example
 ---
 
-Using `props` and `state`, we can put together a small Todo application. This example uses `state` to track the current list of items as well as the text that the user has entered. Although event handlers appear to be rendered inline, they will be collected and implemented using event delegation.
+Usando `props` e `state`, nós podemos montar uma pequena aplicação de Lista de Tarefas. Este exemplo usa `state` para manter a lista atual de itens, bem como o texto que o usuário inseriu. Apesar de parecer que os *event handlers* são renderizados *inline*, eles serão coletados e implementados usando a delegação de eventos (*event delegation*).

content/home/marketing/component-based.md

@@ -1,8 +1,8 @@
 ---
-title: Component-Based
+title: Baseado em componentes
 order: 1
 ---
 
-Build encapsulated components that manage their own state, then compose them to make complex UIs.
+Crie componentes encapsulados que gerenciam seu próprio estado e então, combine-os para criar UIs complexas.
 
-Since component logic is written in JavaScript instead of templates, you can easily pass rich data through your app and keep state out of the DOM.
+Como a lógica do componente é escrita em JavaScript e não em templates, você pode facilmente passar diversos tipos de dados ao longo da sua aplicação e ainda manter o estado fora do DOM.