Tutorial Principal de React

Introducción Instalación de React Conexión del complemento react-devtools Enfoque de componentes Diseño del sitio Resultado del trabajo del componente

El lenguaje JSX

Introducción a JSX Retorno de etiquetas anidadas Bajar una etiqueta hacia abajo Retorno de varias etiquetas Retorno de una etiqueta no cerrada Retorno de una etiqueta vacía por una función Inserción de valores de variables Matices al insertar variables Inserción de arrays Inserción de objetos Inserción en atributos Almacenamiento de etiquetas en JSX Almacenamiento de varias etiquetas Etiquetas en diferentes líneas Retorno de etiquetas Cierre de las etiquetas JSX Corrección del marcado Ejecución de código JavaScript

Condiciones

Condiciones en JSX Mostrar por condición Condiciones para retornar una etiqueta Operador ternario en JSX Uso del operador && en JSX Inversión para condiciones abreviadas

Funciones

Uso de funciones Llamar funciones dentro de etiquetas Asignar manejadores Parámetros de los manejadores Objeto Event Objeto Event al pasar parámetros

Formación de Etiquetas

Array de etiquetas Array de etiquetas en bucle Etiquetas desde array con datos Claves en array Array de objetos Claves únicas vía id Tabla desde array de objetos

Id únicos

Discusión Problemas con nuevos id Cadenas aleatorias para id Generación de id Función para generar id Uso de la función id Uso incorrecto de la función

Estados

Introducción a los estados Uso Reactividad Valor booleano en el estado Contador al trabajar con estados

Formularios

Trabajo con entradas Modificación de datos de entrada al mostrarlos Modificación de datos mediante una función Trabajo con múltiples entradas Procesamiento de datos del formulario Trabajo con textarea Trabajo con casillas de verificación Casillas de verificación y renderizado condicional Trabajo con selecciones Elementos de selección de una matriz Atributos value en la selección Atributos value de la selección de una matriz Trabajo con radio Valores por defecto Vinculación de entradas a una matriz Vinculación de entradas a un objeto

Datos

Introducción Adición reactiva en arrays Operaciones reactivas con arrays Adición reactiva en arrays de objetos Operaciones reactivas con arrays de objetos Visualización reactiva de datos

Componentes

Introducción a los componentes Uso de componentes Múltiples instancias de componente Props de componentes Componentes hijos Array para crear componentes hijos Componentes hijos en bucle Pasar estados a componentes hijos Pasar id al componente Cambiar estado del padre Editar estado del padre Editar estado del abuelo Modos de trabajo mediante estados

Conceptos

Introducción Datos de componentes Tipos de componentes Flujo de datos unidireccional Elevación de estado Una única fuente de la verdad

Estilización

Enfoques de estilización en React CSS Global Inserción de datos en el atributo style desde un objeto Inserción de datos en el atributo style desde un archivo separado Trabajo con estilos CSS en el atributo style Inserción de datos en el atributo style desde variables Styled Components Props en Styled Components Props y renderizado condicional en Styled Components Componentes con estilización extendida Empezar con CSS modules Continuación del trabajo con CSS modules Comando composes para clases Comando composes para archivos

Proyectos

Lista de verificación Bloc de notas
↑
bydeenesfrptru