Input HTML

Output JSX

Cos'e un convertitore HTML in JSX?

Un convertitore HTML in JSX trasforma il markup HTML standard in sintassi React JSX valida. In JSX, class diventa className e for diventa htmlFor.

Incollare HTML direttamente in componenti React causa errori di sintassi. Questo strumento automatizza tutte le trasformazioni necessarie.

Come convertire HTML in JSX

Segui questi tre passaggi per convertire HTML in React JSX valido.

1

Incolla o carica HTML

Incolla il tuo HTML nel pannello sinistro o clicca su Carica.

2

Vedi l'output JSX

class viene rinominato in className e gli elementi vuoti vengono auto-chiusi.

3

Copia o scarica

Clicca su Copia o Scarica per salvare come .jsx.

Quando usare questo convertitore

Migrare HTML in React

Converti template HTML esistenti in JSX per progetti React.

Usare mockup del designer

Integra mockup HTML di designer in componenti React.

Imparare JSX

Vedi l'equivalente JSX di qualsiasi HTML che conosci gia.

Convertire template email

Converti template HTML email per librerie come React Email.

Domande frequenti

Perche class diventa className?

In JSX gli attributi mappano le proprieta DOM JavaScript. La proprieta DOM per class e className.

Quali altri attributi vengono rinominati?

forhtmlFor, tabindextabIndex, onclickonClick.

Quali elementi vuoti vengono auto-chiusi?

Tutti gli elementi vuoti HTML: <br />, <img />, <input />, etc.

Gestisce gli stili inline?

style="color:red" diventa style={{ color: "red" }}.

Il mio HTML viene memorizzato?

No. Tutto avviene nel tuo browser.

Strumenti correlati

Altri strumenti per lavorare con HTML: