Qué es React y los 3 principios para implementarlo correctamente

Autor: | Última modificación: 24 de abril de 2024 | Tiempo de Lectura: 3 minutos
Temas en este post:

Algunos de nuestros reconocimientos:

Premios KeepCoding

Si quieres saber qué es React, cuáles son sus características y cómo evitar su aplicación inadecuada, en este post descubrirás todo para iniciar con esta herramienta. En menos de una década, esta biblioteca Javascript se ha convertido en una de las más populares del mundo de la programación, implementada en plataformas como Netflix, Yahoo y Airbnb. ¿Quieres entender el por qué? Sigue leyendo.

Para contarnos las razones de su éxito, nos hemos puesto en contacto con Patriciu Nista, desarrollador front-end en Adevinta Spain, la empresa tecnológica que se esconde detrás de portales como InfoJobs, Mil anuncios o Fotocasa. En este webinar, nuestro invitado nos ayuda a descifrar qué es React y cuáles son sus componentes y anti-componentes.

¿Qué es React y cómo funciona?

React es una de las tecnologías de desarrollo de interfaz de usuario más populares del momento, siendo la segunda librería más usada después de jQuery, y la que está experimentando más crecimiento en el mercado. Según los últimos datos de la encuesta anual del StackOverflow, el 35.9% de los desarrolladores hacen uso de esta librería JavaScript.

Ideada por un ingeniero de Facebook en 2013, React se ha creado especialmente para aplicaciones de interfaz de usuario. Es una librería, y no un framework, que está formada por componentes que dependen de un estado. Cuando este último varía, se genera una nueva página HTML.

Entre las características fundamentales para entender qué es React destaca su flujo de datos unidireccional, de arriba a abajo; el uso de virtual DOM, es decir, la recreación ideal del comportamiento de un usuario; y la posibilidad de programar con clases y funciones.

Los 3 factores a tener en cuenta para optimizar el uso de React

🔴 ¿Quieres entrar de lleno al Desarrollo Mobile? 🔴

Descubre el Desarrollo de Apps Móviles Full Stack Bootcamp de KeepCoding. La formación más completa del mercado y con empleabilidad garantizada

👉 Prueba gratis el Bootcamp en Desarrollo de Apps Móviles por una semana

El éxito de React se justifica en su adaptabilidad y performance, gracias a funcionalidades como la visualización de la reacción ideal de los usuarios. Si bien hay diferentes formas de sacarle provecho a su potencial, hay algunas claves que se deberían considerar para evitar la aparición de lo que nuestro invitado denomina anti-componentes.

En sus propias palabras, con anti-componente se refiere a “un componente que en un inicio parece que resuelve nuestro problema, pero que al no ser implementado correctamente, causa bugs”. Y, según nuestro ponente, para esquivar este tipo de código engañoso, hay que seguir estos tres principios:

  1. No parar el flujo de datos. En concreto, no es recomendable interrumpir este flujo si queremos renderizar condicionalmente, realizar peticiones o optimizar el renderizado.
  2. Estar siempre preparado para renderizar. La ventaja de React es que nos permite implementar cómo queremos que se vea la interfaz en todo momento sin preocuparnos del tiempo. Aún así, hay que estar listo para renderizar en cualquier instante.
  3. Mantener el estado local aislado. Para ello, es importante analizar el uso del estado frecuentemente y valorar, en cada caso, si tiene que ser local o global.

En definitiva, entendiendo qué es React, lo que motivó su creación y poniendo en práctica los 3 principios que se acaban de resaltar, se puede sacar todo el jugo a esta tecnología. Si te has quedado con ganas de ver más ejemplos reales de los principios y funcionalidades mencionadas implantados en el código, te animamos a que le eches un vistazo al webinar.

Asimismo, si te llama la atención el mundo de la programación en general, más allá de qué es React y sus componentes, en KeepCoding tenemos lo que necesitas.

Conviértete en un desarrollador profesional, tengas el nivel que tengas, con nuestros Aprende a Programar desde Cero Full Stack Jr. Bootcamp, Desarrollo Web Full Stack Bootcamp y Desarrollo de Apps Móviles Full Stack Bootcamp.

 

YouTube video

Posts Relacionados

¡CONVOCATORIA ABIERTA!

Desarrollo de apps móviles ios & Android

Full Stack Bootcamp

Clases en Directo | Profesores en Activo | Temario 100% actualizado