DEV Community 👩‍💻👨‍💻

Cover image for React (Conceptos Básicos)
Alberto Sandoval
Alberto Sandoval

Posted on • Updated on

React (Conceptos Básicos)

¿Qué es React?

Es una librería de código abierto de Java Script que nos permite crear interfaces de usuario.

Características

  • Usa un virtual DOM en vez del DOM real haciendo el manejo de este más fácil.

  • Es declarativa, puedes crear tus propias etiquetas que al final de cuentas son componentes, esto hace fácil seguir patrones de diseño y crear interfaces de usuario interactivas.

  • Es eficiente.

  • Predecible. Fluye en una sola vía.

  • React está basado en Componentes. Pequeñas piezas de código encapsuladas que pueden tener un estado o no, permite organizar aplicaciones complejas en pequeños componentes sencillos y fáciles de mantener.

  • Se puede trabajar con React del lado del servidor con Node

  • Se puede crear aplicaciones móviles con Reac Native y aplicaciones de escritorio con Electron.

Virtual DOM

VDOM Es una representación en memoria de lo que es el DOM real del navegador. Actua como intermediario entre el estado de la aplicación y la UI que está viendo el usuario de tu proyecto.

Reconciliación

Este concepto describe la manera en que React manipula y actualiza los componentes. Para ello usa un algortmo diferencial para actualizar los elementos del árbol de tu aplicación.

Fiber (Fibras)

Son objetos internos de React que mantienen información del árbol de los componentes. Se podiran vislumbrar como partes pequeñas que nos ayudan a actualizar la información de los nodos.

JSX

El JSX es una combinación de Java Script con XML, nos provee una sintaxis fácil de usar ("syntactic sugar").

Ejemplo: a la constate llamada "h1Tag" le asignamos como valor una etiqueta de HTML.

Alt Text

Crear un proyecto en React.

Para crear un proyecto en React usamos el comando:

Alt Text

Con este comando se creara un proyecto con el nombre "my-app". Para personalizar el nombre de nuestro proyecto debemos cambiar "my-app" por el nombre deseado.

npm start. Comienza a ejecutar un servidor para nuestra la aplicación que acabamos de crear.

En mi próximo post publicare mis apuntes sobre los componentes en React.

Top comments (1)

Collapse
 
io31416 profile image
Víctor Izquierdo

Muchas gracias por esta guía. Llevo un mes aprendiendo React con Hooks y aún me falta aclarar mejor sus conceptos.

DEV has this feature:

Settings

Go to your customization settings to nudge your home feed to show content more relevant to your developer experience level. 🛠