Главная » Архив меток: React (страница 11)

Архив меток: React

Создание компонента по образцу React с использованием vanilla JavaScript

От автора: я был немного вдохновлен этим утром твиттом от Кента Си Доддса. Признание: мне сегодня немного тоскливо, к тому же у меня небольшое похмелье, поэтому прошу прощения, если буду выражаться не слишком четко.. Но я увидел, что в списке Кента присутствует один пункт: vanilla javascript! Итак, давайте сделаем это самым простым способом: Это работает, но это немного скучно и ...

Читать далее »

Лучшие практики кодирования на React и Redux

От автора: этим летом я закончил стажировку в Scott Logic, в их офисе в Ньюкасле. Имея небольшой опыт реализации реальных программных проектов, я обнаружил, что много смог почерпнуть из этого опыта. Мы работали над киоском для honesty.store. honesty.store — это магазин офисных товаров, он основан на идее, что люди платят за товары на веб-сайте и просто забирают их. Киоск позволял ...

Читать далее »

Работа с ref в React

От автора: React ref позволяет получить доступ к узлам DOM непосредственно внутри React. Это полезно в ситуациях, когда, например, вы хотите изменить дочерний элемент компонента. Предположим, вы хотите изменить значение элемента input, но без использования свойства или повторного рендеринга всего компонента. Это то, что мы рассмотрим в этом посте. Как создать ref createRef() — это новый API, который поставляется с ...

Читать далее »

Разделяй и властвуй! Отложенная загрузка для вашего SPA

От автора: «Как же это медленно? Я использую только 100 компонентов. Давай же, браузер, делайте свое дело! »Звучит знакомо? Ну, пришло время попробовать повысить производительность. Если вы являетесь веб-разработчиком, скорее всего, вы используете Webpack, и, возможно, вы не знаете, что такое отложенная загрузка. Что такое отложенная (ленивая) загрузка? Я знаю, о чем вы подумали: «Ленивый — это не быстрый, это ...

Читать далее »

Библиотека React — обязательный инструмент для современного веб-разработчика

От автора: привет, друзья! Для front-end разработки сегодня есть множество инструментов. У каждого из них имеются свои преимущества и недостатки. Каждый из них по-своему уникален и специфичен. В данной статье мы поговорим с вами о библиотеке React, подробно рассмотрим, что это такое, обсудим ее преимущества перед другими подобными библиотеками и фреймворками. Также мы рассмотрим тему ее популярности и возможности заработка ...

Читать далее »

Понятие компонентов высшего порядка в React и Gutenberg

От автора: Front end экосистема развивается чрезвычайно быстро, с ростом таких фреймворков, как React, Vue и Angular, что приводит к резким изменениям в архитектуре приложений и целым новым наборам шаблонов для разработчиков JavaScript. С WordPress, охватывающим React в новом редакторе Gutenberg, миллионы разработчиков внезапно внедряются в этот мир и пытаются не отстать от нововведений. В этой статье мы собираемся сломать ...

Читать далее »

React JS — важные моменты разработки

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

Читать далее »

React JS — компоненты высшего порядка

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

Читать далее »

React JS — анимация

От автора: в этой главе мы узнаем, как делается в React js анимация. Шаг 1 — Установите React CSS Transitions Group Это надстройка React, используемая для создания базовых CSS-переходов и анимации. Мы установим ее из окна командной строки: C:\Users\username\Desktop\reactApp>npm install react-addons-css-transition-group Шаг 2 — Добавьте файл CSS Давайте создадим новую папку css и в ней файл style.css. Чтобы иметь возможность ...

Читать далее »

React JS — использование Flux

От автора: в этой главе мы познакомимся с тем, как реализовать в приложениях шаблон Flux React. Мы будем использовать среду Redux. Цель этой главы — представить простейший пример каждой части, необходимой для подключения Redux и React. Шаг 1 — Установите Redux Мы установим Redux через окно командной строки. C:\Users\username\Desktop\reactApp>npm install --save react-redux C:\Users\username\Desktop\reactApp>npm install --save redux Шаг 2. Создание файлов ...

Читать далее »