INSTITUTO TECNÓLOGICO “INFOCAL” SUBSEDE SANTA CRUZ

PROYECTO

“REACT”

TECNICO SUPERIOR

CARRERA

SISTEMAS INFORMATICOS

ESTUDIANTES

CRISTIAN ZELAYA VACA

BRANDON HURTADO SANCHEZ

SANTA CRUZ – BOLIVIA

2023
¿QUE ES REACT?
React es una biblioteca de JavaScript para la construcción de interfaces de usuario. Te
permite crear componentes reutilizables, haciendo que tu código sea fácil de leer y mantener.
Cuando se utiliza con React Router, se pueden crear aplicaciones de una sola página que son
rápidas y receptivas. React también es fácil de usar con otras bibliotecas, como webpack,
para que puedas construir rápidamente aplicaciones complejas.
¿COMO FUNCIONA?
React es una fusión de HTML, CSS y JavaScript el cual resulta como JSX, este sirve para
crear interfaces ya que React se encarga de manipular todo el contenido a JavaScript y
cuando está listo se pasa a la adaptación por medio de Babel este mismo transpila el JSX a
JavaScript para que el navegador lo pueda interpretar esto transcurre por medio del servidor.
Los componentes contienen props (propiedades) estas se pueden leer, pero no editar ya que
podemos utilizarlos como plantillas y editar su contenido. JSX tiene una función la cual es que
al momento de actualizar el código este hace una copia del contenido original y la compara
con el código nuevo y procede a hacer cambios a las propiedades que fueron actualizadas en
vez de volver a generar todo el código.
¿COMO LO CREAMOS?
1. Para crear un proyecto con react, primeramente, abrimos la consola de comandos y nos
dirigimos al escritorio seguidamente escribimos “npm créate vite”

2. Nos preguntará si deseamos instalar “create-vite” e ingresamos “y” procederá a instalarse

esta función. Terminada la instalación nos preguntará el nombre del proyecto el cual se
llamará “proyecto-react2” y elegimos el framework que queremos el cual es “React”.
3. Luego elegimos la primera variante “Type Script”

4. Y se creara nuestro directorio con React

¿COMO USAR REACT?

La forma más simple y rápida de integrar React en tu sitio web es importar la librería usando
la etiqueta “<script>”. Por lo que una página, tan sencilla como sea posible, que integre React

se vería de la siguiente manera:

 Una vez que has importado React, puedes comenzar a crear componentes e incrustarlos en
tu página:
¿QUE CARACTERISTICAS TIENE?
Las características principales de React son:
 Componentes: React está basado en la componetización de la UI. La interfaz se divide en
componentes independientes, que contienen su propio estado. Cuando el estado de un
componente cambia, React vuelve a renderizar la interfaz.
 Virtual DOM: React usa un DOM virtual para renderizar los componentes. El DOM virtual es
una representación en memoria del DOM real. Cuando el estado de un componente cambia,
React vuelve a renderizar la interfaz. En lugar de modificar el DOM real, React modifica el
DOM virtual y, a continuación, compara el DOM virtual con el DOM real. De esta forma, React
sabe qué cambios se deben aplicar al DOM real.
 Declarativo: React es declarativo, lo que significa que no se especifica cómo se debe realizar
una tarea, sino qué se debe realizar. Esto hace que el código sea más fácil de entender y de
mantener.
 Unidireccional: React es unidireccional, lo que significa que los datos fluyen en una sola
dirección. Los datos fluyen de los componentes padres a los componentes hijos.
 Universal: React se puede ejecutar tanto en el cliente como en el servidor. Además, puedes
usar React Native para crear aplicaciones nativas para Android e iOS.
¿PARA QUE SE UTILIZA REACT?
Se utiliza para crear interfaces de usuario interactivas de forma sencilla. Diseña vistas simples
para cada estado en tu aplicación, y React se encargará de actualizar y renderizar de manera
eficiente los componentes correctos cuando los datos cambien.
REQUISITOS PARA USAR REACT
 Instale la versión más reciente de Windows 10 o Windows 11.
 Consola de Comandos (Tener instalado el comando “create-vite”).
 Un editor de código (Visual studio Code).
 Un Navegador web.