Библиотека фронтендера | 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
加入频道
🔥Команда Тинькофф объединила все библиотеки Angular, работа над которыми велась в течение пяти лет, в проект Taiga Family.

💪 Ребята начали еще с Angular 4 и до сих пор держатся. Вас ждут:

🔻Web APIs for Angular
🔻Event manager плагины
🔻Polymorpheus
🔻Maskito и многое другое

🔗GitHub
This media is not supported in your browser
VIEW IN TELEGRAM
💡Улучшаем UX для пользователей при нажатии на hover-based action buttons, которые используют только клавиатуру и сенсорный экран.

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

#css #tip by Shripal Soni
🍪Хоть сейчас и мало кого заинтересуешь «печеньками» и «кикером в офисе», эйчары до сих пор в описаниях вакансий делают упор на удобном расположении офиса, бесплатном кофе и классных тимбилдингах.

🧗‍♀️Но это, скорее, верхушка айсберга и приятное дополнение к тому, что должно помогать сотруднику сохранять страсть к своей работе и не выгореть на первом же году работы. А «под водой» — интересные и разноплановые задачи, которые бросают вызов нашим скиллам и заставляют получать новые знания, и благодаря которым каждый день мы приходим на работу с удовольствием.

💬А что «зажигает» именно вас? Ради чего вы каждый день приходите на работу или садитесь за рабочий компьютер в случае удаленки? Как думаете, зависит ли счастье сотрудников от интересных задач?
🤩 Неделю назад был представлен крупный релиз 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