En este post vamos a ver lo básico para comenzar a desarrollar con React JS.
Qué es: Es una librería de Javascript (no Java) desarrollada por Facebook en 2011.
¿Para qué sirve?: Para desarrollar Interfaces de Usuario más ligeras mediante componentes.
Y… ¿qué es un componente?: El corazón de la funcionalidad de una interfaz creada con react son los componentes que, esencialmente, es una pieza independiente y reusable, de la interfaz de usuario. Entonces con react, creamos un grupo de estos componentes para formar aplicaciones más complejas.
¿Por qué las aplicaciones serían más ligeras?: Por que nuestra aplicación es un árbol de componentes que funciona como réplica de la versión real del DOM, a esta réplica le decimos Virtual DOM y solo se renderizará el componente que así lo requiera, manteniéndose una sincronía con el DOM sin necesidad de cargar todo nuevamente.
¿qué es el DOM?: Describe el modelo de los objetos de un documento web, es decir HTML, XML o XHTML. Puedes checar este artículo al respecto 😊 DOM
Documentación oficial: La documentación oficial, la encuentras aquí REACT JS
Ahora, qué necesitas para comenzar con React JS:
Conocimientos previos:
Debes llevar a la par el conocimiento de HTML, CSS y JavaScript para poder mejorar tu desarrollo con React JS
Configuración de entorno:
-Un editor de código, por ejemplo VS Code
Y ¡Listo!, ya podrás comenzar.
NPM viene junto con Node JS así que en un solo paso tendrás ambos. La aplicación utilizará Node JS para ejecutarse; pero por ahora, no manipularás Node JS directamente, aunque sí NPM. Te explico, NPM nos servirá para gestionar la instalación de otras librerías que completarán la funcionalidad de React JS en tus aplicaciones y Node JS nos permitirá mantener un entorno para que la aplicación arranque y se mantenga funcionando.
Y para que esto sea más sencillo, comenzarás tu primera aplicación instalando un Boilerplate que nos ofrece simplificar el proceso de construcción de nuestra aplicación y para ello nos permite descargar una especie de template o plantilla con la configuración básica para empezar a trabajar sin tener que hacer las configuraciones iniciales desde cero.
Con el siguiente comando podrás crear tu primera aplicación; sustituye my-app por el nombre adecuado que tú quieras:
npx create-react-app my-appAhora ingresarás al directorio donde se creó tu aplicación para que puedas ejecutarla:
cd my-appFinalmente, este comando será con el que arrancarás tu aplicación, y ¡listo!
npm startEste boilerplate no posee configuraciones sobre backend y bases de datos, únicamente ofrece las opciones dedicadas al front-end implementando herramientas como Babel y Webpack, pero no te preocupes, por ahora no necesitas profundizar en ellas.
Aquí puedes conocer sobre más herramientas para iniciar tus aplicaciones con React JS -> React Toolchain
Cuando tu aplicación inicie, podrás ver en tu navegador predeterminado el renderizado de la misma con el nombre que le diste, por ejemplo ‘example-blog-post-1’
Edita el archivo ‘App.js’ que se encuentra dentro del directorio ‘src’ y al guardar podrás recargar los cambios.
Ahora, es momento de experimentar y profundizar más con React JS, nos leemos en el siguiente artículo. 😊
Cesar Flores 
Esther Lopez