Capítulo 5. React con JSX

Este trabajo se ha traducido utilizando IA. Agradecemos tus opiniones y comentarios: translation-feedback@oreilly.com

En el último capítulo, profundizamos en cómo funciona React, dividiendo nuestras aplicaciones React en pequeñas piezas reutilizables llamadas componentes. Estos componentes renderizan árboles de elementos y otros componentes. Utilizar la función createElement es una buena forma de ver cómo funciona React, pero como desarrolladores React, eso no es lo que hacemos. No vamos por ahí componiendo árboles complejos y apenas legibles de sintaxis JavaScript y lo llamamos diversión. Para trabajar eficazmente con React, necesitamos una cosa más: JSX.

JSX combina la JS de JavaScript y la X de XML. Es una extensión de JavaScript que nos permite definir elementos React utilizando una sintaxis basada en etiquetas directamente dentro de nuestro código JavaScript. A veces se confunde JSX con HTML porque se parecen. JSX no es más que otra forma de crear elementos React, para que no tengas que tirarte de los pelos buscando la coma que falta en una llamada compleja a createElement.

En este capítulo vamos a ver cómo utilizar JSX para construir una aplicación React.

Elementos React como JSX

El equipo React de Facebook lanzó JSX cuando lanzaron React para proporcionar una sintaxis concisa para crear árboles DOM complejos con atributos. También esperaban que React fuera más legible como HTML y XML. En JSX, el tipo de un elemento se especifica con una etiqueta. ...

Get Aprendiendo React, 2ª Edición now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.