Библиотека фронтендера | Frontend, JS, JavaScript, React.js, Angular.js, Vue.js
21.8K subscribers
2.77K photos
189 videos
42 files
5.11K links
Все самое полезное для фронтенда в одном канале.

По рекламе: @proglib_adv

Учиться у нас: https://proglib.io/w/77178ed4

Для обратной связи: @proglibrary_feeedback_bot

РКН: https://gosuslugi.ru/snet/67a5b6884689c2151c820bb4
Download Telegram
💻 ВАЖНО: макбук ещё не забрали!

Proglib.academy продолжает розыгрыш MacBook Pro 14» (M3 Pro, 36 Гб, 1 Тб SSD).

Что нужно для участия?

— Берёшь любой курс Академии до 15 ноября.
— Проходишь хотя бы 2 недели обучения (можно за два дня).
— Пишешь куратору #розыгрыш. Всё — ты в игре!

Что за курсы?

▫️Алгоритмы и структуры данных — если хочешь готовиться к собесам в Яндекс, FAANG и не сидеть на джуне вечно.

▫️Архитектуры и шаблоны проектирования — учат думать как senior, а не просто писать код.

▫️ Python, математика для DS, основы IT и другие темы — можно стартовать с нуля или усилить то, что уже знаешь.

👉 Влетай, не думай!
🥰5
🎯 Interest Invoker API — тултипы без единой строчки JS

Раньше, чтобы показать поповер по ховеру, нужен был JavaScript. Теперь — достаточно HTML.

➡️ Как работает:

interesttarget связывает элемент-триггер и поповер. Браузер сам обрабатывает hover, focus или long-press и показывает подсказку.

Можно совмещать с Popover API и Anchor Positioning для точного позиционирования.

⚠️ Поддержка:

Пока экспериментальная — работает в Chromium-браузерах (Chrome 135+, Edge 135+). В Firefox и Safari API ещё не реализован, поэтому стоит использовать фолбэк или JS-вариант для совместимости.

🐸 Библиотека фронтендера

#readme #html
Please open Telegram to view this post
VIEW IN TELEGRAM
👍82🥰2
🚀 Storybook 10 — меньше кода, больше типобезопасности

Вышел крупнейший релиз года для тех, кто работает с UI-компонентами.

Три ключевых изменения:

1. ESM-only — код стал на 29% легче и теперь не минифицирован (дебажить проще)

2. CSF Factories — новый формат историй для TypeScript: меньше бойлерплейта, больше автокомплита

3. Новый sb.mock — простой и надёжный автомокинг модулей (совместно с Vitest)

⚠️ Требует Node 20.16+ / 22.19+ / 24+

Детали — в карточках выше

🔗 Ссылка на релиз

🐸 Библиотека фронтендера

#career_merge
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍7🤩21😁1
Frontend VK Hub — как работают наши интерфейсы?

Что делает интерфейсы VK быстрыми, удобными и устойчивыми под нагрузкой миллионов пользователей?
Frontend VK Hub — это сообщество инженеров, которые создают и развивают пользовательские интерфейсы для ВКонтакте, VK Play, VK WorkSpace и других сервисов экосистемы. Мы делимся практическим опытом, рассказываем о подходах к производительности, внедрении современных фреймворков и всему, что связано с улучшением Developer Experience.

Здесь можно найти инсайты от ведущих фронтенд-разработчиков, разборы реальных задач, новости индустрии и приглашения на мероприятия VK. И конечно, вакансии!

Подписывайся!
🥰5👍1
🔥 Props через 5 уровней — рефакторим через children

➡️ Проблема (1 картинка):

Передаём user через Dashboard и Sidebar, хотя они его не используют. Компоненты становятся «курьерами» для чужих данных.

➡️ Решение (2 картинка):

Используйте композицию через children — передавай данные напрямую туда, где они нужны.

Что это даёт:

🟡 Без prop drilling — данные идут напрямую к UserProfile
🟡 Dashboard и Sidebar становятся переиспользуемыми
🟡 Меньше связности, проще тестировать и поддерживать

Когда что использовать:

Композиция — данные нужны только конечному компоненту
Context API — данные нужны многим компонентам на разных уровнях (theme, auth, locale)

🐸 Библиотека фронтендера

#hotfix #react
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥7👍32
⭐️ Замыкания: когда теория не помогает

Все знают, что такое closure. Но почему тогда обработчики событий выводят не то, а React работает с устаревшим state?

➡️ Разбираем классические баги с замыканиями — от циклов с var до утечек памяти.

🐸 Библиотека фронтендера

#under_hood #js
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🥰2👏2