Настройка интерфейса и логики создания новых контактов в компонентах на React

В первой части видео мы рассмотрим, как изменить внешний вид страницы на React, для управления контактами, разделив ее на два компонента: избранные контакты и остальные контакты.
Мы будем править компоненты на React, чтобы оптимизировать их стили и сделать интерфейс более компактным.
В процессе работы добавим дополнительные блоки и стилизации, чтобы улучшить расположение элементов и сделать его более удобным для пользователей.
Также добавим новые стили и отступы, чтобы визуально разграничить избранные и обычные контакты.
В завершение устраним небольшие визуальные недочеты, чтобы страница выглядела более профессионально.
Во второй части видео, мы обсудим настройку логики для создания нового контакта в нашем приложении.
Мы начнем с разработки компонента React, в котором можно будет добавлять новые контакты в список.
Сначала мы создадим метод для обработки добавления новых контактов, используя состояние React в классовом компоненте ContactIndex.
Мы также настроим этот компонент для правильного отображения сообщений об успехе или ошибках при добавлении контактов.
Для этого мы преобразуем компонент из функционального в классовый компонент и добавим методы для управления состоянием и отображением сообщений.
По ходу видео мы также исправим ошибки и улучшим код, чтобы приложение работало корректно.