React. Реакт. Тестовая задача 019. JSX очень похоже на HTML. Но есть важные отличия

---

JSX очень похоже на HTML. Но есть важные отличия

Разберёмся, что здесь происходит:

  <script src="/js/react/react.development.js"></script>
  <script src="/js/react/react-dom.development.js"></script>
  <script src="/js/react/babel.min.js"></script>
  ...
  <script type="text/babel">
    const { useState, createElement } = React;
    const { createRoot } = ReactDOM;

createRoot(document.getElementById('root')).render(
  <>
    <div className="proletariat">
      Шаг держи революционный!
      Близок враг неугомонный!
      Вперёд, вперёд, вперёд,
      Рабочий народ!
    </div>
    <div className="bourgeoisie">
      Ешь ананасы, рябчиков жуй,
      День твой последний приходит, буржуй.
    </div>
  </>
); 

JSX очень похоже на HTML. Но есть важные отличия.

Свойства элементов

JSX очень похоже на HTML. Но есть важные отличия, которые нужно запомнить.

Чтобы задать CSS-класс, вместо class используется атрибут className.