FrontEndDev

29 Apr 2025 13:32

Хотите собрать первое приложение на React за 60 минут?

Присоединяйтесь к открытому уроку от OTUS. Без скучных теорий и банальных todo-листов: только практика, код и живое общение. Вы узнаете, зачем нужны хуки и как компоненты делают интерфейс «живым», и самостоятельно создадите интерактивную игру.

Урок пройдет в преддверии старта курса «React.js Developer». Каждый участник вебинара получит скидку на обучение.

Встречаемся 7 мая в 20:00 МСК, регистрируйтесь прямо сейчас, чтобы не пропустить: https://otus.pw/MA7LW/

Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576

FrontEndDev

29 Apr 2025 04:51

JSON Mocker

Онлайн сервис, позволяющий генерировать JSON данные в соответствии со схемой.

https://laurawebdev.github.io/json-mocker/

FrontEndDev

27 Apr 2025 14:17

Создаем offline-friendly систему загрузки изображений

Как с помощью IndexedDB, service workers и Background Sync API создать приложение, устойчивое к перебоям с сетью.

https://www.smashingmagazine.com/2025/04/building-offline-friendly-image-upload-system/

FrontEndDev

27 Apr 2025 05:32

Настраиваем ts-config.json

Описание основных и экспериментальных параметров ts-config и на что они влияют в итоге при компиляции.

https://jsdevspace.substack.com/p/mastering-tsconfigjson-the-ultimate

FrontEndDev

26 Apr 2025 14:24

Что делает директива 'use client'?

Ден Абрамов рассказывает об использовании 'use client' в новых архитектурах React, где серверные и клиентские компоненты сочетаются друг с другом. А также о типичных ошибках и ограничениях, связанных с использованием этой директивы.

https://overreacted.io/what-does-use-client-do/

FrontEndDev

23 Apr 2025 19:29

Используем Chrome Identity API

Заметка о том, как и где быстро получить oauth client id и как его использовать в расширениях chrome для удобной аутентификации пользователей.

https://jem-space.ru/chrome-identity/

FrontEndDev

22 Apr 2025 14:21

Новый API Cookie Store

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

https://fotis.xyz/posts/the-new-cookie-store-api/

FrontEndDev

21 Apr 2025 03:44

<dl> — еще одна находка, которую вы никогда не используете

Если вы никогда не слышали про элемент <dl>, то вы не одиноки 😁
Для него не так много кейсов, но отображение списков состоящих из пар ключ-значение — самое то!

https://christianheilmann.com/2025/04/18/keeping-it-on-the-dl-another-html-gem-you-never-use/

FrontEndDev

18 Apr 2025 05:09

Добавляем визуальных эффектов с backdrop-filter

Методы комбинирования backdrop-filter с другими CSS-эффектами для создания сложных и интересных дизайнов

https://css-tricks.com/using-css-backdrop-filter-for-ui-effects/

FrontEndDev

15 Apr 2025 14:55

Летняя школа разработки интерфейсов Яндекса открывает прием заявок

Прокачать скиллы фронтенд-разработки и поработать над реальными бизнес-задачами можно в Летней школе Яндекса. Это топовая возможность разобраться в тонкостях создания удобных и надёжных интерфейсов.

Школа пройдет в два этапа:
— со 2 июня по 27 июля участников ждут лекции и практические задания в онлайне
— с 28 июля по 24 августа участники объединятся в полноценные фулстек-команды, чтобы поработать над реальными продуктами и фичами. Каждую группу будет сопровождать опытный наставник компании.


Участие бесплатное, а лучшие смогут попасть на стажировку в Яндекс или даже получить офер.

Если основы JavaScript и HTML/CSS уже знакомы — отправляй заявку до 27 апреля.

FrontEndDev

15 Apr 2025 06:08

Топ 5 ошибок в CSS меню навигации

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

https://blog.css-weekly.com/top-5-css-navigation-menu-mistakes

FrontEndDev

14 Apr 2025 05:41

Современные и малоизвестные фичи JS

Несколько фич JS, которые давно или недавно доступны разработчикам, но редко используются: Promise.withResolvers, .at(), replace c коллбеком, structuredClone и еще несколько.

https://jem-space.ru/js-features/

FrontEndDev

09 Apr 2025 13:04

26–27 апреля проводим Weekend Offer Frontend

Устроиться в Яндекс за выходные — реально. Ищем крутых фронтендеров с опытом работы от 4 лет, готовых работать в офисном или гибридном режиме в России.

Подавайте заявку до 23 апреля — и всего за два дня пройдите все технические собеседования. После сможете пообщаться с нанимающими менеджерами и выбрать из 10 команд ту, которая покажется самой интересной. Если всё сложится хорошо, сразу же пришлём вам офер.

Узнать подробности и зарегистрироваться.

FrontEndDev

08 Apr 2025 09:36

Cover Flow на современном CSS

Эдди Османи проводит небольшой исторический экскурс в Cover Flow, популяризированный Apple. А также предлагает современный подход к воссозданию этого эффекта с использованием только HTML и CSS, опираясь на CSS Scroll Snap и Scroll-Driven Animations API.

https://addyosmani.com/blog/coverflow/

FrontEndDev

06 Apr 2025 15:41

Первый взгляд на attr() в CSS

Ахмад Шадид рассказывает о работе attr(), его преимуществах и где его удобно применять.

https://ishadeed.com/article/modern-attr/

FrontEndDev

29 Apr 2025 12:26

CSS Hell

15 CSS головоломок для пытливых умов, где нужно менять свойства для того чтобы сматчить элементы.

https://csshell.com/

FrontEndDev

28 Apr 2025 21:46

Делаем карусели с GSAP

Руководство от Тома Миллера по созданию каруселей: от простых до продвинутых.

https://tympanus.net/codrops/2025/04/21/mastering-carousels-with-gsap-from-basics-to-advanced-animation/

FrontEndDev

27 Apr 2025 10:17

⚡ Дождались! Ребята сделали крутейший канал про Frontend

Здесь на простых картинках и понятном языке обучают фронтенд-разработке, делятся полезными фишками и ресурсами

Подписывайтесь: @FrontendPortal

FrontEndDev

26 Apr 2025 17:41

Session vs JWT: различия, которые стоит знать

Различия между сессионной аутентификацией и использованием JSON Web Tokens для управления пользовательскими сессиями. О работе каждого из этих методов, их преимуществах и недостатках, а также ситуациях, в которых предпочтительнее использовать тот или иной подход.

https://www.youtube.com/watch?v=fyTxwIa-1U0

FrontEndDev

24 Apr 2025 11:15

Создавать сайты и приложения с нуля и зарабатывать 200+ тысяч рублей?

Фулстек-разработчик — программист с универсальными навыками и знанием нескольких языков, один из самых востребованных специалистов на рынке.

Именно таких мы готовим на совместной программе Нетологии и ВШЭ онлайн-бакалавриата «Программные системы и автоматизация процессов разработки».

Хотите узнать о программе подробнее? Ждём вас 29 апреля на дне открытых дверей.

В программе:
● встреча с академическим руководителем, научным руководителем и ментором программы;
● рассказ о том, чем занимается фулстек-разработчик и почему это одна из наиболее востребованных профессий на рынке;
● обзор онлайн-бакалавриата: как устроено обучение и практика, стажировки, кто преподаёт на программе.

День открытых дверей — возможность познакомиться с, возможно, вашей будущей профессией. Ждём вас!

Реклама. ООО "Нетология", ИНН: 7726464125, erid: 2VSb5zBMESc

FrontEndDev

23 Apr 2025 10:11

Улучшаем производительность SPA

Методы оптимизации одностраничных приложений для улучшения UX.
Анализ узкиx мест: JavaScript-бандлы, неэффективный рендеринг компонентов и частые API-запросы. В качестве решений: разделение кода, ленивая загрузка, виртуализация и использование Web Workers.

https://dev.to/oltrenin/improving-spa-performance-2k2g

FrontEndDev

21 Apr 2025 20:12

Продвинутый React в дикой природе

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

Рассматриваются реальные примеры оптимизации производительности, такие как улучшение метрики INP, переход от клиентского к серверному рендерингу и внедрение современных подходов к управлению состоянием и маршрутизации.

https://largeapps.dev/case-studies/advanced/

FrontEndDev

18 Apr 2025 09:45

Создание перекидного табло на JS

Пошаговый процесс создания анимации табло аэропорта с помощью GSAP.

Демо: https://codepen.io/jh3y/pen/yyLmeJd

https://craftofui.substack.com/p/time-travel-with-javascript

FrontEndDev

16 Apr 2025 09:58

Погружаемся в работу сети

Как данные передаются от сервера к вашему устройству? Подробная статья о модели OSI и TCP/IP, а также протоколах TCP, UDP и HTTP. Пошаговое описание того, как данные проходят через различные уровни сетевой модели, превращаясь из запроса в браузере в электрические сигналы, которые пересекают океаны, чтобы достичь вашего экрана.

https://www.deepintodev.com/blog/how-data-travels-the-world-to-reach-your-screen

FrontEndDev

15 Apr 2025 13:44

Глубокое погружение в React Reconciliation

Подробное объяснение, как React обновляет DOM с помощью алгоритма reconciliation, как React сохраняет или сбрасывает состояние в зависимости от типа и позиции элементов в дереве компонентов. Плюсом обсуждаются внутренние структуры React и даются советы по оптимизации производительности.

https://cekrem.github.io/posts/react-reconciliation-deep-dive/

FrontEndDev

14 Apr 2025 19:04

Lighthouse Scoring Calculator

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

https://googlechrome.github.io/lighthouse/scorecalc/

FrontEndDev

11 Apr 2025 08:20

Создаем LQIP изображения с помощью CSS

Cпособ создания размытых изображений-плейсхолдеров с помощью одной CSS-переменной и радиальных градиентов. Изображение кодируется в целое число и декодируется средствами CSS прямо в браузере. Метод обеспечивает мгновенное отображение плейсхолдера.

https://leanrada.com/notes/css-only-lqip/

FrontEndDev

08 Apr 2025 13:23

Решаем проблемы связанные с загрузкой ресурсов блокирующих рендер

О методах оптимизации загрузки блокирующих ресурсов: инлайнинг критического CSS, отложенная загрузку некритических стилей и скриптов, а также удаление неиспользуемого кода, с целью улучшения показателей FCP и LCP.

https://blog.logrocket.com/eliminate-render-blocking-resources-css-javascript/

FrontEndDev

07 Apr 2025 14:01

📥 Разработчики, больше никаких ложных срабатываний при анализе сторонних библиотек. Positive Technologies выпустила новую версию сканера PT Application Inspector.

🌀 В релизе объединили технологии анализа сторонних компонентов и статического анализа кода приложения — в продукте появились возможности анализа достижимости и поиска транзитивных зависимостей.

Результаты тестирования новой версии на 193 открытых проектах на GitHub, использующих уязвимые компоненты, впечатляют: количество ложноположительных срабатываний снизилось на 98–100%. Теперь можно сэкономить время на анализе срабатываний и сосредоточиться на исправлении реальных дефектов безопасности.

❌ Надоело копаться в ложных срабатываниях? Оставьте заявку на тестирование PT Application Inspector.

FrontEndDev

06 Apr 2025 10:55

Apache ECharts для визуализации данных

Таня Раския рассказывает как интегрировать Apache ECharts в React-приложение: как установить библиотеку, использовать компонент echarts-for-react и настраивать графики. Также приводит примеры кастомизации и обновления данных в диаграммах.

https://tania.dev/apache-echarts-react/