translate: why we built react?

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é
+querrí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 biblioteca para construir interfaces de usuario componibles. Fomenta la creación de
+componentes reutilizables para interfaces de usuario que muestran datos que
+cambian con el tiempo.
 
-## React doesn't use templates. {#react-doesnt-use-templates}
+## React no usa plantillas {#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 plantillas o directivas HTML. Estas plantillas 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 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 las plantillas 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 **fácil de extender y mantener**.
+- Al integrar la comprensión del _markup_ y su contenido dentro de JavaScript,
+  no hay **concatenación manual de string** y por tanto menos menos espacio
+  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 sintaxis
+opcional, en caso de que prefieras la legibilidad de HTML a JavaScript simple.
 
-## Reactive updates are dead simple. {#reactive-updates-are-dead-simple}
+## Las actualizaciones 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_, 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
+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**. Échale 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 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.
 
-## 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 `<canvas>` 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 `<canvas>` en lugar
+  de HTML.
+- 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
+  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 los está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!