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

HTML в компонент

Готовая вёрстка становится компонентом: инлайновые onclick переезжают в события фреймворка, а для каждого обработчика появляется заготовка функции.

HTML

Имя компонента

SubscribeCard.vue

<template>
  <div class="card">
    <h2 class="card__title">Подписка</h2>
    <p class="card__text">Раз в неделю, без спама.</p>
    <form class="card__form">
      <input type="email" name="email" placeholder="Почта" required>
      <button type="submit" @click="subscribe()">Подписаться</button>
    </form>
    <button class="card__close" @click="visible = false">Закрыть</button>
  </div>
</template>

<script setup>
function subscribe() {
  // …
}
</script>

Нужен React — рядом есть HTML → JSX: там разметка переводится в className, htmlFor и объект стилей.