Библиотека фронтендера | Frontend, JS, JavaScript, React.js, Angular.js, Vue.js
21.6K subscribers
2.9K photos
208 videos
48 files
5.2K links
Все самое полезное для фронтенда в одном канале.

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

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

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

РКН: https://gosuslugi.ru/snet/67a5b6884689c2151c820bb4
Download Telegram
JavaScript js reference.pdf
4.1 MB
📘 Справочник по JavaScript

400+ страниц решений на все случаи жизни:

〰️ Как правильно работать с массивами? — 30+ методов с примерами

〰️ Что такое замыкания и зачем они нужны? — объясняем на пальцах

〰️ Почему промисы лучше колбэков? — сравнение с кодом

〰️ Как отловить баг в консоли? — 9 способов debugging

105 глав. От переменных до unit-тестирования. Каждая тема — с примерами кода и пояснениями.

Ставь ❤️, если было полезно

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

#readme #js
Please open Telegram to view this post
VIEW IN TELEGRAM
15🥰3👍2
AllFrontend.pdf
58.6 MB
📎 Шпаргалка по фронтенду

Этот документ объединяет ключевые темы, техники и механизмы, которые лежат в основе современной фронтенд-разработки.

➡️ В нём собраны объяснения, примеры и практические заметки, помогающие быстро освежить знания, разобраться в устройстве веб-технологий и подготовиться к выполнению задач или прохождению собеседований.

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

#readme
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥136
🔥 View Transitions API — морфинг без тяжёлых JS-библиотек

Раньше для плавной анимации между состояниями приходилось городить свои анимации и тащить JS-утилиты. Теперь достаточно одного вызова API + немного CSS.

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

document.startViewTransition(() => { /* обновляем DOM */ }) делает снимок DOM «до» и «после», а браузер сам строит плавный переход между ними.

Элементы с одинаковым view-transition-name анимируются как связанные: старое состояние плавно превращается в новое.

Идеально для:

- переходов между страницами
- раскрытия карточек
- галерей и модальных окон
- лёгких SPA без фреймворков

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

Same-document переходы (SPA):
- Chrome 111+, Edge 111+
- Safari 18+
- Firefox 144+

Cross-document переходы (MPA):
- Chrome 126+, Edge 126+
- Safari 18.2+
- Firefox — пока не поддерживается

Используйте как прогрессивное улучшение: в старых браузерах будет обычная навигация.

📎 Демо

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

#readme #js #css
Please open Telegram to view this post
VIEW IN TELEGRAM
6🥰2👍1
This media is not supported in your browser
VIEW IN TELEGRAM
😮 Visual Types: типизация через картинки

Вместо чтения про "Union type позволяет переменной быть одним из нескольких типов" — видишь схему, и всё сразу понятно.

🔤 Что покрывает:

Примитивы, объекты, массивы, Union/Intersection типы, дженерики — все базовые концепции.

Полезно для начинающих в TypeScript или тех, кто запутался в терминологии.

🔗 Ссылка на гид

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

#readme #ts
Please open Telegram to view this post
VIEW IN TELEGRAM
7❤‍🔥1
📋 Копирование в буфер обмена в 2025

Clipboard API
— стандарт. document.execCommand() deprecated с 2020.

Поддержка:
Chrome 66+, Firefox 63+, Safari 13.1+, Opera 53+

⚠️ Различия между браузерами:

Chrome/Edge:
— User gesture не требуется
— Работает только в активной вкладке

Firefox/Safari:
— Требуется user gesture (клик/тап)
— Вызов должен быть в обработчике события

🔜 Общие требования:

— Только HTTPS (или localhost)
— Для readText() требуется разрешение

🔜 Где использовать:

Кнопки «Скопировать код», промокоды, токены, ссылки

💡 Вызывайте копирование в обработчике клика — работает везде.

🔹 Основы IT для непрограммистов
🔹 Получить консультацию менеджера
🔹 Сайт Академии 🔹 Сайт Proglib

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

#readme
Please open Telegram to view this post
VIEW IN TELEGRAM
5🔥2🥰2