Как стать автором
Обновить
0
0

Пользователь

Отправить сообщение

Кастомные хуки в React: лучшие практики, пример использования и покрытия тестами

Уровень сложностиПростой
Время на прочтение10 мин
Количество просмотров23K

Когда я искал свою первую работу в качестве Frontend-разработчика, меня часто спрашивали, умею ли я писать кастомные хуки в React. Тогда я только начинал изучать React и только-только запомнил основы, такие как useState и useEffect. Слово «кастомный хук» для меня было новым и сложным. Но теперь, когда я уже более опытный разработчик, знаю, что это значит и как их использовать.

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

Читать далее
Всего голосов 11: ↑9 и ↓2+9
Комментарии9

Создание внутреннего пакета компонентов React — проще, чем кажется

Время на прочтение14 мин
Количество просмотров4.2K

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

Я frontend-разработчик SimbirSoft Эллина, и в этой статье расскажу, как создать внутренний пакет компонентов в React с помощью инструмента сборки Rollup, а также как сделать его более качественным и удобным для использования. Материал будет полезен frontend-разработчикам уровней junior+ и middle.

Читать далее ?
Всего голосов 3: ↑2 и ↓1+2
Комментарии2

Памяти Кевина Митника — хакера, ломавшего ФБР, АНБ и Кремниевую долину. Часть 1: бурная юность тёмного гения

Уровень сложностиПростой
Время на прочтение8 мин
Количество просмотров38K

16 июля 2023 года в возрасте 59 лет наш мир покинул Кевин Митник — один из самых знаменитых и архетипичных хакеров в истории. В середине 90-х он считался самым разыскиваемым хакером в мире, и было за что: Митник лихо взламывал сети корпораций и правительства США, обходил большинство систем безопасности, прослушивал агентов ФБР, добывал тонны конфиденциальной информации и данных о банковских картах, включая счета топов Кремниевой долины, — вот только денег, как считается, он никогда не воровал. Ну а закрыв проблемы с американским законом, Кевин Митник превратился в одного из лучших специалистов по кибербезопасности. Вспомним о человеке, на основе которого во многом и сформировался классический образ хакера 90-х годов.
Читать дальше →
Всего голосов 60: ↑56 и ↓4+74
Комментарии33

React Fiber & Concurrency Part 2 (2)

Уровень сложностиПростой
Время на прочтение8 мин
Количество просмотров4.5K

Данная статья посвящена реализации не блокирующего рендеринга - Concurrent React. Мы рассмотрим то, как работают под капотом Concurrent Features добавленные в 18 версии React. На основе теоретических знаний разберем результат профилирования тренировочного приложения и наглядно увидим, как Concurrent Features разбивают рендеринг приложения.

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

Читать далее
Всего голосов 3: ↑3 и ↓0+3
Комментарии0

Продвинутый телеграмм бот на Java (Spring, postgres и free deploy)

Уровень сложностиСредний
Время на прочтение13 мин
Количество просмотров19K

На дворе 2023 год. На хабре до сих пор пишут статьи по созданию телеграмм ботов, скажите вы, но не спешите с выводами. Во-первых, пожалеем студентов, во многих вузах на программистских направлениях до сих пор заставляют писать ботов хотя бы раз в течение обучения. И многие гайды в интернете немножко outdated в плане деплоя (хероку умер, доздравствует... но об этом немного позже). Т.е. основным уклоном данной статьи будет именно этот аспект. Ну и сам бот у нас будет также не скучный и не самый простой, какие часто в гайдах, а с полноценной привязкой к базе данных, т.е. полноценное Spring приложение.

Ну так о чем же бот и как мне пришла в голову такая идея?

Читать далее
Всего голосов 5: ↑3 и ↓2+1
Комментарии2

Как сделать эффект Parallax с помощью CSS

Уровень сложностиПростой
Время на прочтение15 мин
Количество просмотров12K


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

В этой статье мы рассмотрим, в каких ситуациях оправдано использование параллакс-скроллинга, разберем, как реализовать его с помощью CSS, и почему для этого стоит использовать именно CSS, а не JavaScript. Приведем несколько примеров CSS-параллакса, варианты его использования и лучшие практики.
Читать далее
Всего голосов 17: ↑14 и ↓3+13
Комментарии1

Реализация Server-Side Rendering (SSR) при помощи Bun и React

Уровень сложностиПростой
Время на прочтение7 мин
Количество просмотров7.1K

Bun — «швейцарский нож» для JavaScript, который все ждали, наконец релизнулся и уже стал геймченджером. Bun представляет собой универсальную среду выполнения JavaScript и набор инструментов, рассчитанный на высокую скорость работы. В его состав входят бандлер, тест-раннер, встроенная поддержка TypeScript и JSX и даже менеджер пакетов, совместимый с Node.js.

Дисклеймер: это вольный перевод статьи из блога Алекса Кейтса. С оригинальным постом можно ознакомиться здесь.

Читать далее
Всего голосов 2: ↑2 и ↓0+2
Комментарии7

Rematch — Redux без шаблонного кода

Уровень сложностиПростой
Время на прочтение7 мин
Количество просмотров3.6K

Сегодня я хотел бы рассказать о Rematch — библиотеке, которая предоставляет удобный и эффективный способ управления состоянием ваших веб-приложений. Если вы уже знакомы с Redux и ищете более простое и компактное решение, то Rematch может оказаться для вас полезным инструментом. 

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

Rematch предлагает удобный синтаксис и позволяет избежать написания многочисленных бойлерплейтов, свойственных Redux. С помощью него вы можете быстро создавать и организовывать Redux-хранилище, экономя при этом время и упрощая процесс разработки. Rematch идеально подходит для различных типов проектов, независимо от их размера и сложности.

С помощью Rematch вы можете определить модели (models) и их состояние, эффекты (effects) и редьюсеры (reducers). Он предоставляет удобные инструменты для работы с асинхронными операциями, а также возможность создания селекторов (selectors) для выборки данных из хранилища. Все это помогает организовать логику вашего приложения и управлять его состоянием с минимальными усилиями.

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

Читать далее
Всего голосов 6: ↑4 и ↓2+3
Комментарии25

Конфигурируем веб-сервер для Next.js

Время на прочтение3 мин
Количество просмотров19K

Казалось бы, что развёртывание приложений на Next.js не влечёт за собой трудностей - установил зависимости, сделал "npm run build && npm run start" и проксируешь запросы на 3000-ый порт, но для оптимальной работы предстоит сделать кое-что ещё.

Читать далее
Всего голосов 2: ↑2 и ↓0+2
Комментарии12

Service Workers. Инструкция по применению

Время на прочтение9 мин
Количество просмотров136K


Количество выходов в интернет с мобильных устройств ежегодно растёт на 2-4% в год. Качество связи не успевает за такими темпами. Как итог, даже самое лучшее веб-приложение обеспечит ужасный опыт, если пользователь не сможет его загрузить.

Проблема в том, что до сих пор нет хорошего механизма управления кэшем ресурсов и результатов сетевых запросов. В своей статье я хочу рассказать как Service Worker (SW) может помочь в решении этой задачи. Объясню в формате рецептов — какие элементы и в какой пропорции смешать, чтобы получить нужный результат, исходя из задачи и требований.
Поехали!
Всего голосов 57: ↑57 и ↓0+57
Комментарии40

ESLint. Анатомия правил линтинга: разбираем структуру, создаём собственное правило для React-приложения

Уровень сложностиСредний
Время на прочтение13 мин
Количество просмотров19K

Всем привет! Меня зовут Анастасия Щедрина, я технический лидер по фронтенду проекта размещения объявлений в компании Домклик. Сегодня я расскажу вам немного о том, как устроены правила в ESLint, и покажу на примере, как можно разработать собственные.

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

Читать далее
Всего голосов 28: ↑28 и ↓0+28
Комментарии1

Учим PixiJS на играх

Уровень сложностиПростой
Время на прочтение60 мин
Количество просмотров25K

В статье описал разработку 13-ти игр на PixiJS. Около 70% текста - это описание механики игр, остальное - реализация на PixiJS. Получилось много текста, т.к. описывать советы для PixiJS интереснее с примером из игр.
Самая последняя игра будет самой сложной и интересной.

Читать далее
Всего голосов 21: ↑20 и ↓1+23
Комментарии6

Информация

В рейтинге
Не участвует
Зарегистрирован
Активность

Специализация

Frontend Developer, Web Developer
Lead
От 250 000 ₽
JavaScript
TypeScript
React