Merge pull request 4GeeksAcademy#37 from ElviraQDP/master

consistency

Author: alesanchezr

exercises/01-welcome/README.es.md

@@ -2,9 +2,9 @@
 
 # `01` Bienvenid@
 
-Mi nombre es Alejandro Sanchez [@alesanchezr](https://twitter.com/alesanchezr). ¡¡ Estoy muy emocionado por tenerte aquí !! 🎉 😂
-Aprender a programar es duro, necesitas un coach! Escíbeme en twitter si tienes preguntas.
-
+Mi nombre es Alejandro Sanchez [@alesanchezr](https://twitter.com/alesanchezr).  ¡¡ Estoy muy emocionado por tenerte aquí !! 🎉 😂
+Aprender a programar es duro ¡necesitas un coach! Mándame un DM por twitter si tienes preguntas.
+ 
 Durante este curso aprenderás los siguientes conceptos:
 
 1. **Usar JSX**: Una gran sintaxis propuesta por Facebook que mezcla HTML y JS en el mismo documento para ayudarte a escribir HTML dinámico.

exercises/01.1-hello-world/README.es.md

@@ -2,9 +2,9 @@
 
 El mayor dolor de los desarrolladores front-end es **trabajar con el DOM** para crear HTML dinámico, algo que React.js hace de lo mejor.
 
-React.js es una biblioteca de renderizado hecha para optimizar el DOM: Los programadores ahorran tiempo y el navegador es más rápido.
+React.js es una librería de renderizado hecha para optimizar el DOM: Los programadores ahorran tiempo y el navegador es más rápido.
 
-La biblioteca viene con una función llamada **ReactDOM.render** que tú puedes ver como un reemplazo de la clásica [propiedad innerHTML](https://www.w3schools.com/jsref/prop_html_innerhtml.asp).
+La librería viene con una función llamada **ReactDOM.render** que tú puedes ver como un reemplazo de la clásica [propiedad innerHTML](https://www.w3schools.com/jsref/prop_html_innerhtml.asp).
 
 `ReactDOM.render` recibe dos parámetros:
 
@@ -14,25 +14,25 @@ La biblioteca viene con una función llamada **ReactDOM.render** que tú puedes
 Por ejemplo:
 
 ```js
-import React from 'react'; //import the react library
-import ReactDOM from 'react-dom'; //import react-dom to make react generate html
+import React from 'react'; //importar la librería de react
+import ReactDOM from 'react-dom'; //importar react-dom para que react genere el html
 
-// WHAT: This variable contains all the HTML that will be rendered
+// QUE: Esta variable contiene todo el HTML que va a ser renderizado
 let output = <span>James is 12 years old</span>
 
-// WHERE: A DOM element that will contain the entire react generated html
+// DONDE: Un elemento DOM que contendrá todo el html generado por react
 const myDiv = document.querySelector('#myDiv');
 
- //what  //where
+ //que //donde
 ReactDOM.render(output, myDiv);
 ```
 
 La función `ReactDOM.render` establecerá el innerHTML de `myDiv` (un elemento DOM) para ser lo que sea que contenga la variable `output`, muy similar a como funciona `innerHTML`:
 ```js
-//This is how you would do it without react.
+//Así lo harías sin react
 myDiv.innerHTML = '<span>James is 12 years old</span>';
 
-// This is not you would do it with react.
+// así lo haces con react
 ReactDOM.render(<span> James is 12 years old </span>, myDiv);
 ```
 

exercises/01.2-hello-jsx/README.es.md

@@ -6,7 +6,7 @@ JSX también te permite incluir variables en el HTML fácilmente. Por ejemplo, a
 let age = 12;
 ```
 
-Si quieres incluir tu variable en tu código HTML dinámicamente, puedes hacerlo como sigue:
+Si quieres incluir tu variable en tu código HTML dinámicamente, puedes hacerlo así:
 ```jsx
 let output = <span> James is { age } years old </span>
 ```
@@ -15,9 +15,9 @@ Fíjate en la posición de las llave `{` y `}` envolviendo la variable.
 Entonces, podemos renderizar todo en contenido del sitio web usando `ReactDOM.render` así:
 
 ```jsx
-// use react-dom to render it into the DOM
+// usa react-dom para renderizarlo en el DOM
 import ReactDOM from 'react-dom';
- //render output  //inside the innerHTML of #myDiv
+ //renderizar output //dentro del innerHTML de #myDiv
 ReactDOM.render(output, document.querySelector('#myDiv'));
 ```
 
@@ -28,10 +28,10 @@ El documento HTML resultante se verá así:
 </div>
 ```
 
-Basicamente, ahora somos capaces de mezclar HTML y JS en el mismo documento sin tener que concatenar y usar strings. :smiley: ¡Interesante! :angry: ¿Verdad?
+Básicamente, ahora somos capaces de mezclar HTML y JS en el mismo documento sin tener que concatenar y usar strings. :smiley: ¡Increíble! :angry: ¿Verdad?
 
 ## :speech_balloon: Instrucciones
 
 El archivo index.js tiene una variable llamada `name` que puede contener un nombre.
 
-Por favor, incluye esa variable dentro de la salida de react, reemplaza la variable con el `"James"`.
+Por favor, incluye esa variable dentro del resultado(output) de react, reemplaza la variable con el `"James"`.

exercises/01.3-rendering-from-objects/README.es.md

@@ -12,7 +12,7 @@ const customer = {
 Para obtener cualquier propiedad del objeto `Customer` tenemos que usar el operador punto `.`, así:
 
 ```js
-console.log(customer.first_name); // will print "Bob" on the console.
+console.log(customer.first_name); // imprimirá "Bob" en la consola.
 ```
 
 # :speech_balloon: Instrucciones

exercises/01.4-building-a-layout/README.es.md

@@ -1,4 +1,4 @@
-# `01.4` Construyendo un trazado
+# `01.4` Construyendo un layout(diseño)
 
 Practiquemos un poco más acerca de usar JSX para crear HTML.
 
@@ -38,4 +38,5 @@ Fuente: [Bootstrap Card](https://getbootstrap.com/docs/4.0/components/card/#exam
 
 ### Así es como debería verse el resultado final:
 
-![Bob Dylan Card](https://ucarecdn.com/cc7588d6-6ae4-4b95-aaea-0d46fd4ec72c/)
+![Bob Dylan Card](https://github.com/4GeeksAcademy/react-tutorial-exercises/blob/66b097ba2f1812e3cabcce38566b633edd991638/.learn/assets/1.4-1.png?raw=true)
+

exercises/01.4-building-a-layout/README.md

@@ -42,4 +42,7 @@ Source: [Bootstrap Card](https://getbootstrap.com/docs/4.0/components/card/#exam
 
 ### This is how your end result needs to look like:
 
-![Bob Dylan Card](https://ucarecdn.com/cc7588d6-6ae4-4b95-aaea-0d46fd4ec72c/)
+![Bob Dylan Card](https://github.com/4GeeksAcademy/react-tutorial-exercises/blob/66b097ba2f1812e3cabcce38566b633edd991638/.learn/assets/1.4-1.png?raw=true)
+
+
+

exercises/01.5-building-html-from-arrays/README.es.md

@@ -1,6 +1,6 @@
 # `01.5` Construyendo desde arreglos
 
-Con JSX también puedes crear **arreglos** de elementos HTML. E.g: si tenemos un arreglo de `<li>` podemos incluirlos todos dentro del documento a la vez, así:
+Con JSX también puedes crear **arrays o arreglos** de elementos HTML. Por ejemplo: si tenemos un arreglo de `<li>` podemos incluirlos todos dentro del documento a la vez, así:
 
 ```jsx
 const namesInHTML = [
@@ -15,7 +15,7 @@ const content = <ul>{namesInHTML}</ul>;
 ReactDOM.render(content, document.querySelector("#myDiv"));
 ```
 
-El HTML resultanteen el sitio web sería:
+El HTML resultanteen el sitio web sería así:
 ```html
 <div id="myDiv">
  <ul>
@@ -47,7 +47,10 @@ Digamos que queremos react para renderizar la siguiente salida en el documento:
 
 Actualiza el arreglo `navlinkItems` para hacer el código de salida que queremos.
 
-#### :bulb: Ayuda:
+#### :bulb: Pista:
+
 - Solo tienes que actualizar el arreglo `navlinkItems`, nada más.
-- React te pedirá usar claves en cada elemento del arreglo, [puedes leer más al respecto aquí](https://reactjs.org/docs/lists-and-keys.html#keys).
+
+- React te pedirá usar keys en cada elemento del arreglo, [puedes leer más al respecto aquí](https://reactjs.org/docs/lists-and-keys.html#keys).
+
 - Recuerda usar `className` en lugar de `class`.

exercises/02-maping-array-to-li/README.es.md

@@ -8,7 +8,7 @@ const animals = [ 'Horse', 'Turtle', 'Elephan', 'Monkey' ];
 
 # :speech_balloon: Instrucciones
 
-Actualiza la [función .map](https://medium.com/poka-techblog/simplify-your-javascript-use-map-reduce-and-filter-bd02c593cc2d) del código para crear un nuevo arreglo de `<li>` donde cada uno de ellos corresponde a un animal desde el arreglo original, el arreglo resultante debería ser algo como esto:
+Actualiza la [función .map](https://medium.com/poka-techblog/simplify-your-javascript-use-map-reduce-and-filter-bd02c593cc2d) del código para crear un nuevo arreglo de `<li>` donde cada uno de ellos corresponde a un animal del arreglo original, el arreglo resultante debería ser algo como esto:
 
 ```jsx
 const animalsInHTML = [
@@ -25,4 +25,4 @@ Luego, inclúyelos juntos en el sitio web.
 
 - Puedes usar el segundo parámetro de la función map como clave `key` para identificar de forma única cada elemento HTML.
 
-Tu sitio web debería verse algo así: ![LIs](https://ucarecdn.com/773cea7c-acab-46f2-b8af-d03911bbfe24/)
+Tu sitio web debería verse algo así: ![LIs](https://github.com/4GeeksAcademy/react-tutorial-exercises/blob/66b097ba2f1812e3cabcce38566b633edd991638/.learn/assets/02-1.png?raw=true)

exercises/02-maping-array-to-li/README.md

@@ -29,4 +29,4 @@ And include them all together inside the website.
 
 - You can use the second parameter of the map function as a `key` to uniquely identify each html item.
 
-Your website should look like this: ![LIs](https://ucarecdn.com/773cea7c-acab-46f2-b8af-d03911bbfe24/)
+Your website should look like this: ![LIs](https://github.com/4GeeksAcademy/react-tutorial-exercises/blob/66b097ba2f1812e3cabcce38566b633edd991638/.learn/assets/02-1.png?raw=true)

exercises/02.1-maping-array-objects-to-li/README.es.md

@@ -25,4 +25,4 @@ E inclúyelos juntos en el sitio web.
 
 - Puedes usar el segundo parametro de la función map como una `key` para identificar de forma única cada elemento html.
 
-Tu sitio web debería verse así: ![LIs](https://ucarecdn.com/773cea7c-acab-46f2-b8af-d03911bbfe24/)
+Tu sitio web debería verse así: ![LIs](https://github.com/4GeeksAcademy/react-tutorial-exercises/blob/66b097ba2f1812e3cabcce38566b633edd991638/.learn/assets/02.1-1.png?raw=true)