React: una introducción para principiantes

Qué es React

React es una librería de JavaScript para construir interfaces de usuario.

Se basa en una arquitectura de componentes, que pueden contener propiedades individuales, así como su propio estado, con lo cual se pueden reutilizar en diferentes partes de la misma interface, o incluso en interfaces diferentes.

React se puede renderizar en el navegador con la ayuda de otra librería llamada ReactDOM, así como también del el lado del servidor a través de Node.js.

Además también sirve para crear aplicaciones móviles a través del framework React Native.

React fue concebido en el año 2011 dentro del equipo de desarrollo de Facebook, y abierto a la comunidad en Mayo de 2013. Hoy en día es mantenido aún por la red social, además de una amplia comunidad de desarrolladores.

Qué es JSX

JSX es un lenguaje con sintaxis basada en XML (igual que HTML) creada también por el equipo de Facebook, que extiende JavaScript y simplifica la experiencia de desarrollo.

JSX permite crear elementos de DOM con una sintaxis como la de HTML, dentro de JavaScript.

JSX no esta creado para ser funcional exclusivamente a React, ni tampoco es obligatorio usarlo al desarrollar con esta librería. Sin embargo, en el contexto de React, JSX provee una sintaxis amigable para el método React.createElement.

Veamos un ejemplo:

const Titulo = function () {
  return (
    <h1>
      Bienvenido a <strong>JSX</strong>
    </h1>
  )
}

Al ser compilado, este fragmento de código producirá un resultado similar al siguiente:

const Titulo = function () {
  return React.createElement("h1", null, "Bienvenido a ",
  React.createElement("strong", null, "JSX")
  )
}

Por qué elegir React vs. otros frameworks

Existen múltiples criterios posibles para elegir una librería por sobre otra. En términos generales, React es la más popular de las librerías de desarrollo de front-end.

Esto implica que posee una comunidad grande de desarrolladores dedicados a mantenerla, una vasta cantidad de recursos online para aprender a usarla, un sinfín de componentes y módulos que la complementan, y además una amplia demanda en el mercado profesional.

En términos subjetivos, a algunos desarrolladores podrá resultarle mas amigable la sintaxis de React y su experiencia de desarrollo que a otros. La única forma de evaluar tu propia experiencia es conocer el framework y familiarizarte con él para poder decidir si es para ti o no. Mas abajo dejo algunos recursos para comenzar a aprender React gratis.

Por lo demás, hay algunos datos objetivos que nos pueden dar una idea de por qué elegir React como nuestra librería para desarrollar interfaces:

#1 - React es la librería más descargada

Si analizamos el número de descargas de NPM, React tiene una cantidad de descargas considerablemente mayor en comparación con Vue y Angular.

react vs vue vs @angular/core | npm trends

#2 - React es la librería más amada

Según la encuesta de StackOverflow de 2019, React es el framework más amado por los desarrolladores.

Stack Overflow Developer Survey 2019

#3 - React es la librería más buscada

Según las tendencias de búsqueda de Google, React es el framework con más búsquedas en comparación también con Vue y Angular.

Aprender React.js gratis

Posiblemente uno de los mejores recursos para comenzar a aprender React.js gratis sea su tutorial oficial en español.

Tutorial: Introducción a React – React

También hay varias opciones para aprender React.js gratis en inglés:

Cursos – React

freeCodeCamp.org