From 84727cfbc2a08fea1d805f22374338d79bc9d278 Mon Sep 17 00:00:00 2001 From: Michell Ayala Date: Mon, 4 Mar 2019 12:46:48 -0600 Subject: [PATCH 01/23] translate: why we buit react? --- content/blog/2013-06-05-why-react.md | 131 ++++++++++++++------------- 1 file changed, 67 insertions(+), 64 deletions(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index 6c23552a1..a6f024e45 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -1,88 +1,91 @@ --- -title: Why did we build React? +title: ¿Por qué contruimos React? author: [petehunt] --- -There are a lot of JavaScript MVC frameworks out there. Why did we build React -and why would you want to use it? +Hay muchos frameworks MVC para JavaScript. ¿Por qué construimos React y por qué +querías usarlo? -## React isn't an MVC framework. {#react-isnt-an-mvc-framework} +## React no es un framework MVC. {#react-isnt-an-mvc-framework} -React is a library for building composable user interfaces. It encourages -the creation of reusable UI components which present data that changes over -time. +React es una librería para construir _composable UIs_. Fomenta la creación de +componentes reutlizables para interfaces de usuario que muestran datos que +cambian con el tiempo. -## React doesn't use templates. {#react-doesnt-use-templates} +## React no usa templates. {#react-doesnt-use-templates} -Traditionally, web application UIs are built using templates or HTML directives. -These templates dictate the full set of abstractions that you are allowed to use -to build your UI. +Tradicionalmente, las interfaces de usuario para aplicaciones web se crean +utilizando _templates_ o directivas HTML. Estas _templates_ dictan el conjunto +completo de abstracciones que se permiten usar para crear tus interfaces de usuario. -React approaches building user interfaces differently by breaking them into -**components**. This means React uses a real, full featured programming language -to render views, which we see as an advantage over templates for a few reasons: +React se enfoca en la construcción de interfaces de usuario de forma diferente +al dividirlos en **componentes**. Esto significa que React utiliza un lenguaje de +programación real y completo para _renderizar_ vistats, lo que vemos como una +ventaja sobre los _templates_ por varias razones: -- **JavaScript is a flexible, powerful programming language** with the ability - to build abstractions. This is incredibly important in large applications. -- By unifying your markup with its corresponding view logic, React can actually - make views **easier to extend and maintain**. -- By baking an understanding of markup and content into JavaScript, there's - **no manual string concatenation** and therefore less surface area for XSS - vulnerabilities. +- **JavaScript es un lenguaje de programación flexible y potente** con la capacidad + de crear abstracciones. Esto es increíblement importante en aplicaciones grandes. +- Al unificar el _markup_ con la lógica en vista correspondiente, React puede + hacer a las vistas **facil de extender y mantener**. +- Al integrar la comprensión del _markup_ y su contenido dentro de JavaScript, + no hay **concatenación de string manual** y por tanto menos menos superficie + para vulnerabilidades XSS. -We've also created [JSX](/docs/jsx-in-depth.html), an optional syntax -extension, in case you prefer the readability of HTML to raw JavaScript. +También hemos creado [JSX](/docs/jsx-in-depth.html), una extensión de sintaxís +opcional, en caso de que prefieras la legibilidad de HTML a JavaScript en bruto. -## Reactive updates are dead simple. {#reactive-updates-are-dead-simple} +## Las ctualizaciones reactivas son muy simples. {#reactive-updates-are-dead-simple} -React really shines when your data changes over time. +React realmente brilla cuando sus datos se modifican con el tiempo. -In a traditional JavaScript application, you need to look at what data changed -and imperatively make changes to the DOM to keep it up-to-date. Even AngularJS, -which provides a declarative interface via directives and data binding [requires -a linking function to manually update DOM nodes](https://code.angularjs.org/1.0.8/docs/guide/directive#reasonsbehindthecompilelinkseparation). +En una aplicación de JavaScript tradicional, debes tomar en cuenta qué datos han +cambiado y realizar cambios de forma imperativa en el DOM para mantenerlos actualizados. +Incluso AngularJS, que proporciona una interfaz declarativa a través de directivas +y _binding_ de datos [require una función que enlace manualmente los cambios a los nodos del DOM](https://code.angularjs.org/1.0.8/docs/guide/directive#reasonsbehindthecompilelinkseparation). -React takes a different approach. +React adopta un enfoque diferente. -When your component is first initialized, the `render` method is called, -generating a lightweight representation of your view. From that representation, -a string of markup is produced, and injected into the document. When your data -changes, the `render` method is called again. In order to perform updates as -efficiently as possible, we diff the return value from the previous call to -`render` with the new one, and generate a minimal set of changes to be applied -to the DOM. +Cuando un componente se inicializa por primera vez, el método `render` es invocado +generando una representación ligera de tu vista. A partir de esa representación, +se produce una cadena de _markup_ es producida, e injectada en el documento. +Cuando tus datos cambian, se vuelve a llamar el método `render`. Para realizar +las actualizaciones de la manera más eficiente posible, diferenciamos el valor +de retorno de la llamada anterior para procesar con el nuevo, y generamos un +conjunto mínimo de cambios que se aplicarán al DOM. -> The data returned from `render` is neither a string nor a DOM node -- it's a -> lightweight description of what the DOM should look like. +> Los datos regresados desde `render` no son ni una cadena de texto ni un nodo +> del dom -- son una descripción ligera de cómo debería verse el dom -We call this process **reconciliation**. Check out -[this jsFiddle](http://jsfiddle.net/2h6th4ju/) to see an example of -reconciliation in action. +A este proceso lo llamamos **reconciliación**. Echale un vistazo a [este jsFiddle](http://jsfiddle.net/2h6th4ju/) +para ver un ejemplo de reconciliación en acción. -Because this re-render is so fast (around 1ms for TodoMVC), the developer -doesn't need to explicitly specify data bindings. We've found this approach -makes it easier to build apps. +Debido a que esta nueva re-renderización es tan rápida (al rededor de 1ms para TodoMVC), +el desarrollador no necesita especificar explícitamente los _bindings_ de datos. +Nos hemos dado cuenta que este enfoque facilita la creación de aplicaciones. -## HTML is just the beginning. {#html-is-just-the-beginning} +## HTML es solo el comienzo. {#html-is-just-the-beginning} -Because React has its own lightweight representation of the document, we can do -some pretty cool things with it: +Debido a que React tiene su propia representación ligera del documento, podemos +hacer algunas cosas muy interesantes con él: -- Facebook has dynamic charts that render to `` instead of HTML. -- Instagram is a "single page" web app built entirely with React and - `Backbone.Router`. Designers regularly contribute React code with JSX. -- We've built internal prototypes that run React apps in a web worker and use - React to drive **native iOS views** via an Objective-C bridge. -- You can run React - [on the server](https://github.com/petehunt/react-server-rendering-example) - for SEO, performance, code sharing and overall flexibility. -- Events behave in a consistent, standards-compliant way in all browsers - (including IE8) and automatically use - [event delegation](http://davidwalsh.name/event-delegate). +- Facebook tiene gráficas dinámicas que se _renderizan_ en un `` en lugar + de HTML. +- Instagram es una aplicación web _"single page"_ construida completamente con + React y `Backbone.Router`. Los diseñadores contribuyen regularmente con código + React con JSX. +- Hemos creado prototipos internos que ejecutan las aplicaciones React en un web + worker y usan React para impulsar las **vistas nativas de iOS** a través de un + puente en Objective-C. +- Puedes ejecutar React + [en el servidor](https://github.com/petehunt/react-server-rendering-example) + para favorecer SEO, desempeño, compartir código y sobre todo flexibilidad. +- Los eventos se comportan de manera coherente y compatible con losestándares + en todos los navegadores (incluyendo IE8) y utilizan automáticamente la + [delegación de eventos](http://davidwalsh.name/event-delegate). -Head on over to [https://reactjs.org](https://reactjs.org) to check out what we have -built. Our documentation is geared towards building apps with the framework, -but if you are interested in the nuts and bolts -[get in touch](/support.html) with us! +Dirígete a [https://reactjs.org](https://reactjs.org) para ver lo que hemos +construido. Nuestra documentación está orientada a crear aplicaciones con el +framework, pero si estás interesado en todos los detalles, ¡[ponte en contacto](/support.html) + con nosotros! -Thanks for reading! +¡Gracias por leer! From 660a4c26d4ae1fcd0f405f1ea3cf13dbe8e82b39 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 09:52:37 -0600 Subject: [PATCH 02/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index a6f024e45..7168e3057 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -4,7 +4,7 @@ author: [petehunt] --- Hay muchos frameworks MVC para JavaScript. ¿Por qué construimos React y por qué -querías usarlo? +querrías usarlo? ## React no es un framework MVC. {#react-isnt-an-mvc-framework} From 775bcc8cece83e98ffe079155cf672b005720e44 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 09:53:13 -0600 Subject: [PATCH 03/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index 7168e3057..7838eba66 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -8,7 +8,7 @@ querrías usarlo? ## React no es un framework MVC. {#react-isnt-an-mvc-framework} -React es una librería para construir _composable UIs_. Fomenta la creación de +React es una biblioteca para construir interfaces de usuario componibles. Fomenta la creación de componentes reutlizables para interfaces de usuario que muestran datos que cambian con el tiempo. From 25e61c5ed9f9c78095c7d8abccbd8f03640e2435 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 09:53:32 -0600 Subject: [PATCH 04/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index 7838eba66..f50742b41 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -19,7 +19,7 @@ utilizando _templates_ o directivas HTML. Estas _templates_ dictan el conjunto completo de abstracciones que se permiten usar para crear tus interfaces de usuario. React se enfoca en la construcción de interfaces de usuario de forma diferente -al dividirlos en **componentes**. Esto significa que React utiliza un lenguaje de +al dividirlas en **componentes**. Esto significa que React utiliza un lenguaje de programación real y completo para _renderizar_ vistats, lo que vemos como una ventaja sobre los _templates_ por varias razones: From 80805f717c96cd85cb1f2ee889cbc51d9587df84 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 09:53:50 -0600 Subject: [PATCH 05/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index f50742b41..80f5a12c9 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -12,7 +12,7 @@ React es una biblioteca para construir interfaces de usuario componibles. Foment componentes reutlizables para interfaces de usuario que muestran datos que cambian con el tiempo. -## React no usa templates. {#react-doesnt-use-templates} +## React no usa plantillas {#react-doesnt-use-templates} Tradicionalmente, las interfaces de usuario para aplicaciones web se crean utilizando _templates_ o directivas HTML. Estas _templates_ dictan el conjunto From 5cbd445fbac44362184e32eaa7469449ce2548d6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 09:54:18 -0600 Subject: [PATCH 06/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index 80f5a12c9..179993dfb 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -26,7 +26,7 @@ ventaja sobre los _templates_ por varias razones: - **JavaScript es un lenguaje de programación flexible y potente** con la capacidad de crear abstracciones. Esto es increíblement importante en aplicaciones grandes. - Al unificar el _markup_ con la lógica en vista correspondiente, React puede - hacer a las vistas **facil de extender y mantener**. + hacer a las vistas **fácil de extender y mantener**. - Al integrar la comprensión del _markup_ y su contenido dentro de JavaScript, no hay **concatenación de string manual** y por tanto menos menos superficie para vulnerabilidades XSS. From d8d0ddb5093f41ed93737a4d597a2b40eadb04e7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 09:54:31 -0600 Subject: [PATCH 07/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index 179993dfb..ca99057bd 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -31,7 +31,7 @@ ventaja sobre los _templates_ por varias razones: no hay **concatenación de string manual** y por tanto menos menos superficie para vulnerabilidades XSS. -También hemos creado [JSX](/docs/jsx-in-depth.html), una extensión de sintaxís +También hemos creado [JSX](/docs/jsx-in-depth.html), una extensión de sintaxis opcional, en caso de que prefieras la legibilidad de HTML a JavaScript en bruto. ## Las ctualizaciones reactivas son muy simples. {#reactive-updates-are-dead-simple} From 457236ce48e507ec3e702c385fc3091dc94d8199 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 09:54:47 -0600 Subject: [PATCH 08/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index ca99057bd..9eba2d65b 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -32,7 +32,7 @@ ventaja sobre los _templates_ por varias razones: para vulnerabilidades XSS. También hemos creado [JSX](/docs/jsx-in-depth.html), una extensión de sintaxis -opcional, en caso de que prefieras la legibilidad de HTML a JavaScript en bruto. +opcional, en caso de que prefieras la legibilidad de HTML a JavaScript simple. ## Las ctualizaciones reactivas son muy simples. {#reactive-updates-are-dead-simple} From 22eccbaec3d1ab46d2aa4950ea2e6ebe5fbf8792 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 09:54:57 -0600 Subject: [PATCH 09/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index 9eba2d65b..0f962966b 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -48,7 +48,7 @@ React adopta un enfoque diferente. Cuando un componente se inicializa por primera vez, el método `render` es invocado generando una representación ligera de tu vista. A partir de esa representación, se produce una cadena de _markup_ es producida, e injectada en el documento. -Cuando tus datos cambian, se vuelve a llamar el método `render`. Para realizar +Cuando tus datos cambian, se vuelve a llamar al método `render`. Para realizar las actualizaciones de la manera más eficiente posible, diferenciamos el valor de retorno de la llamada anterior para procesar con el nuevo, y generamos un conjunto mínimo de cambios que se aplicarán al DOM. From df0110785a4d6110dae34f39d512ef7ff0672ad1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 09:55:27 -0600 Subject: [PATCH 10/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index 0f962966b..86bd3d195 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -54,7 +54,7 @@ de retorno de la llamada anterior para procesar con el nuevo, y generamos un conjunto mínimo de cambios que se aplicarán al DOM. > Los datos regresados desde `render` no son ni una cadena de texto ni un nodo -> del dom -- son una descripción ligera de cómo debería verse el dom +> del DOM: son una descripción ligera de cómo debería verse el DOM. A este proceso lo llamamos **reconciliación**. Echale un vistazo a [este jsFiddle](http://jsfiddle.net/2h6th4ju/) para ver un ejemplo de reconciliación en acción. From 395c1097ab36ded3e9133cae8dce8d62414db254 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 10:03:37 -0600 Subject: [PATCH 11/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index 86bd3d195..0f4d072db 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -63,7 +63,7 @@ Debido a que esta nueva re-renderización es tan rápida (al rededor de 1ms para el desarrollador no necesita especificar explícitamente los _bindings_ de datos. Nos hemos dado cuenta que este enfoque facilita la creación de aplicaciones. -## HTML es solo el comienzo. {#html-is-just-the-beginning} +## HTML es solo el comienzo {#html-is-just-the-beginning} Debido a que React tiene su propia representación ligera del documento, podemos hacer algunas cosas muy interesantes con él: From 2e15e187ff769b11b540efa62dcba2c1ae3990ea Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 10:03:46 -0600 Subject: [PATCH 12/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index 0f4d072db..73df9b2f7 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -6,7 +6,7 @@ author: [petehunt] Hay muchos frameworks MVC para JavaScript. ¿Por qué construimos React y por qué querrías usarlo? -## React no es un framework MVC. {#react-isnt-an-mvc-framework} +## React no es un framework MVC {#react-isnt-an-mvc-framework} React es una biblioteca para construir interfaces de usuario componibles. Fomenta la creación de componentes reutlizables para interfaces de usuario que muestran datos que From 2e6056673a3af44134f7ad6d3ffe2e727183c836 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 10:04:11 -0600 Subject: [PATCH 13/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index 73df9b2f7..5001caff7 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -34,7 +34,7 @@ ventaja sobre los _templates_ por varias razones: También hemos creado [JSX](/docs/jsx-in-depth.html), una extensión de sintaxis opcional, en caso de que prefieras la legibilidad de HTML a JavaScript simple. -## Las ctualizaciones reactivas son muy simples. {#reactive-updates-are-dead-simple} +## Las actualizaciones reactivas son muy simples {#reactive-updates-are-dead-simple} React realmente brilla cuando sus datos se modifican con el tiempo. From 95ee19df8d9e5b0c1d3ce71bf09e71b7c85f2173 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 10:04:36 -0600 Subject: [PATCH 14/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index 5001caff7..e1bdfd935 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -9,7 +9,7 @@ querrías usarlo? ## React no es un framework MVC {#react-isnt-an-mvc-framework} React es una biblioteca para construir interfaces de usuario componibles. Fomenta la creación de -componentes reutlizables para interfaces de usuario que muestran datos que +componentes reutilizables para interfaces de usuario que muestran datos que cambian con el tiempo. ## React no usa plantillas {#react-doesnt-use-templates} From ef9e1ca8379e3c11099a004dc154e16e67861073 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 10:04:44 -0600 Subject: [PATCH 15/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index e1bdfd935..466650abe 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -15,7 +15,7 @@ cambian con el tiempo. ## React no usa plantillas {#react-doesnt-use-templates} Tradicionalmente, las interfaces de usuario para aplicaciones web se crean -utilizando _templates_ o directivas HTML. Estas _templates_ dictan el conjunto +utilizando plantillas o directivas HTML. Estas plantillas dictan el conjunto completo de abstracciones que se permiten usar para crear tus interfaces de usuario. React se enfoca en la construcción de interfaces de usuario de forma diferente From f857f7ffcf52b1dc2e50ead448950b99cd84c0c1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 10:04:52 -0600 Subject: [PATCH 16/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index 466650abe..470e84039 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -20,7 +20,7 @@ completo de abstracciones que se permiten usar para crear tus interfaces de usua React se enfoca en la construcción de interfaces de usuario de forma diferente al dividirlas en **componentes**. Esto significa que React utiliza un lenguaje de -programación real y completo para _renderizar_ vistats, lo que vemos como una +programación real y completo para _renderizar_ vistas, lo que vemos como una ventaja sobre los _templates_ por varias razones: - **JavaScript es un lenguaje de programación flexible y potente** con la capacidad From efee874129d726dcf67e84fd380e6935019fafc0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 10:05:02 -0600 Subject: [PATCH 17/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index 470e84039..53700fa22 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -28,7 +28,7 @@ ventaja sobre los _templates_ por varias razones: - Al unificar el _markup_ con la lógica en vista correspondiente, React puede hacer a las vistas **fácil de extender y mantener**. - Al integrar la comprensión del _markup_ y su contenido dentro de JavaScript, - no hay **concatenación de string manual** y por tanto menos menos superficie + no hay **concatenación manual de string** y por tanto menos menos espacio para vulnerabilidades XSS. También hemos creado [JSX](/docs/jsx-in-depth.html), una extensión de sintaxis From 36b9f8eb1ac84bef5d7c4fe47113851c09130650 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 10:05:09 -0600 Subject: [PATCH 18/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index 53700fa22..f864a8bef 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -21,7 +21,7 @@ completo de abstracciones que se permiten usar para crear tus interfaces de usua React se enfoca en la construcción de interfaces de usuario de forma diferente al dividirlas en **componentes**. Esto significa que React utiliza un lenguaje de programación real y completo para _renderizar_ vistas, lo que vemos como una -ventaja sobre los _templates_ por varias razones: +ventaja sobre las plantillas por varias razones: - **JavaScript es un lenguaje de programación flexible y potente** con la capacidad de crear abstracciones. Esto es increíblement importante en aplicaciones grandes. From c8515a85b8ff3b9337441c32a84c9d377d616fc7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 10:05:18 -0600 Subject: [PATCH 19/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index f864a8bef..bd3e1a3e0 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -79,7 +79,7 @@ hacer algunas cosas muy interesantes con él: - Puedes ejecutar React [en el servidor](https://github.com/petehunt/react-server-rendering-example) para favorecer SEO, desempeño, compartir código y sobre todo flexibilidad. -- Los eventos se comportan de manera coherente y compatible con losestándares +- Los eventos se comportan de manera coherente y compatible con los estándares en todos los navegadores (incluyendo IE8) y utilizan automáticamente la [delegación de eventos](http://davidwalsh.name/event-delegate). From 6efceacec275abcab6cdc715fde2b80e5d276af5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 10:05:30 -0600 Subject: [PATCH 20/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index bd3e1a3e0..3634493e2 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -70,7 +70,7 @@ hacer algunas cosas muy interesantes con él: - Facebook tiene gráficas dinámicas que se _renderizan_ en un `` en lugar de HTML. -- Instagram es una aplicación web _"single page"_ construida completamente con +- Instagram es una aplicación web "de una sola página" construida completamente con React y `Backbone.Router`. Los diseñadores contribuyen regularmente con código React con JSX. - Hemos creado prototipos internos que ejecutan las aplicaciones React en un web From 1cb17a45760661e3d9d84d89c4e08e3b70f81b9f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 10:05:38 -0600 Subject: [PATCH 21/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index 3634493e2..de8837560 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -59,7 +59,7 @@ conjunto mínimo de cambios que se aplicarán al DOM. A este proceso lo llamamos **reconciliación**. Echale un vistazo a [este jsFiddle](http://jsfiddle.net/2h6th4ju/) para ver un ejemplo de reconciliación en acción. -Debido a que esta nueva re-renderización es tan rápida (al rededor de 1ms para TodoMVC), +Debido a que esta nueva rerenderización es tan rápida (alrededor de 1ms para TodoMVC), el desarrollador no necesita especificar explícitamente los _bindings_ de datos. Nos hemos dado cuenta que este enfoque facilita la creación de aplicaciones. From 7aff21733089113255d89a531474e8ea6ecd7a0b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 10:05:43 -0600 Subject: [PATCH 22/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index de8837560..8baf66a5a 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -56,7 +56,7 @@ conjunto mínimo de cambios que se aplicarán al DOM. > Los datos regresados desde `render` no son ni una cadena de texto ni un nodo > del DOM: son una descripción ligera de cómo debería verse el DOM. -A este proceso lo llamamos **reconciliación**. Echale un vistazo a [este jsFiddle](http://jsfiddle.net/2h6th4ju/) +A este proceso lo llamamos **reconciliación**. Échale un vistazo a [este jsFiddle](http://jsfiddle.net/2h6th4ju/) para ver un ejemplo de reconciliación en acción. Debido a que esta nueva rerenderización es tan rápida (alrededor de 1ms para TodoMVC), From 7a3a41db4e60ca2112bcb17123d23d8727b062e7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rainer=20Mart=C3=ADnez=20Fraga?= Date: Wed, 6 Mar 2019 10:05:52 -0600 Subject: [PATCH 23/23] Update content/blog/2013-06-05-why-react.md Co-Authored-By: mishelashala --- content/blog/2013-06-05-why-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-05-why-react.md b/content/blog/2013-06-05-why-react.md index 8baf66a5a..104cf473d 100644 --- a/content/blog/2013-06-05-why-react.md +++ b/content/blog/2013-06-05-why-react.md @@ -47,7 +47,7 @@ React adopta un enfoque diferente. Cuando un componente se inicializa por primera vez, el método `render` es invocado generando una representación ligera de tu vista. A partir de esa representación, -se produce una cadena de _markup_ es producida, e injectada en el documento. +se produce una cadena de _markup_, e inyectada en el documento. Cuando tus datos cambian, se vuelve a llamar al método `render`. Para realizar las actualizaciones de la manera más eficiente posible, diferenciamos el valor de retorno de la llamada anterior para procesar con el nuevo, y generamos un