FrontEndDev
Kanalga Telegram’da o‘tish
🚀 Статьи, новости, туториалы по frontend разработке. http://jem-space.ru Admin: @jem_jem Пишу в @five_a_m AI и вайбкод @vibe_and_ai Читать на парковке: https://max.ru/front_end_dev Реклама: http://bit.ly/2NxmVDu РКН: https://clck.ru/3GLw7G
Ko'proq ko'rsatish
Tarmoq:📈 Telegram kanali FrontEndDev analitikasi
FrontEndDev (@front_end_dev) Rus til segmentidagi kanali faol ishtirokchi. Hozirda hamjamiyat 25 944 obunachidan iborat bo'lib, Texnologiyalar & Aralashmalar toifasida 5 003-o'rinni va Rossiya mintaqasida 24 972-o'rinni egallagan.
📊 Auditoriya ko‘rsatkichlari va dinamika
невідомо sanasidan buyon loyiha tez o‘sib, 25 944 obunachiga ega bo‘ldi.
15 Sentabr, 2026 dagi oxirgi ma’lumotlarga ko‘ra kanal barqaror faollikka ega. Oxirgi 30 kunda obunachilar soni -200 ga, so‘nggi 24 soatda esa -13 ga o‘zgardi va umumiy qamrov yuqori darajada qolmoqda.
- Tasdiqlash holati: Tasdiqlanmagan
- Jalb etish (ER): Auditoriya o‘rtacha 10.37% darajada jalb etiladi. Nashrdan keyingi dastlabki 24 soatda kontent odatda umumiy obunachilar sonining 5.96% ini tashkil etuvchi reaksiyalarni to‘playdi.
- Post qamrovi: Har bir post o‘rtacha 2 690 marta ko‘riladi; birinchi sutkada odatda 1 547 ta ko‘rish yig‘iladi.
- Reaksiyalar va o‘zaro ta’sir: Auditoriya faol: har bir postga o‘rtacha 10 ta reaksiya keladi.
- Tematik yo‘nalishlar: Kontent css, api, интерфейс, html, frontend kabi asosiy mavzularga jamlangan.
📝 Tavsif va kontent siyosati
Muallif resursni shaxsiy fikrni ifoda etish maydoni sifatida ta’riflaydi:
“🚀 Статьи, новости, туториалы по frontend разработке.
http://jem-space.ru
Admin: @jem_jem
Пишу в @five_a_m
AI и вайбкод @vibe_and_ai
Читать на парковке: https://max.ru/front_end_dev
Реклама: http://bit.ly/2NxmVDu
РКН: https://clck.ru/3GLw7G”
Yuqori yangilanish chastotasi (oxirgi ma’lumot 16 Sentabr, 2026 da olingan) sababli kanal doimo dolzarb va katta qamrovli bo‘lib qoladi. Analitika auditoriya kontent bilan faol hamkorlik qilishini, uni Texnologiyalar & Aralashmalar toifasidagi muhim ta’sir nuqtasiga aylantirishini ko‘rsatadi.
25 944
Obunachilar
-1324 soatlar
-637 kun
-20030 kun
Ma'lumot yuklanmoqda...
O'xshash kanallar
Taglar buluti
Kirish va chiqish esdaliklari
---
---
---
---
---
---
Obunachilarni jalb qilish
Sentabr '26
Sentabr '26
+37
0 kanalda
Avgust '26
+52
0 kanalda
Get PRO
Iyul '26
+81
0 kanalda
Get PRO
Iyun '26
+84
0 kanalda
Get PRO
May '26
+84
0 kanalda
Get PRO
Aprel '26
+60
0 kanalda
Get PRO
Mart '26
+68
2 kanalda
Get PRO
Fevral '26
+80
0 kanalda
Get PRO
Yanvar '26
+93
0 kanalda
Get PRO
Dekabr '25
+96
2 kanalda
Get PRO
Noyabr '25
+110
1 kanalda
Get PRO
Oktabr '25
+224
0 kanalda
Get PRO
Sentabr '25
+107
2 kanalda
Get PRO
Avgust '25
+160
0 kanalda
Get PRO
Iyul '25
+162
0 kanalda
Get PRO
Iyun '25
+149
0 kanalda
Get PRO
May '25
+154
0 kanalda
Get PRO
Aprel '25
+236
1 kanalda
Get PRO
Mart '25
+259
1 kanalda
Get PRO
Fevral '25
+277
0 kanalda
Get PRO
Yanvar '25
+367
1 kanalda
Get PRO
Dekabr '24
+313
0 kanalda
Get PRO
Noyabr '24
+485
1 kanalda
Get PRO
Oktabr '24
+330
0 kanalda
Get PRO
Sentabr '24
+355
1 kanalda
Get PRO
Avgust '24
+512
8 kanalda
Get PRO
Iyul '24
+232
0 kanalda
Get PRO
Iyun '24
+319
2 kanalda
Get PRO
May '24
+402
3 kanalda
Get PRO
Aprel '24
+386
1 kanalda
Get PRO
Mart '24
+413
2 kanalda
Get PRO
Fevral '24
+501
1 kanalda
Get PRO
Yanvar '24
+630
1 kanalda
Get PRO
Dekabr '23
+523
0 kanalda
Get PRO
Noyabr '23
+420
0 kanalda
Get PRO
Oktabr '23
+644
3 kanalda
Get PRO
Sentabr '23
+516
0 kanalda
Get PRO
Avgust '23
+306
0 kanalda
Get PRO
Iyul '23
+285
0 kanalda
Get PRO
Iyun '23
+289
0 kanalda
Get PRO
May '23
+248
0 kanalda
Get PRO
Aprel '23
+451
0 kanalda
Get PRO
Mart '23
+429
0 kanalda
Get PRO
Fevral '23
+189
0 kanalda
Get PRO
Yanvar '23
+472
0 kanalda
Get PRO
Dekabr '22
+411
0 kanalda
Get PRO
Noyabr '22
+280
0 kanalda
Get PRO
Oktabr '22
+962
0 kanalda
Get PRO
Sentabr '22
+232
0 kanalda
Get PRO
Avgust '22
+274
0 kanalda
Get PRO
Iyul '22
+333
0 kanalda
Get PRO
Iyun '22
+316
0 kanalda
Get PRO
May '22
+304
0 kanalda
Get PRO
Aprel '22
+317
0 kanalda
Get PRO
Mart '22
+194
0 kanalda
Get PRO
Fevral '22
+191
0 kanalda
Get PRO
Yanvar '22
+335
0 kanalda
Get PRO
Dekabr '21
+504
0 kanalda
Get PRO
Noyabr '21
+1 191
0 kanalda
Get PRO
Oktabr '21
+282
0 kanalda
Get PRO
Sentabr '21
+372
0 kanalda
Get PRO
Avgust '21
+335
0 kanalda
Get PRO
Iyul '21
+498
0 kanalda
Get PRO
Iyun '21
+508
0 kanalda
Get PRO
May '21
+439
0 kanalda
Get PRO
Aprel '21
+1 231
0 kanalda
Get PRO
Mart '21
+759
0 kanalda
Get PRO
Fevral '21
+542
0 kanalda
Get PRO
Yanvar '21
+669
0 kanalda
Get PRO
Dekabr '20
+26 826
0 kanalda
| Sana | Obunachilarni jalb qilish | Esdaliklar | Kanallar | |
| 15 Sentabr | +2 | |||
| 14 Sentabr | +6 | |||
| 13 Sentabr | +2 | |||
| 12 Sentabr | 0 | |||
| 11 Sentabr | 0 | |||
| 10 Sentabr | +4 | |||
| 09 Sentabr | +1 | |||
| 08 Sentabr | +7 | |||
| 07 Sentabr | +4 | |||
| 06 Sentabr | +3 | |||
| 05 Sentabr | 0 | |||
| 04 Sentabr | +2 | |||
| 03 Sentabr | +4 | |||
| 02 Sentabr | +1 | |||
| 01 Sentabr | +1 |
Kanal postlari
Как сделать липкий хедер с подменой фона
Показан CSS-приём для sticky header, который визуально меняет фон при скролле без JavaScript: в hero и в основном контенте стоят sticky blocker-элементы, совпадающие по цвету с фоном секций и перекрывающие контент под фиксированным хедером. Это полезно, когда нужен аккуратный переход между секциями и хочется избежать лишней логики на скролле.
https://www.joshwcomeau.com/css/header-blockers/
| 2 |  🔴 Тестовый собес на Frontend-разработчика со старшим разработчиком ex. Сбер в этот четверг!
[+ разбор 50 сложных вопросов в подарок ]
17 сентября (в этот четверг!) в 19:00 по мск приходи онлайн, чтобы посмотреть на настоящее интервью на Middle Frontend-разработчика!
Собеседование проведёт Даниил Дмитриев - старший разработчик в R-Vision, ex. Сбер,
Как это будет:
📂 Даниил задаст разработчику вопросы и задачи, которые могут спросить на реальном собесе
📂 После каждого ответа респондента ты услышишь подробный комментарий от ментора и поймёшь, чего на самом деле ожидает собеседующий на интервью
📂 В конце сможешь задать любой вопрос Даниилу и получить на него развёрнутый ответ
Эфир проходит в рамках менторской программы от ШОРТКАТ для Frontend-разработчиков, которые хотят повысить свой грейд, ЗП и прокачать скиллы
И ты можешь посмотреть его бесплатно 🔥
Только завтра, в прямом эфире!
🎁 Подарок для всех, кто зарегается на веб — файл с ОТВЕТАМИ НА 50 СЛОЖНЫХ ВОПРОСОВ с Frontend-собеседований 🔥
Переходи в бот, чтобы попасть на эфир и забрать подарок 👉 @shortcut_front_bot
Реклама.
О рекламодателе. | 1 323 |
| 3 |  Видео-спрайты против Lottie на мобильных
Для крупных анимаций в встраиваемом виджете Lottie на iPhone начал греть процессор и вызывать троттлинг, а замена на видео-спрайты сняла нагрузку с CPU за счёт аппаратного декодирования. Но у видео-спрайтов есть цена: их нужно вручную ставить на паузу, потому что IntersectionObserver не видит скрытие через opacity, оверлеи и модалки.
https://habr.com/ru/articles/1078644/ | 1 521 |
| 4 |  Как Turbopack режет JS на чанки
Turbopack в Next.js 16.3 экспериментально улучшил разбиение JavaScript на чанки. Это ускоряет загрузку страниц и помогает переиспользовать общий код между роутами: вместо одного тяжёлого бандла на весь сайт или отдельного бандла на каждую страницу сборка может находить баланс между размером загрузки и кэшированием.
https://nextjs.org/blog/turbopack-chunking | 1 776 |
| 5 |  Устарел ли next‑intl? И как реально оптимизировать такую архитектуру
next-intl долго был стандартом для i18n в Next.js, но в App Router у него есть заметные архитектурные издержки: в браузер часто уезжают переводы со всего приложения и динамический вызов t() мешает tree-shaking.
Выход: грузить сообщения не в корневом лейауте, а локально по роутам и неймспейсам + переносить переводимый статичный текст в RSC через getTranslations().
https://habr.com/ru/articles/1077908/ | 1 863 |
| 6 |  Авторизация в Next.js ближе к данным
Разбор того, где в Next.js с App Router, React Server Components и Server Actions ставить проверки доступа, чтобы закрыть чтение и запись до обращения к базе. Показываем рабочую схему: проверка сессии в data access и service layer, использование getAuth и getAuthOrRedirect, а для маршрутов и layout держть в уме, что это улучшает UX, но не заменяет защиту на уровне данных.
https://www.robinwieruch.de/next-authorization/ | 1 957 |
| 7 |  Coaction переносит подписки и вычисления в runtime
Миграция с Zustand на Coaction показывает разницу между локальными селекторами и реактивным графом внутри стора. В Coaction чтение становится подпиской, а вычисляемые значения живут как общие узлы с зависимостями и кешированием. Это важно для больших приложений, где вокруг стора разрастаются useMemo, useShallow, селекторы и ручная синхронизация зависимостей.
https://dev.to/unadlib/reads-are-subscriptions-migrating-from-zustand-to-coaction-3228 | 2 032 |
| 8 |  Как сделать SVG-иконки живее с squash and stretch
Разбор приёма squash and stretch для SVG-микроинтеракций. Он помогает сделать иконки и стрелки более естественными и заметными без тяжёлой анимации: можно анимировать path через CSS, а для более широкой поддержки использовать Motion. Практически это даёт более приятный hover-эффект, учитывает prefers-reduced-motion и лучше работает, если вместо обычного state-based hover запускать короткую анимацию по событию.
https://www.joshwcomeau.com/animation/squash-and-stretch/ | 1 991 |
| 9 |  Как разложить React-проект по папкам
Практичная схема для React-проектов: от одного файла к файловой структуре с папками на компонент, где рядом лежат реализация, тесты, стили, типы и хелперы. Такой подход помогает не раздувать src, держать границы компонентов видимыми и не тащить внутрь лишние детали. Для небольших экранов можно оставить всё в одном файле, но как только компонент начинает жить своей жизнью, его лучше выносить в отдельную папку и экспортировать только публичный API.
https://www.robinwieruch.de/react-folder-structure/ | 2 125 |
| 10 |  Knip для Angular: чистим мертвый код автоматически
Knip помогает в крупных Angular и TypeScript-проектах находить неиспользуемые зависимости, файлы, экспорты и битые импорты, а затем держать это под контролем через pre-commit и CI/CD. В проекте с Nx workspace его настроили через knip.config.ts, автогенерацию workspaces и валидацию конфигурации, чтобы не полагаться на ручную проверку.
https://habr.com/ru/companies/tbank/articles/1078438/ | 2 107 |
| 11 |  Как быстро проверить HTML-письмо в Gmail
HTML-письмо можно вставить прямо в Gmail и сразу увидеть, как оно выглядит перед отправкой. Это удобно для быстрой проверки верстки, особенно если письмо собрано в MJML или другом шаблонизаторе и нужен финальный HTML без лишних шагов. Для реальной рассылки обычно всё равно используют сервисы вроде Mailchimp или Postmark, но для быстрого теста такой способ экономит время и помогает поймать проблемы с отображением раньше.
https://blog.codepen.io/2026/08/31/chris-corner-what-do-you-do-with-an-html-email/ | 2 091 |
| 12 |  22-23 сентября приглашаем на АЛЬФА ВААА{АИ}ЙЙЙБ ХАКАТОН. Создавайте проект высоконагруженного прокси, соревнуйтесь за 2,3 миллиона рублей, общайтесь в комьюнити топовых вайб-кодеров.
Всех участников пригласим 30 сентября на АЛЬФА ВААА{АИ}ЙЙЙБ МИТАП. Узнаем, кто из финалистов получит миллион, зажжём на техно-рейве с группой ЛАУД и проведём ток-шоу про нейросети.
Скорее регистрируйтесь | 2 053 |
| 13 |  CSS random() для кроссбраузерной случайности
Появился полифилл для будущей CSS random(), который позволяет использовать случайные значения в стилях в Chrome, Firefox и Safari без переписывания на JavaScript. Это полезно для эффектов вроде конфетти, звездного фона и других декоративных элементов, где нужна управляемая случайность прямо в CSS. На практике нужно подключить скрипт, пометить нужные элементы классом randomized и записывать случайные значения в custom properties с префиксом --random, чтобы код остался совместимым с нативной реализацией, когда она доедет до всех браузеров.
https://css-tricks.com/css-random-function-polyfill/ | 2 094 |
| 14 | pipenet для быстрого туннеля локального сервера
pipenet — open source альтернатива localtunnel, которая позволяет поднять собственную туннельную инфраструктуру и быстро открыть локальный сервер в публичном интернете. Полезно, когда нужно показать фронтенд, бэкенд или webhook без ручной настройки прокси и лишней возни с сетями.
https://github.com/punkpeye/pipenet | 2 134 |
| 15 |  Nuxt 4.5 ускоряет SSR и обновляет сборку
Nuxt 4.5 приносит экспериментальный SSR streaming, переход на Vite 8 и новый builder на базе Rsbuild для Rspack 2. Streaming сразу отдает HTML shell и может улучшить TTFB, но не уменьшает само серверное время рендера, поэтому его стоит проверять на middleware, редиректах, cookie и кеширующих правилах. При апгрейде нужен refresh lockfile через nuxt upgrade --dedupe, потому что вместе с релизом пришли крупные изменения в unhead v3 и unctx v3.
https://www.infoq.com/news/2026/08/nuxt-4-5-streaming/ | 2 312 |
| 16 |  Vercel AI SDK для структурированного AI-вывода
Vercel AI SDK и AI Gateway позволяют вызывать разные модели из бэкенда приложения и получать не просто текст, а структурированный ответ по Zod-схеме. Это удобно, когда AI должен создавать данные в формате, который сразу можно сохранить в базу и переиспользовать в существующих компонентах. Это снимает привязку к одному провайдеру, упрощает фолбэки между моделями и даёт контроль над форматом ответа, а не только над промптом.
https://blog.master.dev/having-fun-with-vercels-ai-sdk-and-ai-gateway/ | 2 410 |
| 17 |  Как хранить состояние приложения в URL
Если нужно шарить не просто страницу, а текущее состояние интерфейса, URL может хранить фильтры, содержимое редактора или целый JSON без бэкенда. Для небольших параметров достаточно query string, но для больших данных лучше использовать fragment после #, потому что он не уходит на сервер. Данные проходят цепочку сериализацию, сжатие и Base64url, а для частых изменений стоит делать debounce и обновлять адрес через history.replaceState().
https://ivakin.dev/blog/state-in-url | 2 538 |
| 18 |  pnpm 12 ускоряет установку без миграции
pnpm 12 переписали на Rust, но сохранили команды, флаги, lockfile и layout node_modules из pnpm 11. На практике это даёт заметный прирост скорости, особенно на повторных установках с уже прогретым кэшем. Для команд это почти безболезненное обновление, но стоит проверить совместимость в CI: убрали pnpm install --resolution-only, изменили поведение для git-зависимостей, неизвестные ключи в pnpm-workspace.yaml теперь не игнорируются.
https://www.infoq.com/news/2026/09/pnpm-12-rust/ | 2 574 |
| 19 |  Как научить ИИ писать по правилам дизайн-системы
Эксперимент показывает, что одного промпта мало: без контекста ИИ легко генерирует UI с styled.div, хардкодом цветов и несуществующими пропсами. Скилл задает правила проекта, MCP дает актуальный контракт дизайн-системы, а вместе они заметно повышают шанс получить код, который проходит typecheck и build.
https://habr.com/ru/companies/raiffeisenbank/articles/1075704/ | 2 502 |
| 20 |  DevSpace ускоряет проверку микрофронтендов
DevSpace можно использовать не только для бэкенда, но и для фронтенда в Kubernetes. Вместо полного CD-пайплайна локальная сборка синхронизируется прямо в pod nginx, а после загрузки запускается постобработка deploy-url. Это убирает ручную настройку hosts, раздельные порты и ожидание деплоя, поэтому интеграционные проверки микрофронтенда с хостом становятся заметно быстрее. Подход особенно полезен в монорепозиториях с микрофронтендами, но работает и для обычных SPA
https://habr.com/ru/articles/1078234/ | 2 568 |
