Конвертеры и генераторы кода

JSX в HTML

Обратный перевод: className становится class, объект стилей — строкой, фрагменты исчезают, а одиночные теги закрываются по правилам HTML.

JSX

HTML

<!-- карточка товара -->
      <div class="card" style="padding: 16px; border-radius: 8px; color: #111827">
        <img src="/photo.jpg" alt="Товар" width="320">
        <label for="count">Количество</label>
        <input id="count" type="number" default-value="1">
        <button class="btn" onclick="{buy}">Купить</button>
      </div>

Что нельзя выразить в HTML

Взято содержимое return(…) — объявление компонента в HTML не переносится.
Значение onclick={buy} — выражение JavaScript, в HTML оно оставлено как есть.

Выражения JavaScript в HTML не переносятся: {'{'}user.name{'}'} остаётся на месте видимым текстом — так его проще найти и заменить, чем если бы он молча исчез.