Будни разработчика: блог лид JS

#инструмент дня Вчера писал про try и в последний момент засомневался, какую картинку поставить к посту. В итоге сдался и прилепил нейрослоп. А можно было просто открыть Boron. Это редактор скриншотов терминала. Вставляешь туда настоящий вывод консоли — вместе с ANSI-цветами — и дальше можно уже нормально собрать картинку: поменять тему, фон, размер окна, поправить текст, перекрасить отдельные куски и вообще привести всё в аккуратный вид. Причём редактируется именно содержимое терминала, а не картинка поверх картинки. Можно выделять текст, печатать свой, менять цвета отдельных фрагментов. Есть даже прямоугольное выделение через Alt/⌥ — удобно, например, чтобы перекрасить целую колонку таблицы или кусок вывода tree. Boron сам отличает команды от вывода: строки с $, ❯, > или ➜ делает ярче, остальное немного приглушает. Тем сейчас восемь: от VS Code Dark+ и Dracula до Tokyo Night, Nord и Catppuccin. На выходе PNG, SVG, JPEG или WebP, плюс картинку можно сразу скопировать в clipboard. Но самая интересная функция — всё нарисованное можно скопировать обратно как настоящий терминальный текст: plain text, ANSI escape sequences или код на chalk. То есть можно не только оформить существующий вывод, но и мышкой набросать, как должен выглядеть CLI, а потом забрать это обратно в код. В общем, вчера вместо нейрослопа можно было просто красиво снять try в работе. Видимо, Boron попался мне примерно на сутки позже, чем нужно. boron.sh GitHub #tool #terminal

#инструмент дня У меня регулярно есть код, который вроде бы не проект. Проверить библиотеку, накидать PoC, воспроизвести баг, попробовать какой-нибудь API, проверить идею на десяти строках. Обычно всё это заканчивается одинаково: test, test2, tmp, new-test, какая-нибудь папка на Desktop, ещё одна в /tmp, а через пару недель уже непонятно, где именно лежал тот эксперимент, который внезапно понадобился снова. Для этого есть try. Идея простая: все такие одноразовые штуки живут в одной директории, по умолчанию ~/src/tries. Когда создаёшь новую, try добавляет дату: 2026-08-07-redis-pool Потом достаточно написать: try redis и получишь fuzzy search по всем своим экспериментам. Он ещё учитывает, насколько недавно ты открывал директорию, поэтому свежие штуки поднимаются выше. Если ничего подходящего нет, из того же интерфейса можно сразу создать новую папку. То есть try одновременно заменяет мне кусок из mkdir, cd, find и попыток вспомнить, как я назвал папку три недели назад. Короче, можно посмотреть интерактивную презентацию: Ссылка скрыта Ещё полезная штука: try . Если запустить это внутри git-репозитория, он создаст для текущего репо отдельный worktree в tries. Нормальный вариант для «хочу быстро что-то попробовать, но текущую рабочую копию трогать не хочу». Можно и сразу клонировать чужой репозиторий туда же: try Ссылка скрыта А если какой-то такой эксперимент внезапно вырос во что-то настоящее, его можно перенести из tries в обычные проекты. try уберёт дату из имени, перенесёт директорию, а на старом месте оставит симлинк, чтобы старый путь не умер. В общем, штука довольно узкая, но хорошо попадает в конкретную проблему: временный код почему-то почти никогда не оказывается временным. Написана на Ruby, ставится через gem или Homebrew. Ссылка скрыта #experiment #tool

Проект от подписчика! Напоминаю, что я выкачу любую статью или проект от вас, не стесняйтесь писать. Презентация? Выступили на митапе? Хотите поделиться интересной статьёй — добро пожаловать! Привет! Меня зовут Артём Несколько недель назад заинтересовался созданием собственного AI-бота внутри Telegram, который бы вел календарь, финансы, помогал что-то быстро проанализировать, не выходя из мессенджера, и обходился бы достаточно дешево. Для этого уже есть готовые решения (openclaw или hermes), но у них есть 2 проблемы: они избыточны и их неудобно масштабировать на несколько пользователей. Хотелось сделать одного бота для себя, друзей и тех, кому это было бы полезно. Пришлось создать собственное решение, которое было бы масштабируемым, дешевым, но достаточно качественным. Написал свой harness для работы LLM, указал её возможности, а в качестве основной модели, после нескольких тестов и попыток удешевить работу нейросети, добился отличной работы на модели deepseek-v4-flash. Так появился vaka-assistant. Бот-ассистент бесплатный и пока работает в тестовом режиме, но уже может: • ставить напоминания, записывать задачи • учитывать финансы и устанавливать лимиты трат • понимать голосовые сообщения • запоминать факты о пользователе, можно настроить личность ассистента и его стиль общения • есть удобное представление данных в Telegram Mini Apps Думаю, что многим такой бот может быть полезен: как в рабочих делах, так и в обычной жизни. Внутри чата можно оставить фидбек, буду рад услышать пожелания по улучшению и развитию проекта. Ссылка на ассистента

#заметка дня В npm нашли ChainDrop — червя, который успел выпустить 2212 заражённых версий в 444 пакетах. Стартовой точкой стал [email protected]. После установки пакет искал npm-токены и, если находил, публиковал заражённые версии других пакетов, к которым у владельца токена был доступ. Так заражение пошло дальше по экосистеме и затронуло, среди прочих, flat-cache, file-entry-cache и cache-manager. Код запускался через preinstall. Пакет скачивал Bun с GitHub и выполнял обфусцированный скрипт, который собирал токены GitHub, npm, PyPI, AWS, GCP, Azure, Docker, Kubernetes, Vault и других сервисов. В GitHub Actions он ещё и пытался достать секреты из памяти runner-процесса. Заодно менялись конфиги Claude Code и VS Code. Поэтому заражённый репозиторий мог сработать не только при npm install, но и просто при открытии проекта или запуске агента. С keyv есть отдельный нюанс. Вредоносная версия была опубликована через официальный GitHub Actions workflow, с npm Trusted Publishing и валидной SLSA provenance. То есть provenance не была подделана. Она честно подтверждала, что пакет собран официальным workflow из конкретного коммита. Просто сам коммит уже содержал вредоносный код, потому что аккаунт мейнтейнера был скомпрометирован. Поэтому наличие attestation здесь ничего не гарантировало. Она подтверждает происхождение сборки, но не авторизованность изменений в репозитории. Если одна из заражённых версий попала в CI или локальное окружение, откатить пакет недостаточно. Токены и секреты, доступные этому окружению, придётся перевыпустить. StepSecurity #npm #attack

#статья дня В CSS предлагают добавить роутинг Сейчас без JS кастомные анимации перехода по страницам практически невозможны: ловить переход, смотреть исходный и конечный URL, определять, по какой ссылке кликнули, и уже после этого выбирать нужный View Transition. В черновике CSS Route and Navigation Matching предлагают описывать эту логику прямо в CSS. Всё можно описать декларативно, если ты достаточно смел. Ну вы поняли. Например, сначала объявить маршруты: @route --home { pathname: url-pattern("/"); } @route --article { pathname: url-pattern("/articles/:id"); } А потом задать отдельную анимацию для перехода с главной на статью: @navigation (from: --home) and (to: --article) { @view-transition { navigation: auto; types: slide-left; } } Для перехода назад можно использовать другой тип анимации. Кроме @route и @navigation, в черновике есть :nav-source — селектор элемента, с которого начался переход, и :link-to() — селектор ссылок, ведущих на определённый маршрут. Самый понятный пример — список карточек. Пользователь нажимает на изображение, открывается отдельная страница, а именно эта картинка плавно превращается в большое изображение статьи. Сейчас для такого обычно нужен JavaScript, который найдёт нажатый элемент и назначит ему view-transition-name. Здесь это хотят сделать без ручной обвязки. Роутер это, конечно, не заменяет. CSS не будет загружать страницы или управлять историей браузера. Он просто сможет выбирать стили и анимации с учётом того, между какими адресами происходит переход. Пока это ранний Editor’s Draft, поэтому синтаксис ещё вполне может измениться. Попробовать можно в Chrome Canary с включённым Experimental Web Platform Features. Подробный разбор — у Ван Дамма нашего Брамуса, сам черновик — на сайте CSSWG. #route #css #view #transition

#инструмент дня Этот пост — ежегодный #бородач. Традиция. Пять (охереть) лет назад я писал большую серию статей на тему того, как же тестировать WebKit aka Safari на Windows и Linux. Вот, можете почитать: Ссылка скрыта Дайте знать, если пора эту серию статей обновить! И тогда мы остановились на том, что можно просто использовать... Browserstack! Но не все могут себе позволить даже 150 долларов в год за фриланс-план… или всё же есть выход? Выход правда есть! Browserstack активно поддерживает open-source проекты и даёт бесплатные лицензии на год! Если у вас есть такой — смело топайте на Ссылка скрыта и вбивайте там ссылку на репозиторий. Главное — чтобы была подходящая лицензия. Полного списка я не нашёл, но уверен, что GPL, BSD и MIT точно включены. Я же указал Creative Commons Attribution 4.0 International. Ах да, что же у меня за проект такой опенсорс? Да просто сайт этого канала: Ссылка скрыта Как видите, требования невысокие :) Надо бы обновить его как-то уже. Или другой подобрать. Он в анабиозе сейчас, но работу над ним можно и восстановить. Да и пульт мой я ещё подумываю открыть. Так вот, доступ обновляется каждый год пока репозиторий доступен! У меня, выходит, уже 5 лет. После прохождения ручной модерации, мне пришло письмо. Я получил годовые планы тестирования браузера и мобильных с весьма вкусными условиями. Короче, если вы ещё не начали свой проект – чего вы ждёте вообще? #browserstack #testing

💡 Хватит мучить железо. Выносите тесты, небольшие сервисы и личные проекты на надежный сервер. У Selectel виртуальный выделенный сервер (VDS) поднимается за пару минут. Получите изолированные ресурсы, полный административный контроль и скорость быстрых NVMe-дисков. И всё это — от 200 ₽/мес. А новым клиентам дарят ещё и бесплатный домен 🎁 Нервы и ресурс ноутбука стоят дороже. ➡️ Арендуйте сервер для своего проекта выгодно с Selectel. Реклама. АО "Селектел". erid:2W5zFHEuFr1

#инструмент дня AI-парсинг (скрейпинг, скраппинг) сайтов набирает обороты, но классические утилиты никто не отменял. И среди таких утилит очень выделяется pipet: Ссылка скрыта Создаем pipet-файл: curl Ссылка скрыта .title .titleline span > a .sitebit a Ну и запускаем: pipet hackernews.pipet Красота? Не то слово. Более того, утилита умеет рендерить сразу в шаблоны, напоминающие Mustache: {{range $index, $item := index (index . 0) 0}} • {{index $item 0}} ({{index $item 1}}) {{end}} Ясное дело, никто не отменяет и ИИ прикрутить, если так надо :) Ну а вообще, поддерживаются пайпы, потому результат любой строки конфигурации можно пропустить через что угодно вообще. Да и запуск возможен не только curl-ом, но и Playwright. В общем, я впечатлен. Надо брать. #go #parser #scraping #бородач

#фишка дня Не только лишь все знают, что одному элементу можно задавать несколько фонов. Ну, буквально: .myclass { background: background1, background2, /* …, */ backgroundN; } А вот чего точно могли не знать, так это что если расположить в углу блока по радиальному градиенту, получатся прикольные завихрения, как на иллюстрации. Пруф имеется: Ссылка скрыта Всем красоты, котаны. #css #gradient #бородач