TUTORIAL

 1-INSTALAR REACT



Comentarios

Publicar un comentario

Entradas más populares de este blog

10-Tutorial de useEffect en React: Guía para Principiantes

  Tutorial de useEffect en React: Guía para Principiantes (Perfecto para tu blog – Ejemplos claros y prácticos) ¿Quieres manejar efectos secundarios en tus componentes de React, como llamadas a APIs, suscripciones o manipulación del DOM?  useEffect  es el hook esencial para eso. En este tutorial, te explico paso a paso cómo usarlo con ejemplos fáciles de entender. 🔹 ¿Qué es useEffect? useEffect  es un hook de React que te permite ejecutar código  después de que el componente se renderiza  (o cuando ciertas dependencias cambian). Es ideal para: Llamadas a APIs. Suscripciones a eventos (ej:  scroll ,  resize ). Manipular el DOM directamente. Limpiar recursos (ej: timeouts, intervalos). 🛠️ Sintaxis Básica jsx import { useEffect } from 'react' ; function MiComponente ( ) { useEffect ( ( ) => { // Código que se ejecuta después del render console . log ( "El componente se renderizó" ) ; // Función de limpieza (opcional) re...
Leer más

5.4--34. Nuestro primer Componente en React JS

Nuestro Primer Componente en React JS https://codesandbox.io/p/sandbox/h8rt93 ¡Ya tenemos nuestra aplicación de React levantada y abierta en nuestro editor de código! 🎉 Ahora vamos a crear nuestro  primer componente  y aprenderemos cómo estructurarlo correctamente, nombrarlo y añadirlo a nuestra aplicación. Estructura de un Componente 1. Ubicación del Componente Todo componente debe ir en la carpeta  src . Es una buena práctica crear una subcarpeta llamada  components  dentro de  src  para organizar mejor nuestros componentes. 2. Nombre del Componente ¡Siempre debe empezar con mayúscula! ✅  HolaMundo.js ❌  holaMundo.js  (incorrecto) 3. Estructura Básica Un componente en React consta de tres partes principales: a) Importaciones jsx import React from 'react' ; Aquí importamos librerías, estilos, imágenes u otros componentes. b) Función del Componente jsx function HolaMundo ( ) { return ( < div > < h1 > Hola...
Leer más

6.4-5-5-Componentes y Comunicación

   Guía Completa de Componentes en React: Padres, Hijos y Comunicación 🌐 Componentes Padres e Hijos En React, los componentes se organizan en una jerarquía donde: Componentes padres  contienen y gestionan otros componentes Componentes hijos  son renderizados dentro de padres jsx Copy Download // Componente Padre function Parent ( ) { return ( < div > < h1 > Yo soy el padre </ h1 > < Child /> { /* Componente Hijo */ } </ div > ) ; } // Componente Hijo function Child ( ) { return < p > Yo soy el hijo </ p > ; } 🔄 Comunicación entre Componentes 1. De Padre a Hijo (Props) La forma más común: el padre pasa datos al hijo mediante props. jsx Copy Download function Parent ( ) { const [ message ] = useState ( "Hola desde el padre" ) ; return ( < div > < Child message = { message } /> </ div > ) ; } function Child ( { message } ...
Leer más