front_end_dev | Technologies

Telegram-канал front_end_dev - FrontEndDev

28143

🚀 Статьи, новости, туториалы по frontend разработке. http://jem-space.ru Admin: @jem_jem Пишу в @five_a_m Читать на парковке: https://max.ru/front_end_dev Реклама: http://bit.ly/2NxmVDu РКН: https://clck.ru/3GLw7G

Subscribe to a channel

FrontEndDev

Как тимлиду победить синдром самозванца. Бесплатный урок курса «Руководитель команд в ИТ»

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

На открытом уроке 23 июня в 20:00 разберём, почему у начинающих и действующих руководителей возникает синдром самозванца. Поговорим о том, как отличать реальные зоны роста от необоснованной неуверенности, какие ожидания от тимлида действительно реалистичны, а какие только создают лишнее давление. Отдельно обсудим, как управленческие ошибки отличаются от нормальной адаптации к новой роли и почему сложная ситуация не всегда доказывает вашу некомпетентность.

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

Урок не для тех, кто ждёт универсальный способ «стать уверенным за один вечер». Он будет полезен начинающим тимлидам, действующим руководителям команд, опытным разработчикам перед переходом в лидерскую роль и специалистам, которые хотят систематизировать управленческие навыки без лишней тревоги и самокопания.

👉 Записаться: https://otus.pw/uFHK/

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

Читать полностью…

FrontEndDev

ShadowRealm в JavaScript

Новый API ShadowRealm предлагает изоляцию исполнения кода в отдельной среде, чтобы безопаснее отделять контекст и глобальные объекты. Разбираемся, как это соотносится с realms в браузере и почему это шаг к более надежным приложениям.

https://css-tricks.com/soon-we-can-finally-banish-javascript-to-the-shadowrealm/

Читать полностью…

FrontEndDev

Карточки фиксированной высоты: хрупкость, о которой легко забыть

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

https://css-tricks.com/fixed-height-cards-more-fragile-than-they-look/

Читать полностью…

FrontEndDev

Десктоп приложения с Zig и WebView: маленькие бинарники и быстрые сборки

Zero-native позволяет собирать нативные десктоп приложения с веб интерфейсом через системный WebView или встроенный Chromium, сохраняя общий API и гибко выбирая движок под задачу.

https://zero-native.dev/

Читать полностью…

FrontEndDev

Профессиональные скилы для AI coding agents

Собирайте пайплайны для AI агентов с workflow, quality gates и best practices уровня senior инженеров, чтобы код выходил предсказуемым и поддерживаемым.

https://github.com/addyosmani/agent-skills

Читать полностью…

FrontEndDev

Почему стоит мигрировать на Valibot

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

https://valibot.dev/blog/why-migrate-to-valibot/

Читать полностью…

FrontEndDev

Twoslash как удобный формат разметки для TypeScript

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

https://github.com/twoslashes/twoslash

Читать полностью…

FrontEndDev

Параллельное выполнение в Node.js без ошибок

Разбираем как правильно организовать параллельную обработку задач в Node.js, чтобы не упереться в блокировки, перегрузку event loop и проблемы с управлением ресурсами. Плюс практические подходы и примеры для ускорения веб приложений.

https://github.com/yankouskia/hurried

Читать полностью…

FrontEndDev

Привет!
В общем, у меня сосед по этажу работает в Авито. Вчера вернулся с работы поздно, на веселе. Особо ниче не рассказал, говорил че-то про июль, ДК «Кристалл».

Поспрашивал знакомых из IT, говорят ходит слух, что онлайн-тусовка для айтишников АвитоТехно выходит в офлайн. Что ж, остаётся только ждать старт регистрации...

Читать полностью…

FrontEndDev

Забытые HTML и CSS фичи, которые до сих пор полезны

Contenteditable для редактирования текста прямо в браузере, а также элемент time с datetime для корректной разметки дат и времени. Эти возможности упрощают UX и делают интерфейсы более семантичными и удобными для браузеров.

https://habr.com/ru/companies/ruvds/articles/1029698/

Читать полностью…

FrontEndDev

WebMCP: что даст браузеру единый интерфейс для инструментальных вызовов ИИ

WebMCP превращает сценарии подписки и других действий с сайта из долгих скриншотных обходов в быстрые вызовы функций через navigator.modelContext.registerTool, сокращая latency и стоимость.

https://habr.com/ru/articles/1031164/

Читать полностью…

FrontEndDev

Затенение переменных в JavaScript и как не наступать на грабли

Variable shadowing ломает ожидания, когда имена переменных совпадают в разных областях видимости, и приводит к ошибкам или неожиданным значениям. Разбераемся, как это работает для let, var и глобальных переменных через window, чтобы писать предсказуемый код.

https://habr.com/ru/articles/1028948/

Читать полностью…

FrontEndDev

Rolldown 1.0 стабилен и готов к продакшену

Rolldown это быстрый JavaScript бандлер на Rust, который совместим с Rollup плагинами. Обновление с последнего RC обычно проходит без правок кода, а Vite 8 уже использует Rolldown как основной бандлер.

https://voidzero.dev/posts/announcing-rolldown-1-0

Читать полностью…

FrontEndDev

pnpm 11.1: новые префиксы для GitHub Packages и улучшенная диагностика

В pnpm 11.1 добавили поддержку gh: prefix для GitHub Packages, а также обновили pnpm bugs и pnpm audit для более удобного открытия трекера ошибок и проверки ECDSA подписей реестра.

https://github.com/pnpm/pnpm/releases/tag/v11.1.0

Читать полностью…

FrontEndDev

FastMCP для быстрых MCP серверов на TypeScript

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

https://github.com/punkpeye/fastmcp

Читать полностью…

FrontEndDev

React useOptimistic для мгновенных обновлений интерфейса в продакшене

Разбираем useOptimistic в React и практические паттерны, чтобы UI реагировал сразу, а затем корректно синхронизировался с реальными данными после подтверждения или ошибки. Подходит для быстрых форм, лент и сценариев с оптимистичными апдейтами.

https://www.sitepoint.com/react-useoptimistic-production-patterns-for-instant-ui-updates/

Читать полностью…

FrontEndDev

Разбираем Bulletproof React: как навести порядок в кодовой базе

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

https://habr.com/ru/articles/1033506/

Читать полностью…

FrontEndDev

Ежедневные flexbox головоломки

Прокачивайте CSS Flexbox через ежедневные задачи: нужно собрать целевой layout, подбирая свойства flexbox, чтобы добиться нужного выравнивания и поведения элементов.

https://flexboxle.com

Читать полностью…

FrontEndDev

Mobile View

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

https://mobileview.app/

Читать полностью…

FrontEndDev

Вопросы на собеседование по TypeScript: рефакторинг без риска

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

https://habr.com/ru/articles/1033686/

Читать полностью…

FrontEndDev

Animata - анимированные React компоненты для вставки в проект

Готовая библиотека из 158+ анимированных React компонентов, которые можно просто скопировать в репозиторий без установки и обновлений, чтобы быстрее делать интерфейсы и сразу получать доступность и поддержку reduced motion.

https://animata.design/

Читать полностью…

FrontEndDev

Blue: компиляция JavaScript в нативные бинарники

Blue компилирует ваш JS в C++ и собирает самостоятельный нативный исполняемый файл: нативные окна, файловая система и HTTP-серверы без Electron и без Node.js во время выполнения.

https://bluejs.dev/

Читать полностью…

FrontEndDev

Примеры same page view transitions

Разбираем практические демо same page переходов через View Transitions API, чтобы анимации между состояниями интерфейса выглядели плавно и предсказуемо для пользователя.

https://frontendmasters.com/blog/same-page-view-transition-examples/

Читать полностью…

FrontEndDev

CSS, который реально можно брать в работу уже сейчас

Появились якорное позиционирование без лишней возни с DOM, @scope для аккуратного скопирования селекторов, контейнерные запросы только по имени, а также shape() и shape-outside для нативной геометрии и типографики. Плюс новые view-transition-class и типы для SPA анимаций и более точные единицы rcap rch rex ric для контроля текста.

https://nerdy.dev/CSS-recently-in-all-browsers

Читать полностью…

FrontEndDev

PM2 7.0

В PM2 7.0 уменьшили зависимости, расширили cluster mode и обновили monitoring agent для приложений на Bun, чтобы проще и стабильнее держать продакшен. Отличный апгрейд для тех, кто управляет Node процессами и следит за метриками в реальном времени.

https://github.com/Unitech/pm2/releases/tag/v7.0.0

Читать полностью…

FrontEndDev

Анимации по скроллу на чистом CSS с Animation Timeline API

Animation Timeline позволяет привязать keyframes к прогрессу элемента в viewport и получать скролл анимации без JavaScript. Разберем базовую идею, настройку easing и типичные нюансы для продакшн интерфейсов.

https://www.joshwcomeau.com/animation/scroll-driven-animations/

Читать полностью…

FrontEndDev

Мастер класс по отладке Next.js: логи, трассировка и полный контекст

Разбираемся с Next.js багами без прыжков между инструментами: пишете логи, которые объясняют где, что и почему, и связывают браузер и Node. В итоге получаете сквозную картину проблем для ускорения диагностики и исправлений.

https://sentry.io/resources/nextjs-may-workshop/

Читать полностью…

FrontEndDev

React стек 2026: карта лучших библиотек по категориям

Разберем, какие библиотеки сейчас реально закрывают роутинг, UI, стейт-менеджмент, формы и таблицы в React, чтобы собрать проект без гаданий по package.json. Сфокусируемся на практичных выборах и актуальных альтернативах под разные сценарии разработки.

https://habr.com/ru/articles/1032830/

Читать полностью…

FrontEndDev

Интерактивный trail из картинок с гравитацией на GSAP

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

Демо

https://tympanus.net/codrops/2026/05/20/made-with-gsap-building-a-fun-gravity-based-mouse-trail/

Читать полностью…

FrontEndDev

Сюрпризы кроссдокументных view transitions: что ломается и как этого избежать

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

https://css-tricks.com/cross-document-view-transitions-part-1/

Читать полностью…
Subscribe to a channel