Задание "Render HTML Elements to the DOM".

, чтобы сохранить свой прогресс

Вывод HTML-элементов в DOM

До сих пор вы узнали, что JSX - удобный инструмент для записи читаемого HTML в JavaScript. С помощью React мы можем передать этот JSX непосредственно в HTML DOM с использованием API рендеринга React через модуль ReactDOM. ReactDOM предлагает простой способ визуализации элементов React в DOM, который выглядит так:

ReactDOM.render(ComponentToRender, targetNode)

, где первым аргументом является элемент React или компонент, который вы хотите отобразить, а второй аргумент - узел DOM, в который вы хотите вывести свой компонент. Как и следовало ожидать, ReactDOM.render() должен вызываться после объявлений элементов JSX, так же, как вы должны объявлять переменные перед их использованием.

Редактор кода имеет простой компонент JSX. Используйте метод ReactDOM.render() чтобы отобразить этот компонент на странице. Вы можете передать определенные элементы JSX непосредственно в качестве первого аргумента и использовать document.getElementById() чтобы выбрать узел DOM для их рендеринга. Для вас доступен div с id='challenge-node'. Убедитесь, что вы не изменяете константу JSX.

⌛

The constant JSX should return a div element.

⌛

The div should contain an h1 tag as the first element.

⌛

The div should contain a p tag as the second element.

⌛

The provided JSX element should render to the DOM node with id challenge-node.

/** * Your test output will go here. */