Как я справляюсь с интенсивным ЕЖЕДНЕВНЫМ эмоциональным циклом изменений на двенадцатинедельном иммерсивном буткемпе веб-разработки. Я подумал про себя: «Если я узнаю что-то и не передам информацию, я поступаю несправедливо. «Я считаю, что с проблемами, с которыми я столкнулся в своем техническом путешествии, кто-то в будущем столкнется с очень похожей проблемой. ТАК будущий веб-разработчик, это для вас!

Давайте поговорим о React библиотеке Javascript!

React был выпущен для публики 19 апреля 2017 года и был создан человеком по имени Джордан Уоке, который в настоящее время работает инженером-программистом в Facebook. React был создан для одностраничных приложений, которые постоянно меняются (*я расскажу об этом чуть позже…*), что означает, что название React происходит от информации, изменяющейся в вашем приложении, и React «реагирует» на это.

ВИРТУАЛЬНЫЙ ДОМ!

Я все еще думаю, что так весело говорить «виртуальный дом», что мне кажется, что я говорю о чем-то в фильме, о матрице или о чем-то еще. Для тех, кто может не знать, что означает DOM, это аббревиатура от «объектная модель документа», которая на обычном английском — это то, что программист будет использовать для преобразования кода в то, что вы видите на прекрасно созданном Веб-сайт. React использует все это таким образом, что он манипулирует DOM, чтобы его можно было изменить в режиме реального времени. Мне нравится думать об этом как о легком DOM, и что он может изменять и обновлять вещи намного быстрее, чем обычный DOM. Лично я бы сказал, что эта функция является золотым билетом React, на данный момент очень немногие языки программирования или фреймворки имеют такую ​​функцию, как виртуальный DOM. Я думаю, что мы говорили немного абстрактно, поэтому я хочу оставить вас с примером того, что на самом деле может делать виртуальный DOM, если вы перейдете на Facebook в верхней части страницы, где вы можете выполнить поиск. Когда вы начнете искать, вы поймете, что он пытается сгенерировать или угадать, что вы будете печатать, это виртуальный DOM, реагирующий на то, что вы печатаете, и пытается вам помочь.

Компоненты R’ US!

React создает приложения, состоящие из набора небольших компонентов, сложенных вместе. Когда мы смотрим на веб-сайт, такой как Facebook, вы заметите множество различных функций, таких как панель поиска, и эта панель поиска находится внутри панели навигации. Способ, которым React создает это, заключается в том, что панель поиска будет одним компонентом, а панель навигации будет совершенно другим компонентом. Большие компоненты, такие как панель навигации, будут иметь внутри несколько компонентов, таких как кнопка «Домой», профиль и панель поиска. Эта функция React чрезвычайно полезна, потому что позволяет легко повторно использовать код, и если вы спросите любого программиста, основным правилом будет написать «СУХОЙ КОД», что означает Dont.Rповторяем.Yнаш код.

Состояние и реквизиты

Хорошо, ребята, наденьте каску, мы будем говорить о коде! Когда мы говорим о том, как на самом деле работает каждый компонент в React, мы должны упомянуть state и props, это ключевая часть работы React. Чтобы понять эти два термина, я бы сказал, что это способ передать функциональность каждому компоненту или передать одну и ту же функциональность отдельному компоненту. состояние в React — это собственная локальная сущность, к состоянию нельзя получить доступ или изменить его за пределами его конкретного компонента. Когда вы ссылаетесь на state в компоненте, вы создаете функциональность только в этом компоненте. Теперь вы можете догадаться, для чего нужны реквизиты?

Теперь вы можете догадаться, для чего нужны реквизиты? Props похожи на state, но помните, как я упоминал, что React любит совместно использовать компоненты и создавать СУХОЙ код? Здесь в игру вступает props, потому что вы можете передать функциональность другим компонентам, используя props.

Заключение

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