- Зачем нужны JS-фреймворки?
- Концепция Virtual DOM
- create-react-app
- webpack
- babel
- eslint
- react
- react-dom
- React-элементы и
React.createElement()
- Тип элемента
- Пропсы
- children
- JSX как шаблонизатор
- Новый трансформ
- Выражения в JSX.
- Рендер по условию с
&&
и?
- Компоненты-функции
- Имя маленькой в JSX - строка, с большой - имя переменной.
- Передача данных через Props
- Значения пропсов по умолчанию
- Дефолтные локальные изображения.
- Инструменты разработчика - React DevTools
- Пакет prop-types
- Свойство
propTypes
- Работа с коллекциями, ключи
- Основы композиции компонентов, потомки (props.children). Делаем панель.
- Строгий режим
<div>
<img src="" alt="" width="480" />
<h2></h2>
<p>Автор: <a href=""></a></p>
<p>Цена: кредитов</p>
<p>Доступность: заканчивается или есть в наличии}</p>
<button type="button">Добавить в корзину</button>
</div>
<ul>
<li>Painting</li>
...
</ul>
<div style="outline: 1px solid tomato;">
<h2></h2>
Контент
</div>