Создание компонентов react
Компоненты позволяют разбить интерфейс на независимые части, про которые легко думать в отдельности. Их можно складывать вместе и использовать несколько раз.
Во многом компоненты ведут себя как обычные функции JavaScript. Они принимают произвольные входные данные (так называемые «пропсы») и возвращают React-элементы, описывающие, что мы хотим увидеть на экране.
Один компонент один файл
Создавая новый компонент необходимо создать файл с именем компонента с расширением js в папке src вашего приложения.
Название файла с компонентом принято писать с большой буквы.

Создание компонентов
Проще всего объявить React-компонент как функцию:

Эта функция — компонент, потому что она получает данные в одном объекте («пропсы») в качестве параметра и возвращает React-элемент. Мы будем называть такие компоненты «функциональными», так как они буквально являются функциями.
Ещё компоненты можно определять как классы ES6:

React позволяет определять компоненты как классы или функции. В настоящее время классовые компоненты имеют больше возможностей.