Conversor de HTML a JSX
Pega HTML y obtén JSX limpio de React: class se convierte en className, los atributos pasan a camelCase, las cadenas de style se vuelven objetos y las etiquetas se autocierran. Todo funciona en tu navegador. Gratis.
Todo funciona en tu navegador: tu marcado nunca sale de tu dispositivo.
1
Acerca de Conversor de HTML a JSX
El Conversor de HTML a JSX convierte marcado HTML plano en JSX listo para React en tiempo real. Reescribe class como className y for como htmlFor, convierte a camelCase los atributos en kebab-case y los de SVG, transforma las cadenas de estilo en línea en objetos de estilo JSX, y autocierra elementos vacíos como img y br: exactamente las ediciones que de otro modo harías a mano.
Pega un fragmento, una sección completa de página, o marcado exportado de una herramienta de diseño, y el panel JSX se actualiza mientras escribes con resaltado de sintaxis. Un envoltorio opcional convierte el resultado en un componente de función con nombre, así el resultado se integra directamente en un proyecto React sin más edición.
El conversor es una herramienta de HTML a JSX totalmente del lado del cliente: tu marcado se transforma con JavaScript en tu navegador y nunca sale de tu dispositivo, lo que lo hace seguro para usar con plantillas propietarias y páginas internas.
Cómo usar Conversor de HTML a JSX
- Pega tu HTML en el panel izquierdo, o haz clic en Ejemplo para cargar un caso.
- Observa cómo se actualiza el panel JSX al instante mientras escribes o editas.
- Activa Envolver en un componente y establece un nombre de componente si quieres un componente de función listo para usar.
- Haz clic en Copiar para obtener el JSX, o en Descargar para guardarlo como Component.jsx.
- Usa Borrar para reiniciar ambos paneles y convertir otro fragmento.