📖В MDN Web Docs с недавних пор появились отдельные страницы для каждой функции регулярных выражений JavaScript с более полной информацией о синтаксисе и семантике, включая информацию о совместимости браузеров.
📌Гайды
• Assertions
• Character classes
• Groups and backreferences
• Quantifiers
• A cheat sheet
📌Справочные страницы
• Creating regular expressions
• Flags
• Assertions
• Atoms
• Other features
👉Разбираемся подробнее, как организована информация и как новая документация может помочь вам писать регулярные выражения на JavaScript.
📌Гайды
• Assertions
• Character classes
• Groups and backreferences
• Quantifiers
• A cheat sheet
📌Справочные страницы
• Creating regular expressions
• Flags
• Assertions
• Atoms
• Other features
👉Разбираемся подробнее, как организована информация и как новая документация может помочь вам писать регулярные выражения на JavaScript.
MDN Web Docs
New reference pages on MDN for JavaScript regular expressions | MDN Blog
See the latest updates to the MDN reference pages about JavaScript regular expressions, including new sections on sub-features and browser compatibility information.
This media is not supported in your browser
VIEW IN TELEGRAM
🛞Учитель из России Татьяна Ерухимова уехала в США и занимается тем, чем должен заниматься любой нормальный учитель — прививает любовь к знаниям своим ученикам.
💬Всем бы таких учителей… А вы помните своего любимого учителя и предмет, который больше всего на вас повлиял?
#холивар
💬Всем бы таких учителей… А вы помните своего любимого учителя и предмет, который больше всего на вас повлиял?
#холивар
👩💻 Женщины в ИТ: проблемы и преимущества сложной профессии
Айтишницы поделились профессиональным опытом и рассказали о стереотипах и сложностях, с которыми им пришлось столкнуться на карьерном пути.
🔗 Читать статью
🔗 Зеркало
Айтишницы поделились профессиональным опытом и рассказали о стереотипах и сложностях, с которыми им пришлось столкнуться на карьерном пути.
🔗 Читать статью
🔗 Зеркало
This media is not supported in your browser
VIEW IN TELEGRAM
📌 Новости и обновления популярных инструментов: подборка для фронтенд-разработчика
⚡Вышел Chrome 118. Подробнее о нововведениях читайте здесь.
⚡Доступен корректирующий выпуск Firefox 118.0.2, в котором представлены некоторые исправления.
⚡Представлены Node 20.8.0 и Node 18.18.1 (LTS)
🔸Electron 27: набор инструментов для кроссплатформенных десктопных приложений получает поддержку Chromium 118, Node.js 18.17.1 и V8 11.8, но теряет поддержку macOS 10.13/14.
🔸Fresh 1.5: нативный фреймворк Deno для создания полнофункциональных веб-приложений. В версии 1.5 добавлена поддержка partials (возможность обновить часть существующей страницы).
🔸Parcel 2.10: zero-config инструмент сборки получил серьезные улучшения производительности (в 7 раз быстрее в крупных проектах). Devon Govett погрузился в эту тему подробнее в треде.
🔸Bun 1.0.5: исправлены ошибки и представлены небольшие улучшения для рантайма JS.
🔸Payload 2.0: Postgres, Live Preview, Lexical RTE и многое другое
🔸Ionic 7.5: добавлена поддержка автономных компонентов Angular, Datetime, Toast и многого другого.
🔹Solid 1.8 — реактивная JavaScript-библиотека для создания UI без использования виртуальной DOM.
🔹Hotkey 2.1.1 — инструмент для добавления сочетания клавиш на страницы с помощью HTML-атрибутов (например, data-hotkey="Meta+d").
🔹React-Menu 4.1 — компонент для создания доступных меню и раскрывающихся списков.
🔹pnpm 8.9 — альтернативный эффективный менеджер пакетов.
🔹Highlight.js 11.9 — популярная библиотека подсветки синтаксиса JS.
#чтопроисходит
⚡Вышел Chrome 118. Подробнее о нововведениях читайте здесь.
⚡Доступен корректирующий выпуск Firefox 118.0.2, в котором представлены некоторые исправления.
⚡Представлены Node 20.8.0 и Node 18.18.1 (LTS)
🔸Electron 27: набор инструментов для кроссплатформенных десктопных приложений получает поддержку Chromium 118, Node.js 18.17.1 и V8 11.8, но теряет поддержку macOS 10.13/14.
🔸Fresh 1.5: нативный фреймворк Deno для создания полнофункциональных веб-приложений. В версии 1.5 добавлена поддержка partials (возможность обновить часть существующей страницы).
🔸Parcel 2.10: zero-config инструмент сборки получил серьезные улучшения производительности (в 7 раз быстрее в крупных проектах). Devon Govett погрузился в эту тему подробнее в треде.
🔸Bun 1.0.5: исправлены ошибки и представлены небольшие улучшения для рантайма JS.
🔸Payload 2.0: Postgres, Live Preview, Lexical RTE и многое другое
🔸Ionic 7.5: добавлена поддержка автономных компонентов Angular, Datetime, Toast и многого другого.
🔹Solid 1.8 — реактивная JavaScript-библиотека для создания UI без использования виртуальной DOM.
🔹Hotkey 2.1.1 — инструмент для добавления сочетания клавиш на страницы с помощью HTML-атрибутов (например, data-hotkey="Meta+d").
🔹React-Menu 4.1 — компонент для создания доступных меню и раскрывающихся списков.
🔹pnpm 8.9 — альтернативный эффективный менеджер пакетов.
🔹Highlight.js 11.9 — популярная библиотека подсветки синтаксиса JS.
#чтопроисходит
This media is not supported in your browser
VIEW IN TELEGRAM
Читайте подробнее о 13-ти играх с самым высоким рейтингом — все они бесплатны, в них можно играть в браузере, а размер занимает ≤ 13 КБ
Please open Telegram to view this post
VIEW IN TELEGRAM
Интересный кейс использования градиентов CSS для реализации эффекта наведения, влияющего на внешний вид других элементов вокруг наведенного элемента.
👉 Читать
Please open Telegram to view this post
VIEW IN TELEGRAM
Smashing Magazine
Gradients, Blend Modes, And A Really Cool Hover Effect — Smashing Magazine
Gradients are a powerful CSS feature. We use them for texture, depth, and even to hide parts of elements with CSS masking. This article covers another interesting way to use gradients — as a hover effect that affects the appearance of other elements around…
📌Что внутри:
🚀Индивидуальная система стилей
🚀Встроенная поддержка темных и светлых тем
🚀107+ React-компонентов
🚀20+ кастомных хуков
🚀27+ кастомных валидаторов форм
🔗 Сайт & GitHub
Please open Telegram to view this post
VIEW IN TELEGRAM
Вероятно, вы ежедневно используете кастомные свойства CSS. Но знаете ли вы, как они работают под капотом, особенно когда речь идет о каскаде и наследовании?
Stephanie Eckles более 15 лет работала фронтенд-разработчиком, а теперь делится опытом. Она рассказывает об использовании кастомных свойств и эффективном устранении неполадок, рассматривая:
☑️Как браузер определяет значения для любого свойства
☑️Про Computed value time
☑️Подводные камни при использовании кастомных свойств с помощью современного CSS
☑️Почему наследование должно влиять на вашу архитектуру кастомных свойств
Stephanie Eckles более 15 лет работала фронтенд-разработчиком, а теперь делится опытом. Она рассказывает об использовании кастомных свойств и эффективном устранении неполадок, рассматривая:
☑️Как браузер определяет значения для любого свойства
☑️Про Computed value time
☑️Подводные камни при использовании кастомных свойств с помощью современного CSS
☑️Почему наследование должно влиять на вашу архитектуру кастомных свойств
390. Safari, бета Chrome 119, Divtober, пересмотр Baseline, новинки…
Веб-стандарты
🎙Свежий выпуск подкаста «Веб-стандарты»: Андрей Мелихов, Юля Миоцен, Вадим Макеев про Safari TP, бету Chrome 119, Divtober, пересмотр Baseline, новинки WCAG 2.2 и Closure Compiler.
00:01:08 Новинки Safari
00:22:26 Бета Chrome 119
00:50:01 Divtober
00:56:29 Пересмотр Baseline
01:08:03 Новинки WCAG 2.2
01:15:01 Closure Compiler
⏯ YouTube | Apple Подкасты | Google Подкасты | Яндекс Музыка | Сайт подкаста
#подкасты
00:01:08 Новинки Safari
00:22:26 Бета Chrome 119
00:50:01 Divtober
00:56:29 Пересмотр Baseline
01:08:03 Новинки WCAG 2.2
01:15:01 Closure Compiler
⏯ YouTube | Apple Подкасты | Google Подкасты | Яндекс Музыка | Сайт подкаста
#подкасты
Почему экосистема фронтенда настолько сложна?
📌Основные тезисы из статьи, которая подчеркивает боль всех фронтендеров:
🤯Нет единой системы импортов: ESModules, CommonJS, Asynchronous Module Definition (AMD), Universal Module Definition (UMD)
🤯Многочисленные шаги минификации, траспиляции
🤯Совершенно разные условия запуска кода: разные версии браузеров, server side, client side и т. д.
🤯Слишком многие фронтенд-инструменты полагаются на определенную структуру файлов в проекте
🤯Configuration hell: огромное количество инструментов, которые нужно как-то подружить между собой
🤯Из-за множества слоёв преобразования затруднён hot reload
💬Согласны с автором?
👍 — в точку
🤔 — нет, я не испытываю таких проблем при разработке
📌Основные тезисы из статьи, которая подчеркивает боль всех фронтендеров:
🤯Нет единой системы импортов: ESModules, CommonJS, Asynchronous Module Definition (AMD), Universal Module Definition (UMD)
🤯Многочисленные шаги минификации, траспиляции
🤯Совершенно разные условия запуска кода: разные версии браузеров, server side, client side и т. д.
🤯Слишком многие фронтенд-инструменты полагаются на определенную структуру файлов в проекте
🤯Configuration hell: огромное количество инструментов, которые нужно как-то подружить между собой
🤯Из-за множества слоёв преобразования затруднён hot reload
💬Согласны с автором?
👍 — в точку
🤔 — нет, я не испытываю таких проблем при разработке
Mattrickard
Why Is the Frontend Stack So Complicated?
The frontend ecosystem is notoriously confusing. At every layer, there seem to be incompatible, competing standards.
[**No universal import system**](/a-first-
[**No universal import system**](/a-first-
Говорят, что слепой десятипальцевый метод печати на клавиатуре повышает производительность и позволяет не отвлекаться на клавиатуру. А вы им владеете?
Anonymous Poll
25%
Да, это действительно повышает производительность
16%
Да, но он не сильно влияет на производительность
24%
Нет, но хочу освоить
17%
Нет, не вижу в нем смысла
17%
Посмотреть результаты
В сети появился перевод книги автора Pablo Garaguso, которая будет полезна не только разработчикам на Vue, но и на других фронтенд-фреймворках. На текущий момент доступно две главы:
📖Глава 1. Фреймворк Vue 3
В главе представлены наиболее важные аспекты фреймворка и другие ключевые понятия.
📖Глава 2. Принципы и шаблоны проектирования программного обеспечения
В главе рассказывается о принципах и шаблонах проектирования ПО и приводятся примеры реализации на JavaScript/Vue 3.
Please open Telegram to view this post
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
.pop {
view-timeline-name: --pop;
}
img {
animation: slide both;
animation-timeline: --pop;
animation-range: entry 100% cover 50%;
}
.skateboarder {
--x: 0;
--y: -45%;
}
@ keyframes slide {
to { translate: var(--x) var(--y); }
}
Небольшая хитрость заключается в том, чтобы сложить два элемента изображения и оставить одно из них скрытым за пределами контейнера.
👉 Поиграть можно здесь (используйте Chrome)
#css #tip by Jhey
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
Observable
Detect objects in images
This runs entirely in your browser. Images you select will not be uploaded to the server. Uses @Xenova/detra-resnet-50 - inspired by this tweet from @perborgen
This media is not supported in your browser
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🤦♂️Из-за повышения индекса цитируемости Wasm в сети некоторые новички думают, что учить JS нет никакого смысла.
#холивар
Please open Telegram to view this post
VIEW IN TELEGRAM
🔝Библиотека включает более десятка типов диаграмм, которые обеспечивают красивую и адаптивную визуализацию в ваших приложениях и на информационных панелях.
👉 GitHub
Please open Telegram to view this post
VIEW IN TELEGRAM
keyboard-shortcuts-linux.pdf
144.4 KB
#инструменты #шпаргалки
Please open Telegram to view this post
VIEW IN TELEGRAM