REact

Я слишком остро реагирую? Или React чрезмерно реагирует?

огда я впервые начал заниматься веб-разработкой, в основном я использовал Python/Django. Все рендерилось на стороне сервера, и я ни разу не подумал о «производительности рендеринга». 10 лет спустя, когда компьютеры работают как минимум в два раза быстрее, производительность рендеринга стала более серьезной проблемой, чем когда-либо. Одностраничные приложения (SPA) и внешние библиотеки, такие как React, поощряют и поддерживают высокодинамичные веб-страницы. К сожалению, по моему опыту, рекомендуемый по умолчанию способ написания кода React на самом деле не очень хорошо поддерживает высокодинамичные страницы.

В этом посте я рассмотрю проблемы, возникающие со стандартным кодом React, рекомендуемые варианты повышения производительности React и, наконец, противопоставлю их примерам в vanilla JS.

https://shly.link/ixyLf

5 маленьких и скрытых библиотек React, которые вы уже должны использовать

Если вы, как и я, любите находить маленькие жемчужины в каталоге NPM для улучшения вашего процесса разработки, сегодня ваш счастливый день.

Я начинаю новую серию статей, где я покажу некоторые небольшие и малоизвестные библиотеки , которые я нашел и использую каждый день, которые избавят вас от головной боли.

Итак, начнем!

(если пост не открывается полностью,войдите в режиме инкогнито )

https://shly.link/YyEJd

Лекарство от ада React useState

Вы когда-нибудь попадали в ад хуков React useState?

https://shly.link/dev6C35

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

Вот упрощенное объяснение разницы между ними: https://shly.link/devFwiM

Как выучить React в 2023 году

В этом руководстве я покажу вам самые ценные ресурсы и советы, которые, по моему мнению, помогут вам быстрее освоить React. Вы также сэкономите много драгоценного времени и энергии в процессе.

https://shly.link/Dvik5

Компоненты React для интерактивной математики

Создавайте интерактивные анимированные визуализации с помощью декларативного кода.
https://shly.link/ghXcxY

Делаем Анимацию В React С Помощью Framer Motion

Сегодня мы рассмотрим самую популярную и простую в использовании библиотеку анимации в React — Framer motion. Мы увидим, как мы можем легко добавить его в наше приложение React и создать потрясающую анимацию за несколько шагов.

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

https://shly.link/hmuxN

В этом руководстве вы узнаете, как создать веб-приложение, которое позволяет отправлять пользователям уведомления, созданные ChatGPT, с помощью React и NodeJS.

https://shly.link/devWXx4

Лучшие практики React JS

Работая с сайтами, которые ежегодно посещают более 50 миллиардов человек , я пишу на технические темы и учу инженеров иметь прочную основу, которая поможет им продвинуться по карьерной лестнице.
https://shly.link/CEdDQ

Привет, React, до свидания, useEffect (надеюсь)

В этой статье я покажу вам, как использовать React для замены useEffect в большинстве случаев.

https://shly.link/devmmd3

Применение шаблонов проектирования в React

Эта статья посвящена проблеме, с которой многие из нас сталкиваются при разработке React и Frontend (иногда даже не осознавая, что это проблема): наличие части логики, реализованной в различных компонентах, хуках, утилитах и ​​т. д.

Давайте углубимся в детали проблемы и способы ее решения. Как следует из названия, мы собираемся использовать шаблон стратегии для ее решения.

https://shly.link/devYTSB

Создайте приложение для чата в реальном времени с помощью Rust и React

Если вы хотите создать быстрое и надежное приложение для чата в реальном времени, рассмотрите возможность использования Rust и React. Rust известен своей скоростью и надежностью, а React — один из самых популярных интерфейсных фреймворков для создания пользовательских интерфейсов.
https://shly.link/kN3Bh

Conditional wrapping в React

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

Мы могли бы использовать оператор if...else, но он выглядит беспорядочно.

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

Мы могли бы использовать оператор if...else, но он выглядит беспорядочно.

https://shly.link/devi4V7

Svelte vs React: какой фреймворк изучать в 2023 году?

В мире веб-разработки иногда может показаться, что новый интерфейсный фреймворк появляется каждый день! Большинство приходят и уходят, но одно можно сказать наверняка: Svelte останется.

Это не обязательно означает, что вы должны бросить все и выучить это сегодня! Постоянная погоня за последними тенденциями может вас отвлечь и перегрузить.

Этот пост ответит на вопрос, стоит ли мне изучать React или Svelte? раз и навсегда.

Вы увидите несколько примеров кода, объясняющих, почему разработчики React сходят с ума по Svelte, но мы также должны быть реалистами.

React существует намного дольше. Доступно больше библиотек, поддержки и заданий.

Может ли Svelte заменить React? Давай выясним!

https://shly.link/dev9w7D

Веб-воркеры, React и TypeScript

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

https://shly.link/rnv6B

Я попросил Chat GPT создать приложение To-Do. Наконец-то мы встретили нашу замену?

Нас снова заменит ИИ?
Давайте посмотрим, как это было.
https://shly.link/vgMMW

7 полезных библиотек React, которые вы должны использовать в своем следующем проекте

Зачем использовать пользовательский код, когда есть готовые решения? Библиотеки необходимы любому разработчику. Я думаю, что это хорошая идея - использовать некоторые из лучших библиотек. В React есть множество отличных подбиблиотек для создания пользовательских интерфейсов, поэтому я составил список из 7 библиотек React, которые могут помочь вам в процессе разработки.

(если пост не открывается полностью, откройте в режиме инкогнито)

https://shly.link/GGAYM

React — самая популярная библиотека для фронтенд-разработки. А ещё это стабильный фреймфорк, который легко поддерживать, поэтому на нём пишут большие популярные веб-приложения. Если вы ищете новую интересную работу в IT или мечтаете о повышении, то вам подойдет курс Яндекс Практикума «React-разработчик». Курс длится всего 3 месяца, но за это время мы научим вас:

•уверенно разбираться в библиотеке React;
•использовать TypeScript при разработке React-приложений;
•тестировать веб-приложения с помощью юнит-тестов и cypress.

Учёбе нужно будет уделять 20-25 часов в неделю. Обучение разбито на спринты, заниматься можно когда угодно, главное — уложиться в дедлайн.

На всех этапах вас будут сопровождать опытные разработчики: мы не дадим просесть по учёбе и поможем выкроить время на образование. Вы будете практиковаться на реальных кейсах и положите в портфолио работающие проекты. А карьерные консультации подготовят вас к разговору о повышении или помогут с поиском новой работы. 

Записаться на курс можно здесь: https://practicum.yandex.ru/react/

Вышел Vite 4.0!

Vite 3 был выпущен пять месяцев назад. С тех пор количество загрузок npm в неделю увеличилось с 1 миллиона до 2,5 миллионов. Экосистема тоже созрела и продолжает расти.
https://shly.link/bbCUM