Библиотека React: построй свою любовь к интерактивным веб-интерфейсам «Нетология»

compare_arrows

Вы должны хорошо знать JavaScript. Замыкания, контекст вызова функции, прототип, наследование — все это должно быть хорошо вам знакомо. Также вам надо знать, как JavaScript работает в браузере и какие возможности для создания интерактивных веб-интерфейсов браузер предоставляет. Очень желательно иметь опыт разработки интерактивных веб-интерфейсов на чистом JavaScript или с использованием библиотек и фреймворков. Неплохо также понимать, какие сложности возникают при обновлении DOM и в целом при организации кода и развитии таких проектов. Необходимо знать основы HTML и CSS — в идеале до уровня верстки простых макетов.

• JSX - Библиотека React предоставляет нам виртуальный браузер. В отличие от других библиотек, которые расширяют возможности языка HTML, React предоставляет виртуальный DOM API, с помощью которого мы можем гораздо проще создавать интерактивные веб-интерфейсы. Мы взаимодействуем с React как с виртуальным браузером, а React уже взаимодействует с реальным.
• Композиция компонентов - Компонент интерфейса проще всего представить как функцию. На входе — свойства, на выходе — представление в окне браузера. Помимо свойств каждый компонент может иметь собственное состояние, которое тоже может влиять на его внешний вид. Сходства с функцией на этом не заканчиваются. Вы можете создавать более сложные компоненты, комбинируя их из более простых. Компоненты можно повторно использовать.
• Одностраничные приложения - Несмотря на слово «одностраничное» в названии, обычно такие приложения имеют множество экранов и состояний, позволяя пользователю переходить между ними, ссылаться на них. С одной лишь разницей: переход происходит без полной перезагрузки страницы. Каждый экран — это просто определенное состояние интерфейса. И React-роутер позволяет очень просто и логично организовать управление этими состояниями.
• Интеграция с React - Современные интерфейсы имеют огромное количество взаимосвязанных компонентов, обновляются на лету. Чтобы не потеряться в многообразии различных действий, событий, связей и данных, у вас должен быть план. И Flux — это как раз и есть такой план. Есть события. Есть диспетчер, который обрабатывает событие. Есть хранилище, в котором отражается состояние. И наконец, представление обновляется при обновлении хранилища.