Какими мини-апами в tg вы пользуетесь?
Вот какой удобный Mini App появился недавно: Calendar for Telegram
Это:
💫 Быстрый доступ к расписанию, которое теперь всегда под рукой;
💫 Лёгкий шэринг событий – без e-mail! Просто отправьте приглашение другу/коллеге в чат или в группу;
💫 Афиши – общее расписания для работы, мероприятий, совместных путешествий или спорта;
💫 Слоты – отражают доступность вашего свободного времени для назначения встреч (это как Calendly, только в вашем tCalendar);
💫 Моментальный видео-звонок – возможность создавать Google Meet сразу в tCalendar;
💫 Синхронизация с Google Календарем – все события всегда актуальны в обоих календарях.
Самое приятное, что всё это бесплатно и незаменимо в обычной жизни👌
Юзкейс такой: поняли, что нужна встреча -> создали её тут же в тг -> пригласили участников. В Гугл календарь само придет. 🪄✨
Вот какой удобный Mini App появился недавно: Calendar for Telegram
Это:
💫 Быстрый доступ к расписанию, которое теперь всегда под рукой;
💫 Лёгкий шэринг событий – без e-mail! Просто отправьте приглашение другу/коллеге в чат или в группу;
💫 Афиши – общее расписания для работы, мероприятий, совместных путешествий или спорта;
💫 Слоты – отражают доступность вашего свободного времени для назначения встреч (это как Calendly, только в вашем tCalendar);
💫 Моментальный видео-звонок – возможность создавать Google Meet сразу в tCalendar;
💫 Синхронизация с Google Календарем – все события всегда актуальны в обоих календарях.
Самое приятное, что всё это бесплатно и незаменимо в обычной жизни👌
Юзкейс такой: поняли, что нужна встреча -> создали её тут же в тг -> пригласили участников. В Гугл календарь само придет. 🪄✨
This media is not supported in your browser
VIEW IN TELEGRAM
#инструмент дня
F*ck Leetcode.
Как-то так приветствует нас проект https://www.interviewcoder.co/
Что же он делает?
А разработчики проекта догадались сделать невидимый для шаринга экрана ИИ-оверлей, который находит на экране и решает алгоритмические задачи.
Невидим он для:
- Zoom < v6.1.6
- Всех браузеров
- Discord
- Встроенного в maxOS скриншотера (не видео)
Видим для:
- Zoom > v6.1.6
- Записи видео в том же macOS
Может не только решать код, но и дебажить его, давать построчные подсказки и исправлять ошибки.
Ну что, литкод-собесам конец? :)
Да, проект — открытый: https://github.com/ibttf/interview-coder
И в доказательство — запись реального собеседования: https://youtu.be/rcH813f5vCE
#leetcode #interview #ai #cheat
F*ck Leetcode.
Как-то так приветствует нас проект https://www.interviewcoder.co/
Что же он делает?
А разработчики проекта догадались сделать невидимый для шаринга экрана ИИ-оверлей, который находит на экране и решает алгоритмические задачи.
Невидим он для:
- Zoom < v6.1.6
- Всех браузеров
- Discord
- Встроенного в maxOS скриншотера (не видео)
Видим для:
- Zoom > v6.1.6
- Записи видео в том же macOS
Может не только решать код, но и дебажить его, давать построчные подсказки и исправлять ошибки.
Ну что, литкод-собесам конец? :)
Да, проект — открытый: https://github.com/ibttf/interview-coder
И в доказательство — запись реального собеседования: https://youtu.be/rcH813f5vCE
#leetcode #interview #ai #cheat
#фишка дня
Я всегда считал карту кода достаточно бестолковой фишкой. С другой стороны, TODO-комментарии и ошибки достаточно легко распознаваемы и перемещаться по ним удобно.
А сегодня я узнал, что блоки кода можно ещё и помечать комментарием
В идеале, конечно, не стоит развозить свой код на несколько экранов, но прежде чем разбивать — надо ж распознать, верно? :)
#vscode #minimap #бородач
Я всегда считал карту кода достаточно бестолковой фишкой. С другой стороны, TODO-комментарии и ошибки достаточно легко распознаваемы и перемещаться по ним удобно.
А сегодня я узнал, что блоки кода можно ещё и помечать комментарием
// MARK: Something
, и этот самый Something будет виден на карте.В идеале, конечно, не стоит развозить свой код на несколько экранов, но прежде чем разбивать — надо ж распознать, верно? :)
#vscode #minimap #бородач
Будни разработчика
#инструмент дня F*ck Leetcode. Как-то так приветствует нас проект https://www.interviewcoder.co/ Что же он делает? А разработчики проекта догадались сделать невидимый для шаринга экрана ИИ-оверлей, который находит на экране и решает алгоритмические задачи.…
#молния дня
Вы же посмотрели видеодемонстрацию ИИ-помощника, который поверх экрана выводит ответ на тестовое лайвкодинг-задание?
Вот: https://youtu.be/rcH813f5vCE
Так вот, повторю: это было реальное собеседование в Амазон. И интервьюверу потом это видео прислали.
И в Амазон обиделись! И требуют отчисления автора проекта из университета!
Пруф: https://x.com/im_roy_lee/status/1895276427005845981
В комментарии приложу картинку оттуда, на случай, если что-то с твитом пойдёт не так :)
Вы же посмотрели видеодемонстрацию ИИ-помощника, который поверх экрана выводит ответ на тестовое лайвкодинг-задание?
Вот: https://youtu.be/rcH813f5vCE
Так вот, повторю: это было реальное собеседование в Амазон. И интервьюверу потом это видео прислали.
И в Амазон обиделись! И требуют отчисления автора проекта из университета!
Пруф: https://x.com/im_roy_lee/status/1895276427005845981
В комментарии приложу картинку оттуда, на случай, если что-то с твитом пойдёт не так :)
#статья дня
В чатике всплыл очередной вопрос про эффект ambilight.
Если кто не помнит, фоновая интерактивная подсветка ambilight — от Ambient Light — пришла к нам от телевизоров Филипс, а нынче есть даже на YouTube.
Мы уже рассматривали пару вариантов создания такого эффекта, но не для видео.
А для видео же — есть прекрасная статья на Smashing Magazine: https://www.smashingmagazine.com/2023/07/recreating-youtube-ambient-mode-glow-effect/
Описывается создание нужного эффекта на основе canvas, со всеми пояснениями и кодом. Даже хук для React по пути сделали.
Вообще, до меня не сразу дошло, почему именно холст. Почему бы просто не запустить два видео и одно размыть?
Но, на самом деле, выходит так, что на холст можно отправлять далеко не все кадры, можно по пути накладывать дополнительные эффекты, не нужно заботиться о синхронизации двух видео. Ну и
#ambilight #video #canvas
В чатике всплыл очередной вопрос про эффект ambilight.
Если кто не помнит, фоновая интерактивная подсветка ambilight — от Ambient Light — пришла к нам от телевизоров Филипс, а нынче есть даже на YouTube.
Мы уже рассматривали пару вариантов создания такого эффекта, но не для видео.
А для видео же — есть прекрасная статья на Smashing Magazine: https://www.smashingmagazine.com/2023/07/recreating-youtube-ambient-mode-glow-effect/
Описывается создание нужного эффекта на основе canvas, со всеми пояснениями и кодом. Даже хук для React по пути сделали.
Вообще, до меня не сразу дошло, почему именно холст. Почему бы просто не запустить два видео и одно размыть?
Но, на самом деле, выходит так, что на холст можно отправлять далеко не все кадры, можно по пути накладывать дополнительные эффекты, не нужно заботиться о синхронизации двух видео. Ну и
requestAnimationFrame
позволяет здорово снизить нагрузку на клиента. #ambilight #video #canvas
#фишка дня
Не совсем про разработку, но достаточно интересно.
Итак, понадобилось мне вчера отправить фотографии костюмов из одного сериала знакомой портной. Зашёл я на стриминг HBO Max, нашёл нужные кадры, снял скриншот...
А он чёрный. Элементы UI и... чёрный экран.
— DRM, — подумал Штирлиц.
И таки да, DRM. Защита авторских прав содержимого.
Виральность? Не, не слышали.
Технология, по которой работает DRM на стримингах, называется EME: Encrypted Media Extensions. Разработана совместно Netflix, Google и Microsoft.
Есть хорошее описание её работы: https://hsivonen.fi/eme/
Encrypted Media Extensions (EME) — это JavaScript API для <video> и <audio>, предназначенное для работы с DRM-защищенным контентом. Для расшифровки требуется Content Decryption Module (CDM), который доверен правообладателями и скрывает определенные данные от пользователя. Браузер при этом считается ненадежным.
CDM может быть встроен в браузер, загружен отдельно или реализован на уровне ОС и железа. Он управляет ключами для расшифровки контента. В EME есть учебная система Clear Key, но она не предназначена для коммерческого использования.
CDM может работать по-разному: просто расшифровывать данные, расшифровывать и декодировать видео в браузере, передавать декодированные кадры напрямую ОС или работать с GPU, скрывая пиксели даже от системы. EME определяет только интерфейс API, оставляя детали DRM разработчикам.
Так вот, к фишке дня. В Firefox EME не реализованы, скриншоты делаются без проблем. А в Chrome — работают на GPU, иначе ваши процессоры сошли бы с ума.
А это значит, что достаточно (по крайней мере пока) отключить аппаратное ускорение графики. И, вуаля, скриншоты снова можно делать!
Очевидно, с развитием железа и это скоро станет невозможно. Останется только аналоговая брешь (крутое название для экранки, не правда ли?).
#drm #eme #api
Не совсем про разработку, но достаточно интересно.
Итак, понадобилось мне вчера отправить фотографии костюмов из одного сериала знакомой портной. Зашёл я на стриминг HBO Max, нашёл нужные кадры, снял скриншот...
А он чёрный. Элементы UI и... чёрный экран.
— DRM, — подумал Штирлиц.
И таки да, DRM. Защита авторских прав содержимого.
Виральность? Не, не слышали.
Технология, по которой работает DRM на стримингах, называется EME: Encrypted Media Extensions. Разработана совместно Netflix, Google и Microsoft.
Есть хорошее описание её работы: https://hsivonen.fi/eme/
Encrypted Media Extensions (EME) — это JavaScript API для <video> и <audio>, предназначенное для работы с DRM-защищенным контентом. Для расшифровки требуется Content Decryption Module (CDM), который доверен правообладателями и скрывает определенные данные от пользователя. Браузер при этом считается ненадежным.
CDM может быть встроен в браузер, загружен отдельно или реализован на уровне ОС и железа. Он управляет ключами для расшифровки контента. В EME есть учебная система Clear Key, но она не предназначена для коммерческого использования.
CDM может работать по-разному: просто расшифровывать данные, расшифровывать и декодировать видео в браузере, передавать декодированные кадры напрямую ОС или работать с GPU, скрывая пиксели даже от системы. EME определяет только интерфейс API, оставляя детали DRM разработчикам.
Так вот, к фишке дня. В Firefox EME не реализованы, скриншоты делаются без проблем. А в Chrome — работают на GPU, иначе ваши процессоры сошли бы с ума.
А это значит, что достаточно (по крайней мере пока) отключить аппаратное ускорение графики. И, вуаля, скриншоты снова можно делать!
Очевидно, с развитием железа и это скоро станет невозможно. Останется только аналоговая брешь (крутое название для экранки, не правда ли?).
#drm #eme #api
#новость дня
Утекли промпты и модели v0.dev от Vercel: https://github.com/x1xhlol/v0-system-prompts-and-models/
Я их почитал и — как и со всеми кастомными промптами для тех же Cursor, Aider и Claude — сделал для себя всё тот же вывод.
Если вы сами прочитаете промпты и будете следовать им и в своей работе — это сделает вас лучшим (чем вы сейчас) разработчиком. Как подготовка к собеседованию.
Серьезно, они буквально представляют из себя весьма хорошее техническое задание.
К тем, кто составляет эти промпты — вопросов нет :)
В любом случае, очень круто, что инструменты, сокращающие рутину, стали нашей нормальной действительностью.
#ai #vercel #prompt
Утекли промпты и модели v0.dev от Vercel: https://github.com/x1xhlol/v0-system-prompts-and-models/
Я их почитал и — как и со всеми кастомными промптами для тех же Cursor, Aider и Claude — сделал для себя всё тот же вывод.
Если вы сами прочитаете промпты и будете следовать им и в своей работе — это сделает вас лучшим (чем вы сейчас) разработчиком. Как подготовка к собеседованию.
Серьезно, они буквально представляют из себя весьма хорошее техническое задание.
К тем, кто составляет эти промпты — вопросов нет :)
В любом случае, очень круто, что инструменты, сокращающие рутину, стали нашей нормальной действительностью.
#ai #vercel #prompt
#инструмент дня
Сложно представить себе проект, в котором не использовался бы ESLint.
Ну разве что вы или до сих пор на TSLint или ушли на Biome.
Так вот, в прошлом году, совместно с релизом версии 9, они обозначили свои планы. А планы большие: стать основным инструментом для поддержки качества кода на фронтенде. Это значит, линтинг JS, TS, JSON, Markdown. Ну и CSS тоже.
И вот, наконец, 18 февраля команда объявила о начальной поддержке линтинга CSS: https://eslint.org/blog/2025/02/eslint-css-support/
Соответственно, выпустив плагин
no-duplicate-imports - запрещает дубликаты @import rules
no-empty-blocks - запрет пустых блоков
no-invalid-at-rules - валидация @-правил
no-invalid-properties - запрет некорректных свойств
require-baseline - самое интересное, заставляет придерживаться Baseline (современных фич веба и CSS в том числе, которые поддерживаются всеми браузерами в должной мере)
use-layers - а вот это спорно, использование слоёв aka
Ну что, убираем Stylelint?
#css #lint #eslint
Сложно представить себе проект, в котором не использовался бы ESLint.
Ну разве что вы или до сих пор на TSLint или ушли на Biome.
Так вот, в прошлом году, совместно с релизом версии 9, они обозначили свои планы. А планы большие: стать основным инструментом для поддержки качества кода на фронтенде. Это значит, линтинг JS, TS, JSON, Markdown. Ну и CSS тоже.
И вот, наконец, 18 февраля команда объявила о начальной поддержке линтинга CSS: https://eslint.org/blog/2025/02/eslint-css-support/
Соответственно, выпустив плагин
@eslint/css
:no-duplicate-imports - запрещает дубликаты @import rules
no-empty-blocks - запрет пустых блоков
no-invalid-at-rules - валидация @-правил
no-invalid-properties - запрет некорректных свойств
require-baseline - самое интересное, заставляет придерживаться Baseline (современных фич веба и CSS в том числе, которые поддерживаются всеми браузерами в должной мере)
use-layers - а вот это спорно, использование слоёв aka
@layer
. Я пока не видел никого, кто их понимает :)Ну что, убираем Stylelint?
#css #lint #eslint
This media is not supported in your browser
VIEW IN TELEGRAM
#codepen дня
Давно не было рубрики, потому что это ну как-то ну слишком лениво.
Но вы только посмотрите на эту кнопку от Петра Кнолла: https://codepen.io/Petr-Knoll/pen/QwWLZdx
Если это не приближает нас к пику глассморфизма — то я не знаю, что приближает :)
#css #glassmorphism
Давно не было рубрики, потому что это ну как-то ну слишком лениво.
Но вы только посмотрите на эту кнопку от Петра Кнолла: https://codepen.io/Petr-Knoll/pen/QwWLZdx
Если это не приближает нас к пику глассморфизма — то я не знаю, что приближает :)
#css #glassmorphism
Media is too big
VIEW IN TELEGRAM
#новость дня
Вчерашнего дня, конечно, и многие из вас уже в курсе, но...
TypeScript переписывают на Go!
Да, если вы не знали — транслятор TypeScript всё это время был написан на самом себе, что, как вы понимаете, не делало его быстрым :)
И вот, новость: https://devblogs.microsoft.com/typescript/typescript-native-port/
Результат ошеломляет: разбор типов и сборка уже в 10 раз быстрее! Это означает, что и LSP в ваших IDE будут быстрее. И работать станет приятнее.
Очень рекомендую пойти почитать статью.
Кстати, кто же этот седой дядя на видео? А это Андерс Хейлсберг! Создатель Turbo Pascal, Delphi, C# и, внезапно, TypeScript.
И на этом видео он, в том числе, объясняет, почему не Rust. Этим вопросом задолбали уже всю команду.
И, если коротко:
1. Это портирование, а не переписывание. Они хотели оставить структуру проекта и работы над ним той же, что и была.
2. Rust, хоть и облегчает управление памятью, полностью не освобождает от связанного с этим управлением бойлерплейта. И, поскольку, структура транслятора TypeScript представляет из собой огромный набор вложенных друг в друга структур, количество бойлерплейта вышло бы неразумным.
В общем, нас ждёт дивный новый мир! И я очень рад. И выбором языка тоже.
#typescript #go
Вчерашнего дня, конечно, и многие из вас уже в курсе, но...
TypeScript переписывают на Go!
Да, если вы не знали — транслятор TypeScript всё это время был написан на самом себе, что, как вы понимаете, не делало его быстрым :)
И вот, новость: https://devblogs.microsoft.com/typescript/typescript-native-port/
Результат ошеломляет: разбор типов и сборка уже в 10 раз быстрее! Это означает, что и LSP в ваших IDE будут быстрее. И работать станет приятнее.
Очень рекомендую пойти почитать статью.
Кстати, кто же этот седой дядя на видео? А это Андерс Хейлсберг! Создатель Turbo Pascal, Delphi, C# и, внезапно, TypeScript.
И на этом видео он, в том числе, объясняет, почему не Rust. Этим вопросом задолбали уже всю команду.
И, если коротко:
1. Это портирование, а не переписывание. Они хотели оставить структуру проекта и работы над ним той же, что и была.
2. Rust, хоть и облегчает управление памятью, полностью не освобождает от связанного с этим управлением бойлерплейта. И, поскольку, структура транслятора TypeScript представляет из собой огромный набор вложенных друг в друга структур, количество бойлерплейта вышло бы неразумным.
В общем, нас ждёт дивный новый мир! И я очень рад. И выбором языка тоже.
#typescript #go
#codepen дня
Как сделать элементы интерфейса... зернистыми? Напоминающими шершавую структуру, например, пластика? Или плёнки...
Для достижения эффекта можно воспользоваться SVG-фильтром! Например, от Аны Тюдор: https://codepen.io/thebabydino/pen/MWBNrZq
К сожалению, на Safari съехали буквы, но сути дела не меняет :)
#svg #grainy #бородач
Как сделать элементы интерфейса... зернистыми? Напоминающими шершавую структуру, например, пластика? Или плёнки...
Для достижения эффекта можно воспользоваться SVG-фильтром! Например, от Аны Тюдор: https://codepen.io/thebabydino/pen/MWBNrZq
К сожалению, на Safari съехали буквы, но сути дела не меняет :)
#svg #grainy #бородач
#проект дня
Мы прошлым летом проводили отпуск в Валенсии. Целью был более пляжный и гастрономический отпуск, нежели любование музеями и природой, потому поселились в районе, который когда-то представлял из себя рыбацкую деревню — Эль Каваньял (El Cabanyal).
Этот бывший рыбацкий квартал славится домами, украшенными азулежу — расписными глазурованными плитками. Они служили не только украшением, но и защитой стен от влаги и солнца.
Часто встречаются узоры в сине-белых тонах, растительные мотивы, геометрические орнаменты и изображения святых. Многие дома облицованы плиткой полностью или частично, создавая неповторимый колорит района. Сейчас плитки ценятся как культурное наследие, но часть зданий с ними утрачена из-за застройки.
Меня настолько эти плитки и эта традиция восхитили, что я посвятил несколько прогулок по жаре +40 только их фотографированию.
К сожалению, сфотографировать и сами дома тоже мозгов не хватило.
И так фотографии и лежали с конца июля, но я подумал, что пришло время их оформить в очередной проект!
Итак:
1. Собираем фотографии в каталоге
2. Вычленяем из них геоданные
3. Находим в интернете векторный файл пина на карте, для маски, и готовим картинки маркеров и миниатюры.
4. Выводим всё на карте используя библиотеку React Leaflet.
Ну по пути, конечно, пришлось придумать простой алгоритм, центрирующий карту по фотографиям и отсекающий выбросы. Довольно коротко получилось:
Код в репозитории:
💻 https://github.com/bekharsky/el-cabanyal-tiles
Ну и сама карта, конечно же!
📌 https://bekharsky.github.io/el-cabanyal-tiles/
Кликаем на маркер, а потом перемещаемся по ним клавиатурой.
Мне дико обидно, что я заодно не сфотографировал дома (впрочем, я потом пройдусь по архиву, что-то было же точно), но мне всё равно очень нравится то, что получилось. Какой-никакой музей :)
#spain #valencia #tile #react #leaflet
Мы прошлым летом проводили отпуск в Валенсии. Целью был более пляжный и гастрономический отпуск, нежели любование музеями и природой, потому поселились в районе, который когда-то представлял из себя рыбацкую деревню — Эль Каваньял (El Cabanyal).
Этот бывший рыбацкий квартал славится домами, украшенными азулежу — расписными глазурованными плитками. Они служили не только украшением, но и защитой стен от влаги и солнца.
Часто встречаются узоры в сине-белых тонах, растительные мотивы, геометрические орнаменты и изображения святых. Многие дома облицованы плиткой полностью или частично, создавая неповторимый колорит района. Сейчас плитки ценятся как культурное наследие, но часть зданий с ними утрачена из-за застройки.
Меня настолько эти плитки и эта традиция восхитили, что я посвятил несколько прогулок по жаре +40 только их фотографированию.
К сожалению, сфотографировать и сами дома тоже мозгов не хватило.
И так фотографии и лежали с конца июля, но я подумал, что пришло время их оформить в очередной проект!
Итак:
1. Собираем фотографии в каталоге
2. Вычленяем из них геоданные
3. Находим в интернете векторный файл пина на карте, для маски, и готовим картинки маркеров и миниатюры.
4. Выводим всё на карте используя библиотеку React Leaflet.
Ну по пути, конечно, пришлось придумать простой алгоритм, центрирующий карту по фотографиям и отсекающий выбросы. Довольно коротко получилось:
const sortedTiles = [...tiles].sort((a, b) => a.lat - b.lat || a.lng - b.lng);
const majorityStart = Math.floor(tiles.length * 0.3);
const majorityEnd = Math.ceil(tiles.length * 0.7);
const majorityTiles = sortedTiles.slice(majorityStart, majorityEnd);
Код в репозитории:
💻 https://github.com/bekharsky/el-cabanyal-tiles
Ну и сама карта, конечно же!
📌 https://bekharsky.github.io/el-cabanyal-tiles/
Кликаем на маркер, а потом перемещаемся по ним клавиатурой.
Мне дико обидно, что я заодно не сфотографировал дома (впрочем, я потом пройдусь по архиву, что-то было же точно), но мне всё равно очень нравится то, что получилось. Какой-никакой музей :)
#spain #valencia #tile #react #leaflet
#баг дня
Как вы думаете, что обозначает тип {}?
Ну, буквально:
Быть может, пустой объект? Да. А может, объект с любыми свойствами? Тоже да. А может, число или строка? И опять, да. А пустые? Да! А может, булево значение? Невероятно, но тоже да!
А может, null или undefined ? Нет. Вот тут — нет. Песочница.
Поэтому смысла в использовании типов {} или Object (второе лишь псевдоним к первому) довольно мало.
Если вам нужен пустой объект — так и пишите, Record<PropertyKey, never>.
Подробнее у Мэтта Покока: https://www.totaltypescript.com/the-empty-object-type-in-typescript.
В чём же баг, спросите вы?
А баг у нас на этот раз в реализации проверки типов в WebStorm/PhpStorm. У JetBrains, короче.
Мы выводим типы из схем Zod, но для целей создания шаблона, мне потребовалось исключить некоторые свойства из проверки:
И мощно получил в лицо: тип ресолвился за 3 минуты на MacBook Pro M2, вешая интерфейс PhpStorm напрочь. Каждый раз.
Решение пришло откуда не ждали:
Обратите внимание на пустой тип. Обнаружил я это случайно: в первом варианте я ещё и добавлял айди шаблона, но впоследствии — отказался.
По всей видимости, система типов IntelliJ построена таким способом, что рассчитвывает конъюнкцию типов как новый тип и кеширует на месте. Но это лишь предположение.
В VS Code, кстати, проблемы не наблюдается.
После обращения в поддержку, мне было рекомендовано включить настройку Use types from server, что буквально выключает встроенные средства и использует типы от LSP. Что, собственно, мне только в плюс.
А как ваши дни проходят? 🙂
#jetbrains #typescript #lsp
Как вы думаете, что обозначает тип {}?
Ну, буквально:
type b = {};
Быть может, пустой объект? Да. А может, объект с любыми свойствами? Тоже да. А может, число или строка? И опять, да. А пустые? Да! А может, булево значение? Невероятно, но тоже да!
А может, null или undefined ? Нет. Вот тут — нет. Песочница.
Поэтому смысла в использовании типов {} или Object (второе лишь псевдоним к первому) довольно мало.
Если вам нужен пустой объект — так и пишите, Record<PropertyKey, never>.
Подробнее у Мэтта Покока: https://www.totaltypescript.com/the-empty-object-type-in-typescript.
В чём же баг, спросите вы?
А баг у нас на этот раз в реализации проверки типов в WebStorm/PhpStorm. У JetBrains, короче.
Мы выводим типы из схем Zod, но для целей создания шаблона, мне потребовалось исключить некоторые свойства из проверки:
TemplateQueryDetails = Omit<
z.infer<typeof QueryDetails>, 'metadata'
>;
И мощно получил в лицо: тип ресолвился за 3 минуты на MacBook Pro M2, вешая интерфейс PhpStorm напрочь. Каждый раз.
Решение пришло откуда не ждали:
TemplateQueryDetails = Omit<
z.infer<typeof QueryDetails>, 'metadata'
> & {};
Обратите внимание на пустой тип. Обнаружил я это случайно: в первом варианте я ещё и добавлял айди шаблона, но впоследствии — отказался.
По всей видимости, система типов IntelliJ построена таким способом, что рассчитвывает конъюнкцию типов как новый тип и кеширует на месте. Но это лишь предположение.
В VS Code, кстати, проблемы не наблюдается.
После обращения в поддержку, мне было рекомендовано включить настройку Use types from server, что буквально выключает встроенные средства и использует типы от LSP. Что, собственно, мне только в плюс.
А как ваши дни проходят? 🙂
#jetbrains #typescript #lsp
This media is not supported in your browser
VIEW IN TELEGRAM
#codepen дня
Сайт по продаже пончиков должен быть пончиком и точка!
Пруф: https://codepen.io/narrowdesign/pen/ZYErvWv?editors=1000
Извините, я просто никак больше не могу это прокомментировать.
#threejs #3d
Сайт по продаже пончиков должен быть пончиком и точка!
Пруф: https://codepen.io/narrowdesign/pen/ZYErvWv?editors=1000
Извините, я просто никак больше не могу это прокомментировать.
#threejs #3d
This media is not supported in your browser
VIEW IN TELEGRAM
#статья дня
Я уже не раз выражал свою любовь к шейдерам и 3D в целом. Это какой-то свой особый мир, который требует отдельного погружения. Когда удаётся прикоснуться самостоятельно — хоть немного — уже ору от восторга.
Хочется выделить хотя бы недели две только на изучение нужной математики.
Ладно, хватит нытья. Сегодня у нас прошлогодняя работа Shopify: глобус чёрной пятницы.
Да, глобусы разных вариаций с какими-нибудь рюшками постоянно появляются в ежегодных отчётах разных компаний, то у GitHub, то у Google. Но Shopify добавили nice touch в виде шейдеров фейрверков.
И выкатили об этом статью! Вот: https://shopify.engineering/how-we-built-shopifys-bfcm-2023-globe
Пройдите сразу, насладитесь этой красотой. А уже потом провалитесь в статью и удивитесь, что все эти фейрверки — это просто вершины икосаэдров.
Кстати, статья интерактивная и начинена примерами кода с ног до головы. Включая работу с моделью глобуса, текстурами и камерой.
Это настоящий подарок.
#webgl #glsl #shaders #бородач
Я уже не раз выражал свою любовь к шейдерам и 3D в целом. Это какой-то свой особый мир, который требует отдельного погружения. Когда удаётся прикоснуться самостоятельно — хоть немного — уже ору от восторга.
Хочется выделить хотя бы недели две только на изучение нужной математики.
Ладно, хватит нытья. Сегодня у нас прошлогодняя работа Shopify: глобус чёрной пятницы.
Да, глобусы разных вариаций с какими-нибудь рюшками постоянно появляются в ежегодных отчётах разных компаний, то у GitHub, то у Google. Но Shopify добавили nice touch в виде шейдеров фейрверков.
И выкатили об этом статью! Вот: https://shopify.engineering/how-we-built-shopifys-bfcm-2023-globe
Пройдите сразу, насладитесь этой красотой. А уже потом провалитесь в статью и удивитесь, что все эти фейрверки — это просто вершины икосаэдров.
Кстати, статья интерактивная и начинена примерами кода с ног до головы. Включая работу с моделью глобуса, текстурами и камерой.
Это настоящий подарок.
#webgl #glsl #shaders #бородач
#такое дня
Есть две вещи, которые я очень не люблю в веб-приложениях.
Первая — однокнопочные шорткаты. Например, в Jiira — нажатие на W добавляет тебя в список следящих за таской людей. Зачем? Почему? Непонятно.
Возможно, кому-то и удобно, но моя природная неусидчивость заставляет меня иногда нажимать кнопки на клавиатуре просто так. Ну нравится.
Хабр тоже этим страдает. А в Твиттере — вообще аккордные сочетания клавиш (типа G-T), как будто я в каком-то сраном Emacs.
Не, есть, конечно, приложения, где это возведено в абсолют — вроде Vim. Но это прям идеология. От веб-страниц я такого не жду.
А вторая категория приложений — те, кто перехватывает стандартные шорткаты. Например, ConfigCat — менеджер фича-флагов — делает неудобоваримое с шорткатом поиска.
Зачем? Почему? У меня всего 3-5 флагов на экране, имейте совесть. А может, я ищу UI-элемент какой-то. Ведь всё, что есть на экране — это текст.
А самое смешное, что они записывают факт предупреждения в LocalStorage, и больше такое не показывают. Я прям не могу представить себе этот диалог между продактом и лидом разработки. Надеюсь, была немая сцена.
А что раздражает вас в UX известных приложений и сайтов?
#ux
Есть две вещи, которые я очень не люблю в веб-приложениях.
Первая — однокнопочные шорткаты. Например, в Jiira — нажатие на W добавляет тебя в список следящих за таской людей. Зачем? Почему? Непонятно.
Возможно, кому-то и удобно, но моя природная неусидчивость заставляет меня иногда нажимать кнопки на клавиатуре просто так. Ну нравится.
Хабр тоже этим страдает. А в Твиттере — вообще аккордные сочетания клавиш (типа G-T), как будто я в каком-то сраном Emacs.
Не, есть, конечно, приложения, где это возведено в абсолют — вроде Vim. Но это прям идеология. От веб-страниц я такого не жду.
А вторая категория приложений — те, кто перехватывает стандартные шорткаты. Например, ConfigCat — менеджер фича-флагов — делает неудобоваримое с шорткатом поиска.
Зачем? Почему? У меня всего 3-5 флагов на экране, имейте совесть. А может, я ищу UI-элемент какой-то. Ведь всё, что есть на экране — это текст.
А самое смешное, что они записывают факт предупреждения в LocalStorage, и больше такое не показывают. Я прям не могу представить себе этот диалог между продактом и лидом разработки. Надеюсь, была немая сцена.
А что раздражает вас в UX известных приложений и сайтов?
#ux
В России можно посещать бесплатные IT-мероприятия хоть каждый день: как оффлайн, так и онлайн.
Чтобы не пропустить полезные — сохраните канал @FreeItEvent.
Анонсы вебинаров, хакатонов, конференций, мастер-классов и других событий в IT. Ивенты от гигантов индустрии и лучших специалистов по frontend и backend разработке
Всё публикуют здесь.
Чтобы не пропустить полезные — сохраните канал @FreeItEvent.
Анонсы вебинаров, хакатонов, конференций, мастер-классов и других событий в IT. Ивенты от гигантов индустрии и лучших специалистов по frontend и backend разработке
Всё публикуют здесь.
#новость дня
Ну что же, скажем Styled Components пока-пока!
https://opencollective.com/styled-components/updates/thank-you
Спасибо им, что показали нам, как можно работать с компонентами. Правда и цена оказалась высока.
Пока коллективный CSS-in-JS динозавр решал проблему экстракции CSS из бандла, растеряв мощь Babel под натиском Rust-решений, подтянулись млекопитающие вроде Tailwind и заняли нишу гораздо быстрее, мощнее и эффективнее.
С бесплатной экстракцией в том числе, да. И не ограниченные фреймворками.
Маятник мощно качнулся. Я не любитель Tailwind и, возможно, предпочту CSS Modules, но надо признать, что работу они проделали прекрасную.
Помянем, в общем.
А вторая новость — кратко: вышел Parcel 2.14.0 c поддержкой React Server Components!
Они подчёркивают, что Parcel сам по себе не фреймворк, но обеспечивает необходимый минимум и позволяет строить фреймворки уже на его базе.
Дивный новый мир!
#cssinjs #styled #parcel #tailwind
Ну что же, скажем Styled Components пока-пока!
https://opencollective.com/styled-components/updates/thank-you
Спасибо им, что показали нам, как можно работать с компонентами. Правда и цена оказалась высока.
Пока коллективный CSS-in-JS динозавр решал проблему экстракции CSS из бандла, растеряв мощь Babel под натиском Rust-решений, подтянулись млекопитающие вроде Tailwind и заняли нишу гораздо быстрее, мощнее и эффективнее.
С бесплатной экстракцией в том числе, да. И не ограниченные фреймворками.
Маятник мощно качнулся. Я не любитель Tailwind и, возможно, предпочту CSS Modules, но надо признать, что работу они проделали прекрасную.
Помянем, в общем.
А вторая новость — кратко: вышел Parcel 2.14.0 c поддержкой React Server Components!
Они подчёркивают, что Parcel сам по себе не фреймворк, но обеспечивает необходимый минимум и позволяет строить фреймворки уже на его базе.
Дивный новый мир!
#cssinjs #styled #parcel #tailwind
#баг дня
Посмотрите на иллюстрацию к посту, ничего интересного не замечаете?
А тут происходит ого-го какая драма!
Да, использование новомодных HDR-цветов и описывание их в OKLCH в Chrome на macOS приводит к неожиданным эффектам, будучи применённым на корневую ноду, aka тег HTML.
Правильный цвет тот, что темнее. Откуда я знаю? В Safari бага нет. В FIrefox, кстати, тоже.
А багу в Chrome на macOS тупо два года уже: https://issues.chromium.org/issues/40064153
Ну, бывает.
#oklch #color #bug
Посмотрите на иллюстрацию к посту, ничего интересного не замечаете?
А тут происходит ого-го какая драма!
Да, использование новомодных HDR-цветов и описывание их в OKLCH в Chrome на macOS приводит к неожиданным эффектам, будучи применённым на корневую ноду, aka тег HTML.
Правильный цвет тот, что темнее. Откуда я знаю? В Safari бага нет. В FIrefox, кстати, тоже.
А багу в Chrome на macOS тупо два года уже: https://issues.chromium.org/issues/40064153
Ну, бывает.
#oklch #color #bug
This media is not supported in your browser
VIEW IN TELEGRAM
Как выглядит ваше типичное утро четверга? Если там нет DJ Stonik1917 и милых роверов, то даже не зовите. А если серьезно — так утренним кофе-рейвом Яндекс начинает новый сезон образовательных проектов для стажёров.
Кто куда, а я на рейв🌟 📹
Кто куда, а я на рейв
Please open Telegram to view this post
VIEW IN TELEGRAM
Если нужно подтянуть разговорный английский для работы, помочь с этим могут в онлайн-школе Authentic Pigeon.
Ребята вкладываются в кастомизацию и топят за человеческий вайб, чтобы развивать английский было в кайф, а не обязаловку.
Абсолютно кайфую от подхода ребят. Занятия тут это не потогонка, а крутой дружеский разговор.Студент школы — Иван, QA инженер
Узнать подробнее о занятиях и записаться на бесплатный демо-урок можно в боте.
Реклама. Моисеев Кирилл Владимирович. ERID: 2VtzqwKiQ6b
Ребята вкладываются в кастомизацию и топят за человеческий вайб, чтобы развивать английский было в кайф, а не обязаловку.
Абсолютно кайфую от подхода ребят. Занятия тут это не потогонка, а крутой дружеский разговор.Студент школы — Иван, QA инженер
Узнать подробнее о занятиях и записаться на бесплатный демо-урок можно в боте.
Реклама. Моисеев Кирилл Владимирович. ERID: 2VtzqwKiQ6b
Telegram
PRO английский для работы ⚡️ Authentic Pigeon
Онлайн-школа разговорного английского для профессионалов с карьерными целями @authenticpigeon