Instalar React.js en Mac

El software es una biblioteca JavaScript front-end gratuita y de código abierto. En 2013, Facebook estableció React.JS.

Es una biblioteca de interfaz de usuario (UI) que se utiliza para crear y manipular componentes de UI. Es un paquete que permite a los desarrolladores crear aplicaciones SPA basadas en datos altamente eficientes.

Se basa en la programación funcional, se basa en el concepto de inmutabilidad y promueve la arquitectura basada en componentes basada en el principio de reutilización única.

En este artículo, repasaremos los procedimientos para instalar React en Mac. Una vez que haya completado las etapas de instalación, le recomendamos que asista a la capacitación de React en línea.

Exploremos algunos términos antes-

NodeJS y NPM

• Primero debe instalar NodeJS y NPM para obtener la instalación de React en Mac.
• Es un motor de JavaScript que le permite ejecutarlo fuera del navegador.
• NPM (gestor de paquetes de nodos) se utiliza en la línea de comandos. Es para instalar bibliotecas como ReactJS.
• Puede instalar NodeJS a través de su sitio web oficial. Cuando instale NodeJS, también descargará NPM por usted.
• Después de descargar NodeJS de su sitio web, busque el archivo ".pkg". Simplemente haga doble clic en esto. Se abrirá una ventana emergente para la instalación.
• Será dirigido al proceso de instalación. Haga clic en "Instalar" o "Modificar ubicación de instalación"
• Cuando se complete el proceso, aparecerá un mensaje final. Su NodeJS y NPM están instalados.

Instalación de ReactJS en MacOS

Después de instalar NodeJS y NPM, se puede instalar ReactJS. Se realiza ejecutando npm install-save react react-dom.

Crear proyecto ReactJS

Como hemos instalado ReactJS, se puede crear un nuevo directorio de proyecto de reacción. Se hace ejecutando npx create react project. crear-reaccionar-aplicación.

React- Introducción

Antes de continuar con la instalación de React-Lib en la Mac, primero debemos obtener una comprensión básica de React.

• React es un paquete que ayuda a los desarrolladores y arquitectos web a cumplir con las expectativas de los clientes que requieren un alto flujo de datos e interfaces de usuario de respuesta rápida en el contexto de los datos.
• Está construido sobre una arquitectura basada en componentes. La página web se puede representar mediante componentes primarios y secundarios.
• Se basa en gran medida en Virtual DOM, que funciona como un optimizador de rendimiento para las operaciones DOM.
• Una página web HTML tiene un árbol DOM, que el navegador utiliza para representar la página web.

Cuando un usuario interactúa con una página, implica la adición e inserción de información basada en la acción del usuario. como en Un usuario ha agregado un artículo al carrito. El carrito ahora muestra el artículo modificado como resultado de la decisión del usuario.

Detrás de escena, el documento HTML sufre una transformación que permite compartir la página modificada.

Como se indicó anteriormente, el árbol DOM representa el documento HTML. En el caso anterior, el DOM requiere algunos ajustes, que incluyen la inserción y eliminación de nodos HTML particulares.

Esto ayuda a mostrar la información esencial que simboliza lo que un usuario intenta hacer en el contexto de revisar su

decisión de compra.

Podemos ver el DOM como un árbol para comprenderlo mejor.

El árbol tiene raíces y ramas. De manera similar, el elemento HTML está en la parte superior del DOM y los nodos debajo de él están conectados al nodo principal. En términos de analogía con el árbol, el nodo padre se puede representar como el tronco, con otros nodos conectados al tronco. Y React se usa para mejorar las operaciones de inserción y eliminación en estos nodos.

Hay una penalización de memoria asociada con esta operación de inserción y eliminación en el HTML DOM. En términos de operaciones de actualización de DOM, el DOM virtual funciona como un optimizador de rendimiento.

Mantiene dos copias: una del DOM real (react DOM) y otra de las actualizaciones a realizar. El proceso de minimizar la modificación en el DOM de reacción también se investiga como parte del proceso de reconciliación.

Node.js y npm

Node.js ejecuta el código de JavaScript. Es un entorno de tiempo de ejecución de JavaScript de código abierto y multiplataforma. Está propulsado por el motor Chrome V8. El motor Chrome V8 está escrito en C++. El nodo es compatible con Windows, Mac y Linux.

Después de instalar Node.js, podemos ejecutar la aplicación basada en React localmente en nuestro sistema durante el desarrollo. Esto también nos permite implementar nuestro programa en el servidor de producción.

Node.js incluye las siguientes características:

• Utiliza JavaScript como su lenguaje central
• E/S sin bloqueo
• Soporta programación asíncrona
• Puede administrar numerosas solicitudes de conexión utilizando un solo servidor.

Npmjs.org es un repositorio de código en línea de miles de módulos (npm) que nos permite instalar módulos de nodo usando comandos simples.

Algunos módulos son autónomos, mientras que otros requieren interdependencia para funcionar correctamente. Node.js nos permite realizar operaciones de lectura y escritura en el servidor. También le permite trabajar con bases de datos.

En lugar de crear funcionalidad desde cero, podemos buscar un módulo y reutilizar y ampliar su funcionalidad.

Las iniciativas de los desarrolladores suelen implicar limitaciones de tiempo y presupuesto. Cuando se trata de Node. desarrollo basado en js, npmjs.org es un salvavidas para la comunidad de desarrolladores.

Para resumir

En este tutorial, aprendimos sobre React.js y el enfoque de arquitectura basada en componentes en React.js. También obtuvimos una descripción general de alto nivel del DOM virtual.

Discutimos el concepto de reconciliación, el uso de Node.js en el mundo de JavaScript y su capacidad para administrar la salida de E/S sin bloqueo para cumplir con las solicitudes de conexión del cliente al mismo tiempo.

Probamos dos técnicas para instalar Node.js: una con la gestión de paquetes y otra con la línea de comandos.

Para comenzar rápidamente a usar React.js, usamos el módulo create-react-app. También podemos usar la línea de comando para instalar React.js.

Para evitar sobrecargarnos con demasiados detalles, utilizamos la técnica de crear-reaccionar-aplicación para este tutorial. Vimos nuestra primera aplicación de reacción ejecutándose después de desarrollarla. Evaluamos rápidamente los archivos importantes que están operando la aplicación para familiarizarnos con el código desde el punto de vista del desarrollo.

Lea también:

• Los virus de Mac están vivos ¡Mátalos y vive en tranquilidad!