React es una biblioteca de JavaScript para crear interfaces de usuario.

que es reaccionar

Para los desarrolladores de Frontend, la biblioteca de javascript conocida como React.JS es muy popular. Ayuda a hacer una interfaz de usuario web fácilmente. Conozcamos el tema fundamental central de React.JS.

reaccionar por qué

Con la competencia, Angular y Vue.JS afortunadamente son una buena opción. React obtuvo la mejor posición para la mayoría de los desarrolladores. Porque es fácil de aprender y fácil de trabajar. React hizo que el desarrollo fuera rápido y fluido. Si se siente cómodo con JavaScript y ES6 , aprenderá a reaccionar fácilmente.

Componentes

Los componentes de React pueden ser funciones o clases. Es como una plantilla. También puede decir que es una definición global y un modelo. La estructura básica de los componentes es como la función JS habitual . Un componente tiene uno o más estados donde se almacenan los datos y la salida depende de ello.

Lo útil es que los componentes hacen que el código sea legible y fácil de trabajar con él.

DOM virtual

El dominio virtual es solo una representación virtual del dominio real. Cada vez que el estado de nuestra aplicación cambia y el dom virtual se actualiza en lugar del dom real. Cuando se incluyen nuevos elementos en su dominio virtual de interfaz de usuario , cree un árbol virtual. Y todos los elementos están unidos en este árbol. Si algún elemento cambió el dominio virtual, compárelo con el árbol de dominio virtual anterior. Si se hace dom virtual calcular y cambiar el método de dom real.

Virtual DOM es mucho más rápido y eficiente. Cuando llega el dom virtual y su rendimiento es mejor que el dom real.

Ganchos de reacción

React-hook es como una función. Hooks resuelve el problema de los componentes de reutilización de código. Los ganchos se escriben sin clases. Eso significa que solo funciona con el uso de componentes funcionales. Por lo general, casi los desarrolladores de reacción están familiarizados con los ganchos de reacción.

Usar estado en React.js

El estado contiene datos específicos que pueden cambiar con el tiempo a un componente. Mediante el uso de useState , puede cambiar los datos que ha proporcionado en su código. Siempre que use useState , debe tener que importarlo.

Ejemplo ( )

import React, { useState } from ‘react’; 2:
function Example() {
 const [count, setCount] = useState(0); 5:
 
 return (
 <div>
 <p>You clicked {count} times</p>
 <button onClick={() => setCount(count + 1)}>10: 
 Click me
 </button>
 </div>
 );
}

UseEffect se utiliza para actualizar el documento mediante la API del navegador. Si desea mostrar los datos que obtuvo de la API, debe usar el enlace useState. Al declarar useState , podrá mostrarlo en su interfaz de usuario.

Ejemplo ( )

JSX

JSX es una extensión de sintaxis de javascript. Te recuerda a un lenguaje de plantillas pero viene con todo el poder de javascript. JSX produce elementos de reacción . Sintaxis JSX como HTML pero no es HTML. JSX no conoce HTML y HTML no conoce JSX. Incluso los navegadores tampoco saben qué es JSX. Cuando su código se escribe como JSX en React, se convertirá a HTML y luego los navegadores lo entenderán y mostrarán los resultados.