React.js: introducción a React.js

Hola, mi nombre es Tony y en. En estas lecciones aprenderá por qué elegir React en lugar de simple. JavaScript en HTML y crea una nueva aplicación React usando Create Utilidad de aplicación React. En esta lección veremos qué es realmente React. y cómo llegó a ser. React es una biblioteca de JavaScript. Es de código abierto, lo que significa que es fuente. Cualquier persona puede acceder y ver el código. Y fue creado por Facebook con. La intención de unificar la web también. Como diseño de interfaz de usuario móvil bajo un mismo paraguas común. De hecho, existe desde hace bastante tiempo con la primera versión de. Reaccionar siendo presentado al público como. Ya en 2013. Sin embargo, desde aproximadamente 2018 ha crecido a pasos agigantados. conduciendo a otros marcos avanzados como NextJS en realidad usando React como base y construyendo sobre la parte superior. De sus ya impresionantes y completas capacidades. React se usa principalmente para aplicaciones dinámicas. Es decir, su contenido cambia a medida que los datos. Detrás de los cambios de interfaz. Ahora con el sitio web estándar de la vieja escuela. No fue el caso. Entonces cada vez que iría un usuario. A una nueva URL asociada con un. Solicitud, se tendría que emitir una nueva solicitud Http y todo de los contenidos que componen la página. Entonces, cada gráfico, todo para el transparencia. menú, la barra lateral, el pie de página. Deben volver a obtenerse desde cero y volver a renderizarse con el tiempo y tiempo otra vez. Si puedes imaginarlo, esto no lo es. Muy eficiente y React resuelve ese problema. Mediante el uso de renderizado parcial e hidratación de datos. Lo que eso significa es que una vez que nuestra plantilla esté cargada en el navegador, sólo el. Se actualizan los datos que varían del estado mostrado actualmente. A diferencia del sitio de la vieja escuela en el que confiaba. El modelo cliente-servidor de la vieja escuela. Lo que eso significa que las únicas partes. Que cambio en la pantalla del usuario son los que se diferencian desde el estado mostrado actualmente. Como tal, navegar de una página a otra ya no provoca una descarga completa. Representación de cada cosa que ve un usuario. Esto conduce a un rendimiento de datos mucho más eficiente. estrategia ya que es necesario transmitir menos datos desde el servidor al cliente. Además, otra característica utilizada por React para lograr una El aumento del rendimiento es el uso de Shadow Dom. Es muy probable que ya estés familiarizado. Con nuestro Dom estándar, pero solo para. Asegúrate de que estemos todos encendidos. La misma página, dom es un acrónimo. Que significa Módulo de objeto de documento. Cuando nuestra página web, también denominada documento, es cargado en el navegador, su contenido se analiza y todos la información sobre el objeto, su. La estructura y todas las partes que la componen están cargadas. en la memoria. Del cliente o del navegador. Pero lamentablemente para nosotros, junto con todo lo relacionado a nuestra aplicación, otras cosas terminan allí también y. Pertenecen a la funcionalidad principal del navegador. Esto no nos resulta de mucha ayuda. Y aquí es donde entra Shadow Dom. Shadow Dom es un subconjunto. de Dom regular, y su principal ventaja es. Que la única información que guarda es la información que pertenece a nuestra aplicación y absolutamente nada más. Tener menos cosas a nuestra sombra Dom. Than Dom es, por supuesto, beneficioso. Y tener todo esto aplicado a nuestra aplicación solo significa que podemos. Almacenar, extraer y manipular sólo las piezas que necesitemos. Esto conduce a un aumento significativo del rendimiento. React se basa en componentes, es decir, a. Para lograr los resultados que buscamos, romperemos nuestra aplicación en una serie de componentes para encapsular cada uno parte visual de la interfaz de usuario. Eso nos da la posibilidad de reutilizar. Nuestro componente en todo el sitio, acelerando nuestro esfuerzos de desarrollo. Y además, conduce a la uniformidad. La aplicación, permitiendo así una navegación más fluida, menos confusa y experiencia de usuario más completa, desde. Los componentes utilizados para cosas similares se utilizarán en un manera similar en toda la aplicación. Por último, para aquellos que estén familiarizados con otros JavaScript frameworks, reaccionar proporciona un enlace de datos unidireccional. Lo que eso significa son los datos que contiene. Nuestra aplicación fluye en una dirección, en una dirección. únicamente, del padre superior. Al componente secundario inferior. En nuestra próxima lección, veremos por qué usaríamos Reacciona sobre JavaScript simple en HTML. Gracias por ver. Adiós.