Comenzando con React desde cero hasta la práctica real del proyecto
Capítulo 1 Introducción a React
Directorio de artículos
提示：以下是本篇文章正文内容，下面案例可供参考
1. ¿Qué es reaccionar?
1. Reaccionar descripción general
React es una biblioteca de JavaScript de código abierto de Facebook para crear interfaces de usuario (interfaz de usuario, UI para abreviar).
Utilizando un enfoque de desarrollo basado en componentes, la interfaz de usuario se divide en componentes independientes, mejorando así la capacidad de mantenimiento y reutilización del código.
2. La relación entre React y MVC tradicional
¡Es una biblioteca de capas de vista liviana! Una biblioteca de JavaScript para crear interfaces de usuario
. React no es un marco MVC completo y, como máximo, puede considerarse como la V (Ver) en MVC.
React es una biblioteca para construir la interfaz de usuario de una página. Se puede entender que React divide la interfaz en pequeños bloques independientes. Cada bloque es un componente. Estos componentes se pueden combinar y anidar para formar la página que escribimos.
3. ¿Cuáles son las características de React?
- 1) Diseño declarativo : React adopta un paradigma declarativo, lo que facilita la descripción de aplicaciones.
- 2) Eficiente : React introduce la tecnología DOM virtual (Virtual DOM) para optimizar la eficiencia de actualización de la interfaz UI manteniendo un árbol DOM virtual en la memoria. Cuando el estado o atributo cambia, React primero comparará el nuevo árbol DOM virtual con el antiguo árbol DOM virtual basado en el algoritmo Diff y solo actualizará las partes que deben cambiarse, minimizando la interacción con el DOM y mejorando así la interfaz de usuario. Interfaz Actualización de eficiencia.
- 3) Flexible : React puede funcionar bien con bibliotecas o marcos conocidos y tiene buena compatibilidad con otras tecnologías (como Redux, Webpack, Babel, etc.) y puede usarse con ellas para crear aplicaciones más completas y eficientes.
- 4) JSX : JSX es una extensión de la sintaxis de JavaScript.
- 5) Desarrollo de componentes : la creación de componentes a través de React hace que el código sea más fácil de reutilizar y se pueda aplicar bien en el desarrollo de grandes proyectos.
- 6) Diseño responsivo : React actualiza la interfaz UI de manera responsiva. Cuando el estado (Estado) o las propiedades (Props) cambian, React recalculará los cambios en la interfaz UI y aplicará los cambios al DOM. Implementa un flujo de datos de respuesta unidireccional, lo que reduce el código repetido, por lo que es más simple que el enlace de datos tradicional.
4. Dominio virtual
Actualización de DOM tradicional:
en el modelo de desarrollo de páginas tradicional, cada vez que es necesario actualizar la página, el DOM debe operarse manualmente para actualizarse.
Dom virtual :
sabemos que en el desarrollo front-end, las operaciones DOM consumen la mayor parte del rendimiento y esta parte del código hará que todo el código del proyecto sea difícil de mantener. React convierte el árbol DOM real en un árbol de objetos JavaScript (DOM virtual), minimizando la interacción con el DOM y mejorando así la eficiencia de actualización de la interfaz UI.
Bueno, este capítulo presenta ¡React está aquí! En el próximo capítulo, comencemos oficialmente el viaje de aprendizaje de React: ¡ use la aplicación scaffolding create-react-app para crear su primera aplicación React !