Библиотека фронтендера | Frontend, JS, JavaScript, React.js, Angular.js, Vue.js
23.2K subscribers
2.2K photos
120 videos
38 files
4.61K links
Все самое полезное для фронтенда в одном канале.

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

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

Наши каналы: https://yangx.top/proglibrary/9197

РКН: https://gosuslugi.ru/snet/67a5b6884689c2151c820bb4
加入频道
🤩 Неделю назад был представлен крупный релиз Bun 1.0

Универсальный набор инструментов для запуска, сборки и тестирования JavaScript/TypeScript стал еще лучше и быстрее. Под катом — подробности новой версии.

👀 Читать
Please open Telegram to view this post
VIEW IN TELEGRAM
👀 Манипулирование данными JPEG и EXIF в JavaScript: практический взгляд на то, как выбирать формат JPEG и читать/заменять теги EXIF напрямую, не полагаясь на стороннюю библиотеку.

👉Читать
Please open Telegram to view this post
VIEW IN TELEGRAM
🎓💼 ТОП-9 не самых очевидных компаний для стажировки в ИТ

Везде просят опыт работы... Но где его взять? Как раз об этом сейчас и расскажем!

🔗Читать статью
🔗Зеркало
This media is not supported in your browser
VIEW IN TELEGRAM
Emil Kowalski — разработчик библиотеки всплывающих компонентов для React под названием Sonner.

В статье он делится опытом и демонстрирует некоторые уроки, которые извлек, и ошибки, которые допустил при создании библиотеки.

👀 Читать
Please open Telegram to view this post
VIEW IN TELEGRAM
🤔 В чем разница между выражениями (expressions) и инструкциями (statements) в JavaScript?

👨‍🎓Если кратко, то одни после выполнения возвращает какое-либо значение, в то время как другие просто выполняют определённое действие.

📌Закрепляем эти, казалось бы, простые вещи на практике и разбираемся, как они отразились в React.

👀 Читать
Please open Telegram to view this post
VIEW IN TELEGRAM
⚒️ ТОП-27 плагинов для Visual Studio Code в 2023

Предлагаем список лучших расширений для VS Code в 2023 году: продуктивность, окрашивание сниппетов, контроль версий, форматирование, линтинг и отладка.

🔗Читать статью
🔗Зеркало
387. Chrome 117 и бета 118, DevTools, экологичный веб, миксины и…
Веб-стандарты
🎙Свежий выпуск подкаста «Веб-стандарты»: Андрей Симоненко, Никита Дубко, Юля Миоцен, Вадим Макеев про Chrome 117 и бету 118, DevTools, экологичный веб, миксины и функции в CSS, Interop 2024 и Figma.

00:01:46 Chrome 117
00:12:20 Бета Chrome 118
00:42:21 Chrome DevTools
00:48:49 Экологичный веб
00:58:19 Миксины и функции в CSS
01:25:54 Interop 2024
01:29:59 Новости Figma
01:36:19 CSS в Figma
01:49:16 Ответы на вопросы

YouTube | Apple Подкасты | Google Подкасты | Яндекс Музыка | Сайт подкаста
This media is not supported in your browser
VIEW IN TELEGRAM
🗺Команда дата-журналистики Яндекса составила карту хард-скиллов для фронтендеров

Для этого они собрали программистские запросы, на которые были ответы ссылками на Stack Overflow. Навыки тут — это теги вопросов на Stack Overflow, а их популярность — это число запросов.

Как читать карту:
🟠размер навыка на карте соответствует числу посвящённых ему запросов
🟠чем ближе два навыка друг к другу, тем ближе контекст, в котором они применяются

📌Еще два интересных списка: к этим фреймворкам и инструментам особенно вырос интерес по сравнению с прошлым годом

➡️Библиотеки и фреймворки
1. nuxtjs3
2. next-auth
3. pinia
4. prisma
5. rtk-query
6. react-query
7. react-three-fiber
8. sveltekit
9. echarts
10. monaco-editorпока

➡️Инструменты разработки
1. vitest
2. pnpm
3. vite
4. react-devtools
5. playwright
6. ts-jest
7. vercel
8. nrwl-nx
9. storybook
10. ts-node

👉Карту смотрим тут.
This media is not supported in your browser
VIEW IN TELEGRAM
🟡 CSS Loaders — самая большая коллекция анимаций загрузки на чистом CSS.

Копируйте и забирайте себе в один клик!
Please open Telegram to view this post
VIEW IN TELEGRAM
🤨Веб-компоненты действительно окружены ореолом глубоких заблуждений и непонимания — и с этим надо что-то делать.

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

📌Автор статьи затронул эту тему и разобрал все по полкам:

👉Веб-компоненты — это не замена вашему фреймворку
👉Главное — это жизненный цикл
👉Композиция и разметка
👉Shadow DOM — это опция
👉Объектная модель
Please open Telegram to view this post
VIEW IN TELEGRAM
Frontend Meetup от СберМаркет Tech 🔥

В программе:

🟡 Что такое Web3 и как под него разрабатывать. Расскажет Алексей Авдеев, CTO в Mish.

🟡 Pet-проекты — это зло. Вредные советы для фронтендеров от Александра Водолазских, руководителя направления разработки интерфейсов клиентского продукта в СберМаркете.

🟡 Как мы добавляли видео на Авито. Кейс от фронтенд-разработчика Авито Романа Миронова.

🗓 21 сентября, 19:00 Мск • офлайн + онлайн

Регистрируйся по ссылке, чтобы забронировать место в офлайне или получить ссылку на трансляцию! До встречи 😎

Реклама. ООО «Инстамарт Сервис», 115035, Москва, ОГРН 1187746494980. 16+
Таненбаум vs Торвальдс (микроядро vs монолит)

Старый добрый профессиональный спор, который перерос в холивар. Первыми его начали известные разработчики Эндрю Таненбаум и Линус Торвальдс в начале 90-х в одной из новостных групп «Юзнета».

Таненбаум и Торвальдс холиварили из-за архитектуры ядра ОС. Первый утверждал, что лучше использовать микроядра, второй — монолитное ядро. И сколько раз они не возвращались к публичному обсуждению архитектуры ядра, каждый оставался при своём мнении.

А что сейчас? Да ничего не изменилось. Холивар разгорается при обсуждении абсолютно любой темы.

Любите холиварить?
👍 — конечно — в споре рождается истина
🤔 — ненавижу — только мешает работать
💯 — смотря где и при каких обстоятельствах

#холивар
🛠 Event Loop в деталях

JavaScript был спроектирован как однопоточный язык программирования. Тем не менее у него есть механизм Event Loop, который позволяет выполнять «асинхронные» операции.

Движок JavaScript выполняет одну операцию за раз — и все, что является асинхронным отправляет в Event Loop. Давайте заглянем под капот этого механизма и разберем, почему Event Loop вообще был создан, как с ним работать и почему про него спрашивают на собесах.

🔗 Читать
Креатив от третьего докладчика👇

Чтобы стать крутым сеньором,
Нужно срочно на реакте,
Ангуляре, вью и квике,
Вам закодить ту-ду лист.


📌А вот и подборка докладов:

📺Алексей Авдеев, CTO в Mish. Что такое Web3 и как под него разрабатывать.
📺Роман Миронов, фронтенд-разработчик в Авито. Как мы добавляли видео на Авито.
📺Александр Водолазских, руководитель направления разработки интерфейсов клиентского продукта в СберМаркете. Pet-проекты – это зло. Вредные советы для фронтендеров.

#чтопроисходит
Please open Telegram to view this post
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
🚀С появлением на горизонте новой функции CSS linear() возможности того, что мы можем сделать для создания естественной анимации и переходов в будущем, значительно расширяются. Смотрите сами реализацию того, что на демо:

:root {
--elastic-out: linear(
0, 0.2178 2.1%, 1.1144 8.49%,
...
1.0056 72.24%, 0.9981 86.66%, 1
);
}

button {
transition: scale 0.5s var(--elastic-out);
}

button:active {
scale: 0.8;
transition: scale 0.5s ease;
}

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

👀Читать
Please open Telegram to view this post
VIEW IN TELEGRAM
🤩TypeScript Origins: The Documentary

Друзья, отложите все дела. Перед вами док про TypeScript от команды OfferZen, в котором участвуют такие основные контрибьюторы и члены сообщества, как Anders Hejlsberg, Steve Lucco, Luke Hoban, Daniel Rosenwasser, Ryan Cavanaugh, Amanda Silver, Matt Pocock, Josh Goldberg и многие другие.

📺 Смотреть
Please open Telegram to view this post
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
Deno 1.37: современный JavaScript в Jupyter Notebooks

Команда Deno придумала кое-что довольно изящное. Deno 1.37 поставляется с интеграцией Jupyter Notebook, поэтому вы можете создавать интерактивные сессии REPL, но используя знакомый и любимый JavaScript, а не Python.

$ deno jupyter --unstable
💡Простой способ показать относительное время в удобочитаемом формате.

👉 Поиграть можно здесь.

#css #tip by Shripal Soni
388. Safari 17 и TP 179, :has в Firefox, State of HTML, Scroll-Driven…
Веб-стандарты
🎙Свежий выпуск подкаста «Веб-стандарты»: Алексей Симоненко, Никита Дубко, Андрей Мелихов про Safari 17 и TP 179, :has в Firefox, State of HTML 2023, Scroll-Driven Animations и TypeScript, который иногда мешает.

00:01:08 Релиз Safari 17
00:24:39 Safari TP 179
00:28:07 :has в Firefox
00:30:07 State of HTML 2023
00:41:25 Scroll-Driven Animations
00:52:31 TypeScript иногда мешает
01:15:48 Ответы на вопросы

YouTube | Apple Подкасты | Google Подкасты | Яндекс Музыка | Сайт подкаста

#подкасты
Please open Telegram to view this post
VIEW IN TELEGRAM
⚡️Последний курс по алгоритмам, который вам понадобится

Знаете ли вы, что у Frontend Masters есть курс по алгоритмам с примерами на TypeScript? Бесплатно и без кредитки. Все, что вам нужно, — это электронная почта.
Please open Telegram to view this post
VIEW IN TELEGRAM