From 07fefd99868640570c3987a585fd253c9b515464 Mon Sep 17 00:00:00 2001
From: Ezequiel Monforte <ezequielmonforte@gmail.com>
Date: Thu, 31 Jan 2019 18:15:17 -0300
Subject: [PATCH 01/11] WIP Components and Props

---
 content/docs/components-and-props.md | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index 06a25971d..c99ec971c 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -16,9 +16,11 @@ prev: rendering-elements.html
 next: state-and-lifecycle.html
 ---
 
-Components let you split the UI into independent, reusable pieces, and think about each piece in isolation. This page provides an introduction to the idea of components. You can find a [detailed component API reference here](/docs/react-component.html).
+Los componentes permiten separar la UI en piezas independientes, reutilizables y pensar en cada pieza de forma aislada.
+Esta página proporciona una introducción a la idea de los componentes.
+Puedes encontrar una [API detallada sobre componentes aqui](/docs/react-component.html).
 
-Conceptually, components are like JavaScript functions. They accept arbitrary inputs (called "props") and return React elements describing what should appear on the screen.
+Conceptualmente, los componentes son como las funciones de JavaScript. Aceptan entradas arbitrarias (llamadas "props") y devuelven a React elementos que describen lo que debe aparecer en la pantalla.
 
 ## Function and Class Components
 

From ef5ebcd62c0758e2fb9f9472d0eb525d03885c23 Mon Sep 17 00:00:00 2001
From: Ezequiel Monforte <ezequielmonforte@gmail.com>
Date: Thu, 31 Jan 2019 19:09:25 -0300
Subject: [PATCH 02/11] update-1

---
 content/docs/components-and-props.md | 89 ++++++++++++++--------------
 1 file changed, 44 insertions(+), 45 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index c99ec971c..56a8271c1 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -1,6 +1,6 @@
 ---
 id: components-and-props
-title: Components and Props
+title: Componentes y Propiedades
 permalink: docs/components-and-props.html
 redirect_from:
   - "docs/reusable-components.html"
@@ -15,16 +15,15 @@ redirect_from:
 prev: rendering-elements.html
 next: state-and-lifecycle.html
 ---
-
 Los componentes permiten separar la UI en piezas independientes, reutilizables y pensar en cada pieza de forma aislada.
 Esta página proporciona una introducción a la idea de los componentes.
 Puedes encontrar una [API detallada sobre componentes aqui](/docs/react-component.html).
 
 Conceptualmente, los componentes son como las funciones de JavaScript. Aceptan entradas arbitrarias (llamadas "props") y devuelven a React elementos que describen lo que debe aparecer en la pantalla.
 
-## Function and Class Components
+## Componentes Funcionales y de Clase
 
-The simplest way to define a component is to write a JavaScript function:
+La forma más sencilla de definir un componente es escribir una función de JavaScript:
 
 ```js
 function Welcome(props) {
@@ -32,9 +31,9 @@ function Welcome(props) {
 }
 ```
 
-This function is a valid React component because it accepts a single "props" (which stands for properties) object argument with data and returns a React element. We call such components "function components" because they are literally JavaScript functions.
+Esta función es un componente de React válido porque acepta un solo argumento de objeto "props" (que significa propiedades) con datos y devuelve un elemento de React. Llamamos a dichos componentes "funcionales" porque literalmente son funciones JavaScript.
 
-You can also use an [ES6 class](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes) to define a component:
+También puedes utilizar una [ clase de ES6](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes) para definir un componente:
 
 ```js
 class Welcome extends React.Component {
@@ -44,19 +43,19 @@ class Welcome extends React.Component {
 }
 ```
 
-The above two components are equivalent from React's point of view.
+Los dos componentes anteriores son equivalentes desde el punto de vista de React.
 
-Classes have some additional features that we will discuss in the [next sections](/docs/state-and-lifecycle.html). Until then, we will use function components for their conciseness.
+Las clases tienen algunas características adicionales que veremos en las [próximas secciones](/docs/state-and-lifecycle.html). Hasta entonces, usaremos componentes funcionales para su concisión.
 
-## Rendering a Component
+## Renderizando un Componente
 
-Previously, we only encountered React elements that represent DOM tags:
+Anteriormente, sólo encontramos elementos de React que representan las etiquetas del DOM:
 
 ```js
 const element = <div />;
 ```
 
-However, elements can also represent user-defined components:
+Sin embargo, los elementos también pueden representar componentes definidos por el usuario:
 
 ```js
 const element = <Welcome name="Sara" />;
@@ -64,7 +63,7 @@ const element = <Welcome name="Sara" />;
 
 When React sees an element representing a user-defined component, it passes JSX attributes to this component as a single object. We call this object "props".
 
-For example, this code renders "Hello, Sara" on the page:
+Por ejemplo, este código muestra "Hello, Sara" en la página:
 
 ```js{1,5}
 function Welcome(props) {
@@ -80,24 +79,24 @@ ReactDOM.render(
 
 [](codepen://components-and-props/rendering-a-component)
 
-Let's recap what happens in this example:
+Recapitulemos lo que sucede en este ejemplo:
 
-1. We call `ReactDOM.render()` with the `<Welcome name="Sara" />` element.
-2. React calls the `Welcome` component with `{name: 'Sara'}` as the props.
-3. Our `Welcome` component returns a `<h1>Hello, Sara</h1>` element as the result.
-4. React DOM efficiently updates the DOM to match `<h1>Hello, Sara</h1>`.
+1. Llamamos a `ReactDOM.render()` con el elemento `<Welcome name="Sara" />`.
+2. React llama al componente `Welcome` con `{name: 'Sara'}` como "props".
+3. Nuestro componente `Welcome` devuelve un elemento `<h1>Hello, Sara</h1>` como resultado.
+4. React DOM actualiza eficientemente el DOM para que coincida con `<h1>Hello, Sara</h1>`.
 
->**Note:** Always start component names with a capital letter.
->
->React treats components starting with lowercase letters as DOM tags. For example, `<div />` represents an HTML div tag, but `<Welcome />` represents a component and requires `Welcome` to be in scope.
->
->You can read more about the reasoning behind this convention [here.](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized)
+> **Note:** Siempre comienza los nombres de componentes con una letra mayúscula
+> 
+> React trata los componentes que empiezan con letras minúsculas como etiquetas del DOM. Por ejemplo, `<div />` representa una etiqueta div HTML pero `<Bienvenido />` representa un componente y requiere que `Bienvenido` esté al alcance.
+> 
+> Puedes leer mas sobre el razonamiento detras de esta convencion [aqui.](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized)
 
-## Composing Components
+## Composición de Componentes
 
-Components can refer to other components in their output. This lets us use the same component abstraction for any level of detail. A button, a form, a dialog, a screen: in React apps, all those are commonly expressed as components.
+Los componentes pueden referirse a otros componentes en su salida. Esto nos permite utilizar la misma abstracción de componente para cualquier nivel de detalle. Un botón, un cuadro de diálogo, un formulario, una pantalla: en aplicaciones de React, todos son expresados comunmente como componentes.
 
-For example, we can create an `App` component that renders `Welcome` many times:
+Por ejemplo, podemos crear un componente de `App` que renderiza `Welcome` muchas veces:
 
 ```js{8-10}
 function Welcome(props) {
@@ -122,13 +121,13 @@ ReactDOM.render(
 
 [](codepen://components-and-props/composing-components)
 
-Typically, new React apps have a single `App` component at the very top. However, if you integrate React into an existing app, you might start bottom-up with a small component like `Button` and gradually work your way to the top of the view hierarchy.
+Por lo general, aplicaciones nuevas en React tienen un único componente `App` en lo mas alto. Sin embargo, si se integra React en una aplicación existente, se podría empezar de abajo hacia arriba con un pequeño componente como `Button` y poco a poco trabajar el camino a la cima de la jerarquía de la vista.
 
-## Extracting Components
+## Extracción de Componentes
 
-Don't be afraid to split components into smaller components.
+No tengas miedo de dividir los componentes en unos más pequeños.
 
-For example, consider this `Comment` component:
+Por ejemplo, considera este componente `Comentario`:
 
 ```js
 function Comment(props) {
@@ -156,11 +155,11 @@ function Comment(props) {
 
 [](codepen://components-and-props/extracting-components)
 
-It accepts `author` (an object), `text` (a string), and `date` (a date) as props, and describes a comment on a social media website.
+Acepta `author` (un objeto), `text` (una cadena), y `date` (una fecha) como propiedades, y representa un comentario en una web de redes sociales.
 
-This component can be tricky to change because of all the nesting, and it is also hard to reuse individual parts of it. Let's extract a few components from it.
+Este componente puede ser dificil de cambiar por todo el anidamiento, y tambien es dificil reusar partes individuales de el. Vamos a extraer algunos componentes de este.
 
-First, we will extract `Avatar`:
+Primero, vamos a extraer `Avatar`:
 
 ```js{3-6}
 function Avatar(props) {
@@ -173,11 +172,11 @@ function Avatar(props) {
 }
 ```
 
-The `Avatar` doesn't need to know that it is being rendered inside a `Comment`. This is why we have given its prop a more generic name: `user` rather than `author`.
+El `Avatar` no necesita saber que está siendo renderizado dentro de un `Comment`. Esto es por lo que le dimos a la propiedad un nombre más genérico: `user` en vez de `author`.
 
-We recommend naming props from the component's own point of view rather than the context in which it is being used.
+Recomendamos nombrar las propiedades desde el punto de vista del componente, en vez de la del contexto en el que se va a utilizar.
 
-We can now simplify `Comment` a tiny bit:
+Ahora podemos simplificar `Comment` un poquito:
 
 ```js{5}
 function Comment(props) {
@@ -200,7 +199,7 @@ function Comment(props) {
 }
 ```
 
-Next, we will extract a `UserInfo` component that renders an `Avatar` next to the user's name:
+A continuacion, vamos a extraer un componente `UserInfo` que renderiza un `Avatar` al lado del nombre del usuario:
 
 ```js{3-8}
 function UserInfo(props) {
@@ -215,7 +214,7 @@ function UserInfo(props) {
 }
 ```
 
-This lets us simplify `Comment` even further:
+Esto nos permite simplificar `Comment` un poco más:
 
 ```js{4}
 function Comment(props) {
@@ -235,11 +234,11 @@ function Comment(props) {
 
 [](codepen://components-and-props/extracting-components-continued)
 
-Extracting components might seem like grunt work at first, but having a palette of reusable components pays off in larger apps. A good rule of thumb is that if a part of your UI is used several times (`Button`, `Panel`, `Avatar`), or is complex enough on its own (`App`, `FeedStory`, `Comment`), it is a good candidate to be a reusable component.
+Extraer componentes puede parecer un trabajo pesado al principio, pero tener una paleta de componentes reutilizables vale la pena en aplicaciones más grandes. Una buena regla en general es que si una parte de su UI se usa varias veces (`Button`, `Panel`, `Avatar`), o es lo suficientemente compleja por sí misma (`App`, `FeedStory`, `Comment`), es buen candidato para ser un componente reutilizable.
 
-## Props are Read-Only
+## Las props son de solo lectura
 
-Whether you declare a component [as a function or a class](#function-and-class-components), it must never modify its own props. Consider this `sum` function:
+Ya sea que declares un componente [como una funcion o como una clase](#function-and-class-components), este nunca debe modificar sus propiedades. Considera esta funcion `sum` :
 
 ```js
 function sum(a, b) {
@@ -247,9 +246,9 @@ function sum(a, b) {
 }
 ```
 
-Such functions are called ["pure"](https://en.wikipedia.org/wiki/Pure_function) because they do not attempt to change their inputs, and always return the same result for the same inputs.
+Tales funciones son llamadas ["puras"](https://en.wikipedia.org/wiki/Pure_function) por que no tratan de cambiar sus entradas, y siempre devuelven el mismo resultado para las mismas entradas.
 
-In contrast, this function is impure because it changes its own input:
+En contraste, esta función es impura por que cambia su propia entrada:
 
 ```js
 function withdraw(account, amount) {
@@ -257,8 +256,8 @@ function withdraw(account, amount) {
 }
 ```
 
-React is pretty flexible but it has a single strict rule:
+React es bastante flexible pero tiene una sola regla estricta:
 
-**All React components must act like pure functions with respect to their props.**
+**Todos los componentes de React deben actuar como funciones puras con respecto a sus propiedades.**
 
-Of course, application UIs are dynamic and change over time. In the [next section](/docs/state-and-lifecycle.html), we will introduce a new concept of "state". State allows React components to change their output over time in response to user actions, network responses, and anything else, without violating this rule.
+Por supuesto, las UI de las aplicaciones son dinamicas y cambian con el tiempo. En la [siguiente sección](/docs/state-and-lifecycle.html), introduciremos un nuevo concepto de "estado". El estado le permite a los componentes de React cambiar su salida a lo largo del tiempo en respuesta a acciones del usuario, respuestas de red y cualquier otra cosa, sin violar esta regla.
\ No newline at end of file

From 23fcd1e235d91e6c19eb76d147154aaa2044efc9 Mon Sep 17 00:00:00 2001
From: Ezequiel Monforte <ezequielmonforte@gmail.com>
Date: Thu, 31 Jan 2019 20:11:46 -0300
Subject: [PATCH 03/11] ticks added

---
 content/docs/components-and-props.md | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index 56a8271c1..171d2e77d 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -61,7 +61,7 @@ Sin embargo, los elementos también pueden representar componentes definidos por
 const element = <Welcome name="Sara" />;
 ```
 
-When React sees an element representing a user-defined component, it passes JSX attributes to this component as a single object. We call this object "props".
+Cuando React ve representando un componente definido por el usuario, pasa atributos JSX a este componente como un solo objeto. Llamamos a este objeto "props".
 
 Por ejemplo, este código muestra "Hello, Sara" en la página:
 
@@ -90,7 +90,7 @@ Recapitulemos lo que sucede en este ejemplo:
 > 
 > React trata los componentes que empiezan con letras minúsculas como etiquetas del DOM. Por ejemplo, `<div />` representa una etiqueta div HTML pero `<Bienvenido />` representa un componente y requiere que `Bienvenido` esté al alcance.
 > 
-> Puedes leer mas sobre el razonamiento detras de esta convencion [aqui.](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized)
+> Puedes leer mas sobre el razonamiento detras de esta convención [aquí.](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized)
 
 ## Composición de Componentes
 
@@ -157,7 +157,7 @@ function Comment(props) {
 
 Acepta `author` (un objeto), `text` (una cadena), y `date` (una fecha) como propiedades, y representa un comentario en una web de redes sociales.
 
-Este componente puede ser dificil de cambiar por todo el anidamiento, y tambien es dificil reusar partes individuales de el. Vamos a extraer algunos componentes de este.
+Este componente puede ser difícil de cambiar por todo el anidamiento, y tambien es difícil reusar partes individuales de él. Vamos a extraer algunos componentes de este.
 
 Primero, vamos a extraer `Avatar`:
 
@@ -238,7 +238,7 @@ Extraer componentes puede parecer un trabajo pesado al principio, pero tener una
 
 ## Las props son de solo lectura
 
-Ya sea que declares un componente [como una funcion o como una clase](#function-and-class-components), este nunca debe modificar sus propiedades. Considera esta funcion `sum` :
+Ya sea que declares un componente [como una funcion o como una clase](#function-and-class-components), este nunca debe modificar sus propiedades. Considera esta función `sum` :
 
 ```js
 function sum(a, b) {
@@ -260,4 +260,4 @@ React es bastante flexible pero tiene una sola regla estricta:
 
 **Todos los componentes de React deben actuar como funciones puras con respecto a sus propiedades.**
 
-Por supuesto, las UI de las aplicaciones son dinamicas y cambian con el tiempo. En la [siguiente sección](/docs/state-and-lifecycle.html), introduciremos un nuevo concepto de "estado". El estado le permite a los componentes de React cambiar su salida a lo largo del tiempo en respuesta a acciones del usuario, respuestas de red y cualquier otra cosa, sin violar esta regla.
\ No newline at end of file
+Por supuesto, las UI de las aplicaciones son dinámicas y cambian con el tiempo. En la [siguiente sección](/docs/state-and-lifecycle.html), introduciremos un nuevo concepto de "estado". El estado le permite a los componentes de React cambiar su salida a lo largo del tiempo en respuesta a acciones del usuario, respuestas de red y cualquier otra cosa, sin violar esta regla.
\ No newline at end of file

From b82dc6efb76cb3e4b0bd6f9e6569ea8914a7c902 Mon Sep 17 00:00:00 2001
From: Ezequiel Monforte <ezequielmonforte@gmail.com>
Date: Thu, 31 Jan 2019 22:34:10 -0300
Subject: [PATCH 04/11] correcting some mistakes there r still some to crrect

---
 content/docs/components-and-props.md | 26 +++++++++++++-------------
 1 file changed, 13 insertions(+), 13 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index 171d2e77d..a093f23db 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -31,9 +31,9 @@ function Welcome(props) {
 }
 ```
 
-Esta función es un componente de React válido porque acepta un solo argumento de objeto "props" (que significa propiedades) con datos y devuelve un elemento de React. Llamamos a dichos componentes "funcionales" porque literalmente son funciones JavaScript.
+Esta función es un componente de React válido porque acepta un solo argumento de objeto "props" (que proviene de propiedades) con datos y devuelve un elemento de React. Llamamos a dichos componentes "funcionales" porque literalmente son funciones JavaScript.
 
-También puedes utilizar una [ clase de ES6](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes) para definir un componente:
+También puedes utilizar una [clase de ES6](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes) para definir un componente:
 
 ```js
 class Welcome extends React.Component {
@@ -45,7 +45,7 @@ class Welcome extends React.Component {
 
 Los dos componentes anteriores son equivalentes desde el punto de vista de React.
 
-Las clases tienen algunas características adicionales que veremos en las [próximas secciones](/docs/state-and-lifecycle.html). Hasta entonces, usaremos componentes funcionales para su concisión.
+Las clases tienen algunas características adicionales que veremos en las [próximas secciones](/docs/state-and-lifecycle.html). Hasta entonces, usaremos componentes funcionales por su concisión.
 
 ## Renderizando un Componente
 
@@ -86,9 +86,9 @@ Recapitulemos lo que sucede en este ejemplo:
 3. Nuestro componente `Welcome` devuelve un elemento `<h1>Hello, Sara</h1>` como resultado.
 4. React DOM actualiza eficientemente el DOM para que coincida con `<h1>Hello, Sara</h1>`.
 
-> **Note:** Siempre comienza los nombres de componentes con una letra mayúscula
+> **Nota:** Comienza siempre los nombres de componentes con una letra mayúscula
 > 
-> React trata los componentes que empiezan con letras minúsculas como etiquetas del DOM. Por ejemplo, `<div />` representa una etiqueta div HTML pero `<Bienvenido />` representa un componente y requiere que `Bienvenido` esté al alcance.
+>React trata los componentes que empiezan con letras minúsculas como etiquetas del DOM. Por ejemplo, `<div />` representa una etiqueta div HTML pero `<Bienvenido />` representa un componente y requiere que `Bienvenido` esté al alcance.
 > 
 > Puedes leer mas sobre el razonamiento detras de esta convención [aquí.](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized)
 
@@ -96,7 +96,7 @@ Recapitulemos lo que sucede en este ejemplo:
 
 Los componentes pueden referirse a otros componentes en su salida. Esto nos permite utilizar la misma abstracción de componente para cualquier nivel de detalle. Un botón, un cuadro de diálogo, un formulario, una pantalla: en aplicaciones de React, todos son expresados comunmente como componentes.
 
-Por ejemplo, podemos crear un componente de `App` que renderiza `Welcome` muchas veces:
+Por ejemplo, podemos crear un componente `App` que renderiza `Welcome` muchas veces:
 
 ```js{8-10}
 function Welcome(props) {
@@ -121,11 +121,11 @@ ReactDOM.render(
 
 [](codepen://components-and-props/composing-components)
 
-Por lo general, aplicaciones nuevas en React tienen un único componente `App` en lo mas alto. Sin embargo, si se integra React en una aplicación existente, se podría empezar de abajo hacia arriba con un pequeño componente como `Button` y poco a poco trabajar el camino a la cima de la jerarquía de la vista.
+Por lo general, las aplicaciones en React tienen un único componente `App` en lo mas alto. Sin embargo, si se integra React en una aplicación existente, se podría empezar de abajo hacia arriba con un pequeño componente como `Button` y poco a poco trabajar el camino a la cima de la jerarquía de la vista.
 
 ## Extracción de Componentes
 
-No tengas miedo de dividir los componentes en unos más pequeños.
+No tengas miedo de dividir los componentes en otros más pequeños.
 
 Por ejemplo, considera este componente `Comentario`:
 
@@ -155,9 +155,9 @@ function Comment(props) {
 
 [](codepen://components-and-props/extracting-components)
 
-Acepta `author` (un objeto), `text` (una cadena), y `date` (una fecha) como propiedades, y representa un comentario en una web de redes sociales.
+Acepta `author` (un objeto), `text` (un string), y `date` (una fecha) como propiedades, y describe un comentario en una web de redes sociales.
 
-Este componente puede ser difícil de cambiar por todo el anidamiento, y tambien es difícil reusar partes individuales de él. Vamos a extraer algunos componentes de este.
+Este componente puede ser difícil de cambiar debido a todo el anidamiento, y tambien es difícil reusar partes individuales de él. Vamos a extraer algunos componentes del mismo.
 
 Primero, vamos a extraer `Avatar`:
 
@@ -172,7 +172,7 @@ function Avatar(props) {
 }
 ```
 
-El `Avatar` no necesita saber que está siendo renderizado dentro de un `Comment`. Esto es por lo que le dimos a la propiedad un nombre más genérico: `user` en vez de `author`.
+El `Avatar` no necesita saber que está siendo renderizado dentro de un `Comment`. Esto es por lo que le dimos a su propiedad un nombre más genérico: `user` en vez de `author`.
 
 Recomendamos nombrar las propiedades desde el punto de vista del componente, en vez de la del contexto en el que se va a utilizar.
 
@@ -214,7 +214,7 @@ function UserInfo(props) {
 }
 ```
 
-Esto nos permite simplificar `Comment` un poco más:
+Esto nos permite simplificar `Comment` aun más:
 
 ```js{4}
 function Comment(props) {
@@ -236,7 +236,7 @@ function Comment(props) {
 
 Extraer componentes puede parecer un trabajo pesado al principio, pero tener una paleta de componentes reutilizables vale la pena en aplicaciones más grandes. Una buena regla en general es que si una parte de su UI se usa varias veces (`Button`, `Panel`, `Avatar`), o es lo suficientemente compleja por sí misma (`App`, `FeedStory`, `Comment`), es buen candidato para ser un componente reutilizable.
 
-## Las props son de solo lectura
+## Las propiedades son de solo lectura
 
 Ya sea que declares un componente [como una funcion o como una clase](#function-and-class-components), este nunca debe modificar sus propiedades. Considera esta función `sum` :
 

From 4653b9d6523b38282687058ad1bd25bb9d2737f6 Mon Sep 17 00:00:00 2001
From: Ezequiel Monforte <ezequielmonforte@gmail.com>
Date: Thu, 31 Jan 2019 22:49:13 -0300
Subject: [PATCH 05/11] some mistakes there r still some to crrect 1

---
 content/docs/components-and-props.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index a093f23db..79ba26ea6 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -88,7 +88,7 @@ Recapitulemos lo que sucede en este ejemplo:
 
 > **Nota:** Comienza siempre los nombres de componentes con una letra mayúscula
 > 
->React trata los componentes que empiezan con letras minúsculas como etiquetas del DOM. Por ejemplo, `<div />` representa una etiqueta div HTML pero `<Bienvenido />` representa un componente y requiere que `Bienvenido` esté al alcance.
+>React trata los componentes que empiezan con letras minúsculas como etiquetas del DOM. Por ejemplo, `<div />` representa una etiqueta div HTML pero `<Welcome />` representa un componente y requiere que `Welcome` esté al alcance.
 > 
 > Puedes leer mas sobre el razonamiento detras de esta convención [aquí.](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized)
 
@@ -127,7 +127,7 @@ Por lo general, las aplicaciones en React tienen un único componente `App` en l
 
 No tengas miedo de dividir los componentes en otros más pequeños.
 
-Por ejemplo, considera este componente `Comentario`:
+Por ejemplo, considera este componente `Comment`:
 
 ```js
 function Comment(props) {

From 23563b5e4b50f05897d298583ab1ec2162c983b6 Mon Sep 17 00:00:00 2001
From: Ezequiel Monforte <ezequielmonforte@gmail.com>
Date: Thu, 31 Jan 2019 22:53:47 -0300
Subject: [PATCH 06/11] some mistakes there r still some to crrect-2

---
 content/docs/components-and-props.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index 79ba26ea6..0384ac57a 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -88,7 +88,7 @@ Recapitulemos lo que sucede en este ejemplo:
 
 > **Nota:** Comienza siempre los nombres de componentes con una letra mayúscula
 > 
->React trata los componentes que empiezan con letras minúsculas como etiquetas del DOM. Por ejemplo, `<div />` representa una etiqueta div HTML pero `<Welcome />` representa un componente y requiere que `Welcome` esté al alcance.
+>React trata los componentes que empiezan con letras minúsculas como etiquetas del DOM. Por ejemplo, `<div />` representa una etiqueta div HTML pero `<Welcome />` representa un componente y requiere que `Welcome` esté en scope.
 > 
 > Puedes leer mas sobre el razonamiento detras de esta convención [aquí.](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized)
 

From b97ceb5e3ccd83c15290d528ed118e23e5ca804e Mon Sep 17 00:00:00 2001
From: Ezequiel Monforte <ezequielmonforte@gmail.com>
Date: Fri, 1 Feb 2019 11:56:46 -0300
Subject: [PATCH 07/11] some mistakes there r still some to correct-3

---
 content/docs/components-and-props.md | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index 0384ac57a..be209669c 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -121,7 +121,7 @@ ReactDOM.render(
 
 [](codepen://components-and-props/composing-components)
 
-Por lo general, las aplicaciones en React tienen un único componente `App` en lo mas alto. Sin embargo, si se integra React en una aplicación existente, se podría empezar de abajo hacia arriba con un pequeño componente como `Button` y poco a poco trabajar el camino a la cima de la jerarquía de la vista.
+Por lo general, las aplicaciones de React nuevas tienen un único componente `App` en lo más alto. Sin embargo, si se integra React en una aplicación existente, se podría empezar de abajo hacia arriba con un pequeño componente como `Button` y poco a poco trabajar el camino a la cima de la jerarquía de la vista.
 
 ## Extracción de Componentes
 
@@ -155,9 +155,9 @@ function Comment(props) {
 
 [](codepen://components-and-props/extracting-components)
 
-Acepta `author` (un objeto), `text` (un string), y `date` (una fecha) como propiedades, y describe un comentario en una web de redes sociales.
+Acepta `author` (un objeto), `text` (un string), y `date` (una fecha) como props, y describe un comentario en una web de redes sociales.
 
-Este componente puede ser difícil de cambiar debido a todo el anidamiento, y tambien es difícil reusar partes individuales de él. Vamos a extraer algunos componentes del mismo.
+Este componente puede ser difícil de cambiar debido a todo el anidamiento, y támbien es difícil reusar partes individuales de él. Vamos a extraer algunos componentes del mismo.
 
 Primero, vamos a extraer `Avatar`:
 
@@ -174,7 +174,7 @@ function Avatar(props) {
 
 El `Avatar` no necesita saber que está siendo renderizado dentro de un `Comment`. Esto es por lo que le dimos a su propiedad un nombre más genérico: `user` en vez de `author`.
 
-Recomendamos nombrar las propiedades desde el punto de vista del componente, en vez de la del contexto en el que se va a utilizar.
+Recomendamos nombrar las props desde el punto de vista del componente, en vez de la del contexto en el que se va a utilizar.
 
 Ahora podemos simplificar `Comment` un poquito:
 
@@ -236,9 +236,9 @@ function Comment(props) {
 
 Extraer componentes puede parecer un trabajo pesado al principio, pero tener una paleta de componentes reutilizables vale la pena en aplicaciones más grandes. Una buena regla en general es que si una parte de su UI se usa varias veces (`Button`, `Panel`, `Avatar`), o es lo suficientemente compleja por sí misma (`App`, `FeedStory`, `Comment`), es buen candidato para ser un componente reutilizable.
 
-## Las propiedades son de solo lectura
+## Las props son de solo lectura
 
-Ya sea que declares un componente [como una funcion o como una clase](#function-and-class-components), este nunca debe modificar sus propiedades. Considera esta función `sum` :
+Ya sea que declares un componente [como una función o como una clase](#function-and-class-components), este nunca debe modificar sus props. Considera esta función `sum` :
 
 ```js
 function sum(a, b) {
@@ -258,6 +258,6 @@ function withdraw(account, amount) {
 
 React es bastante flexible pero tiene una sola regla estricta:
 
-**Todos los componentes de React deben actuar como funciones puras con respecto a sus propiedades.**
+**Todos los componentes de React deben actuar como funciones puras con respecto a sus props.**
 
 Por supuesto, las UI de las aplicaciones son dinámicas y cambian con el tiempo. En la [siguiente sección](/docs/state-and-lifecycle.html), introduciremos un nuevo concepto de "estado". El estado le permite a los componentes de React cambiar su salida a lo largo del tiempo en respuesta a acciones del usuario, respuestas de red y cualquier otra cosa, sin violar esta regla.
\ No newline at end of file

From d0aa421e916ee1b7de5eb5caf3fd9250018ad1f8 Mon Sep 17 00:00:00 2001
From: Ezequiel Monforte <ezequielmonforte@gmail.com>
Date: Fri, 1 Feb 2019 16:23:09 -0300
Subject: [PATCH 08/11] some mistakes there r still some to crrect-4

---
 content/docs/components-and-props.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index be209669c..da363efbc 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -92,7 +92,7 @@ Recapitulemos lo que sucede en este ejemplo:
 > 
 > Puedes leer mas sobre el razonamiento detras de esta convención [aquí.](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized)
 
-## Composición de Componentes
+## Confeccionando Componentes
 
 Los componentes pueden referirse a otros componentes en su salida. Esto nos permite utilizar la misma abstracción de componente para cualquier nivel de detalle. Un botón, un cuadro de diálogo, un formulario, una pantalla: en aplicaciones de React, todos son expresados comunmente como componentes.
 
@@ -123,7 +123,7 @@ ReactDOM.render(
 
 Por lo general, las aplicaciones de React nuevas tienen un único componente `App` en lo más alto. Sin embargo, si se integra React en una aplicación existente, se podría empezar de abajo hacia arriba con un pequeño componente como `Button` y poco a poco trabajar el camino a la cima de la jerarquía de la vista.
 
-## Extracción de Componentes
+## Extrayendo de Componentes
 
 No tengas miedo de dividir los componentes en otros más pequeños.
 

From b480c8d835e6c36b6c2b2f65c01433a2dece0c42 Mon Sep 17 00:00:00 2001
From: Ezequiel Monforte <ezequielmonforte@gmail.com>
Date: Fri, 1 Feb 2019 20:33:18 -0300
Subject: [PATCH 09/11] all changes applied

---
 content/docs/components-and-props.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index da363efbc..be209669c 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -92,7 +92,7 @@ Recapitulemos lo que sucede en este ejemplo:
 > 
 > Puedes leer mas sobre el razonamiento detras de esta convención [aquí.](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized)
 
-## Confeccionando Componentes
+## Composición de Componentes
 
 Los componentes pueden referirse a otros componentes en su salida. Esto nos permite utilizar la misma abstracción de componente para cualquier nivel de detalle. Un botón, un cuadro de diálogo, un formulario, una pantalla: en aplicaciones de React, todos son expresados comunmente como componentes.
 
@@ -123,7 +123,7 @@ ReactDOM.render(
 
 Por lo general, las aplicaciones de React nuevas tienen un único componente `App` en lo más alto. Sin embargo, si se integra React en una aplicación existente, se podría empezar de abajo hacia arriba con un pequeño componente como `Button` y poco a poco trabajar el camino a la cima de la jerarquía de la vista.
 
-## Extrayendo de Componentes
+## Extracción de Componentes
 
 No tengas miedo de dividir los componentes en otros más pequeños.
 

From 32b0e9cf871c2f3a7813e827693cca170bc6967e Mon Sep 17 00:00:00 2001
From: Ezequiel Monforte <ezequielmonforte@gmail.com>
Date: Fri, 1 Feb 2019 20:53:36 -0300
Subject: [PATCH 10/11] all changes applied-1

---
 content/docs/components-and-props.md | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index be209669c..a2f239b45 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -15,8 +15,7 @@ redirect_from:
 prev: rendering-elements.html
 next: state-and-lifecycle.html
 ---
-Los componentes permiten separar la UI en piezas independientes, reutilizables y pensar en cada pieza de forma aislada.
-Esta página proporciona una introducción a la idea de los componentes.
+Los componentes permiten separar la UI en piezas independientes, reutilizables y pensar en cada pieza de forma aislada.Esta página proporciona una introducción a la idea de los componentes.
 Puedes encontrar una [API detallada sobre componentes aqui](/docs/react-component.html).
 
 Conceptualmente, los componentes son como las funciones de JavaScript. Aceptan entradas arbitrarias (llamadas "props") y devuelven a React elementos que describen lo que debe aparecer en la pantalla.
@@ -33,7 +32,8 @@ function Welcome(props) {
 
 Esta función es un componente de React válido porque acepta un solo argumento de objeto "props" (que proviene de propiedades) con datos y devuelve un elemento de React. Llamamos a dichos componentes "funcionales" porque literalmente son funciones JavaScript.
 
-También puedes utilizar una [clase de ES6](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes) para definir un componente:
+También puedes utilizar una [clase de ES6](https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Classes) para definir un componente:
+
 
 ```js
 class Welcome extends React.Component {
@@ -45,7 +45,7 @@ class Welcome extends React.Component {
 
 Los dos componentes anteriores son equivalentes desde el punto de vista de React.
 
-Las clases tienen algunas características adicionales que veremos en las [próximas secciones](/docs/state-and-lifecycle.html). Hasta entonces, usaremos componentes funcionales por su concisión.
+Las clases tienen algunas características adicionales que veremos en las [próximas secciones](/docs/state-and-lifecycle.html). Hasta entonces, usaremos componentes funcionales por su brevedad.
 
 ## Renderizando un Componente
 
@@ -86,7 +86,7 @@ Recapitulemos lo que sucede en este ejemplo:
 3. Nuestro componente `Welcome` devuelve un elemento `<h1>Hello, Sara</h1>` como resultado.
 4. React DOM actualiza eficientemente el DOM para que coincida con `<h1>Hello, Sara</h1>`.
 
-> **Nota:** Comienza siempre los nombres de componentes con una letra mayúscula
+> **Nota:** Comienza siempre los nombres de componentes con una letra mayúscula.
 > 
 >React trata los componentes que empiezan con letras minúsculas como etiquetas del DOM. Por ejemplo, `<div />` representa una etiqueta div HTML pero `<Welcome />` representa un componente y requiere que `Welcome` esté en scope.
 > 

From 263de9784617e763719354432280ab710c57e8a9 Mon Sep 17 00:00:00 2001
From: Ezequiel Monforte <ezequielmonforte@gmail.com>
Date: Fri, 1 Feb 2019 21:18:26 -0300
Subject: [PATCH 11/11] all changes applied-2

---
 content/docs/components-and-props.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index a2f239b45..7dd6df08f 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -234,7 +234,7 @@ function Comment(props) {
 
 [](codepen://components-and-props/extracting-components-continued)
 
-Extraer componentes puede parecer un trabajo pesado al principio, pero tener una paleta de componentes reutilizables vale la pena en aplicaciones más grandes. Una buena regla en general es que si una parte de su UI se usa varias veces (`Button`, `Panel`, `Avatar`), o es lo suficientemente compleja por sí misma (`App`, `FeedStory`, `Comment`), es buen candidato para ser un componente reutilizable.
+Extraer componentes puede parecer un trabajo pesado al principio, pero tener una paleta de componentes reutilizables vale la pena en aplicaciones más grandes. Una buena regla en general es que si una parte de su UI se usa varias veces (`Button`, `Panel`, `Avatar`), o es lo suficientemente compleja por si misma (`App`, `FeedStory`, `Comment`), es buen candidato para ser un componente reutilizable.
 
 ## Las props son de solo lectura