Что такое React?

React — очень мощная библиотека JavaScript, которая может делать много удивительных вещей. В наши дни его используют многие веб-сайты и приложения, особенно Facebook — в конце концов, это они его создали. Подобно Angular, React позволяет плавно вносить изменения в DOM без необходимости обновлять всю страницу. Он позволяет создавать интерактивный пользовательский интерфейс и беспрепятственно управлять им, обновляя только те компоненты, которые должны обновляться по мере изменения их данных. Это также делает ваш «код более предсказуемым и простым в отладке».

Подробности

JavaScript сам по себе уже довольно велик и мощен, но есть так много вещей, которые он не может сделать сам по себе (по крайней мере, не написав намного больше кода, чем хотелось бы большинству разработчиков), поэтому требуются библиотеки, подключаемые модули. -ins и тому подобное. К счастью, React — это библиотека, которую очень легко установить. Однако он написан в несколько ином варианте, который называется JSX — JavaScript XML. Как следует из названия, он добавляет синтаксис XML в JavaScript для написания React. Его можно легко «перевести» на простой JavaScript с помощью Babel.

Определенно нужно время, чтобы привыкнуть к этому. Я имею в виду, с одной стороны, JavaScript и XML сами по себе довольно прямолинейны, особенно если вы поработаете с ними какое-то время. Однако, когда вы соединяете их вместе и используете структуру и синтаксис React, все становится немного сложнее. У него определенно совсем другое мышление, чем у ванильного JavaScript или даже JQuery.

Как упоминалось ранее, React использует компоненты. По сути, все является компонентом — поле ввода, кнопка, заголовок, изображение и т. д. Это делает его отличным для каждого компонента, обновляющего свое состояние по отдельности, что позволяет React отображать только те компоненты, которые необходимо обновлять по мере их изменения. Это означает, что вам не нужно обновлять всю страницу или документ, и ваш веб-сайт будет плавно перерисовывать элементы по мере необходимости.

Это становится более сложным, чем больше компонентов в вашем проекте, а это означает, что в конечном итоге вам нужен способ управлять всеми ими. Здесь на помощь приходит Redux. Redux позволяет вам создать объект JavaScript с именем Store, который управляет и сохраняет состояния всех объектов, найденных в проекте. Это позволяет вам легче управлять ими, изменяя основное состояние, которое автоматически изменит только то, что необходимо изменить, вместо того, чтобы вручную обновлять состояние каждого компонента самостоятельно. О, и я упоминал, что это также решает проблему обновления состояний родительских компонентов?

Чем больше вы смотрите на React и Redux, тем больше понимаете, почему они становятся все более и более популярными и почему они так активно используются в таких приложениях, как Reddit и Twitter. Имея такой объем данных, вы хотите иметь возможность обновлять их и управлять ими максимально легко и просто.

Заключительные мысли

Хотя переход к React и, в конечном итоге, к Redux может быть несколько пугающим, это очень важный навык. React начинает использоваться во многих местах и, возможно, является конкурентом Angular. Он может быть очень мощным и эффективным и позволяет ускорить разработку, особенно для новичков. Хотя поначалу это кажется сложным, со временем вы освоитесь. Вам просто нужно изменить свое мышление, что, на мой взгляд, является самой сложной частью.