Путь развития Frontend разработчика (Вторая часть)

Путь развития Frontend разработчика (Вторая часть)

Это вторая часть roadmap frontend разработчика, Если вы не читали первую часть, то настоятельно рекомендую ознакомится, Первая часть. В этой статье я продолжу вам рассказывать про мое представление современной карты развития frontend разработчика. Читать далее

Подробнее
Обзор на новую CSS-in-JS либу от Facebook* – StyleX

Обзор на новую CSS-in-JS либу от Facebook* – StyleX

Недавно компания Facebook* (aka Meta**) выпустила в опенсорс собственную CSS-in-JS библиотеку под названием StyleX. По заявлениям разработчиков, она отлично подходит для больших проектов и ключевым ее преимуществом является перфоманс. В этой статье мы рассмотрим пример использования, основные функции и особенности данного решения. Читать далее

Подробнее
[Перевод] Использование Content-Security-Policy вместе с React & Emotion

[Перевод] Использование Content-Security-Policy вместе с React & Emotion

Content-Security-Policy (CSP) - это HTTP заголовок, который улучшает безопасность веб-приложений за счет запрета небезопасных действий, таких как загрузка и отправка данных на произвольные домены, использование eval, inline-скриптов и т.д. В этой статье будет сделан фокус на директиве style-src и ее использование вместе с CSS-in-JS библиотекой emotion. Читать далее

Подробнее
Приглашаем на онлайн-митап «Гетерогенность, или Деплой JavaScript туда и обратно»

Приглашаем на онлайн-митап «Гетерогенность, или Деплой JavaScript туда и обратно»

В четверг, 26 октября, в 17:00 состоится онлайн-митап, посвященный JS-разработке: «Гетерогенность, или Деплой JavaScript туда и обратно». На ивенте расскажем, как мы в «Лаборатории Касперского» развернули несколько веб-приложений в совершенно разных средах на единой кодовой базе, разберем построение В2В единой консоли — комплексного, сложного приложения; единую модель деплоймента для cloud-native-разработки и on-premise; а также разработку в распределенных командах (фича-тимы). Читать…

Подробнее
«Нейрогород»: игра на знание JavaScript про фронтендерские баги

«Нейрогород»: игра на знание JavaScript про фронтендерские баги

Нейроград — первый виртуальный мегаполис, в который вот-вот прибудут пользователи. Но есть проблема — кто-то испортил внешний облик города. Целевая атака? Козни тайного врага? Выясните, кто стоит за этим! А заодно — устраните все баги, обращая внимание на любые странные и необычные явления во внешнем облике города. Читать дальше →

Подробнее
React: как сделать динамический суффикс в <input />, который будет двигаться вместе с набранным текстом

React: как сделать динамический суффикс в <input />, который будет двигаться вместе с набранным текстом

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

Подробнее
Простое должно быть простым: Палки в разметку

Простое должно быть простым: Палки в разметку

Html/css и его вариации, предлагают могучий инструментарий для воплощения самых смелых фантазий дизайнеров. И, наверное, при регулярном и глубоком погружении в тему верстки, весь этот инструментарий "прокэширован в подкорке" и "вертится на кончиках пальцев"... А как быть тем, кто заходит в сияющий мир CSS лишь изредка - по необходимости? (А еще под раздачу попадут React-либы MUI и AntD!) Читать далее

Подробнее
Чем хорош и чем плох Tailwind CSS, или «Допустим, у вас стартап!»

Чем хорош и чем плох Tailwind CSS, или «Допустим, у вас стартап!»

Привет, Хабр! Меня зовут Александр Водолазских. Я живу в Новосибирске и я работаю Frontend Domain Lead в СберМаркете. Сегодня хочу немного поговорить об опыте работы с Tailwind CSS — utility-first CSS framework. Поделюсь болью и радостью, которые возникли при его эксплуатации. Читать далее

Подробнее
Текстовый Инпут с возможностью выделять отдельные слова

Текстовый Инпут с возможностью выделять отдельные слова

Как, вроде бы, простая задача превратилась в головную боль. Читать далее

Подробнее
Эмулируем React useState в обычном JS (via data-attributes & css selectors)

Эмулируем React useState в обычном JS (via data-attributes & css selectors)

Добрый день хабр! Решил поделиться своим небольшим, но полезным открытием в плане использования html data-attributes & css selectors. Html data-attributes - это кастомные атрибуты, которые вы можете сами назначать куда-угодно и с каким угодно именем (но имя должно начинаться с префикса data-). Затем вы можете использовать их в css селекторах, чтобы влиять на содержимое классов и уже классами управлять элементами. Движок браузера автоматически среагирует на изменение data-атрибута и

Подробнее
OpenSource на завтрак

OpenSource на завтрак

Делиться своими идеями с сообществом - хорошо и правильно. Это позволяет развиваться, перенимать лучшие практики, исследовать новые инструменты, учиться оформлять свои решения. Но какой код стоит выносить в общий доступ? И как делать это на постоянной основе? Чтобы разобраться в этих вопросах я решил сделать свой Javascript OpenSource Boilerplate - маленькую, но максимально расширяемую библиотеку компонентов. Она называется handy-ones. Читать далее

Подробнее
On-Demand ISR в Next.js или как эффективно обновлять статический контент на сайте, поступающий из CMS или админки

On-Demand ISR в Next.js или как эффективно обновлять статический контент на сайте, поступающий из CMS или админки

В этой статье я расскажу, как и для чего, на одном из своих проектов, мы прикрутили новую возможность Next.js – On-Demand ISR (инкрементная статическая регенерация по запросу). Читать далее

Подробнее