Веб-разработка *

Практический разбор двух простых шин: как разделить запуск действий и реакцию на изменения в реальном frontend-приложении.

Внутреннее обучение без бюджета, без серверов и без "запишитесь на вебинар". Один html-файл на ~118 Кб, который открывается двойным кликом, работает без интернета, помнит прогресс и выдает сертификат. Внутри: 7 модулей, 15 интерактивных схем, 21 вопрос, полезный чек-лист, игровые баллы, глоссарий и сертификат на выходе. Без библиотек, сборщиков и бэкенда. Открывается двойным кликом, прогресс хранится в браузере. Разберу архитектуру и дам промпт, чтобы собрать такой же под свою тему. Готовый рецепт, который сэкономит время, если вдруг возникла такая задача.

Как работать с коллекциями в Http API‑клиенте...

В клиенте уже год как работал экспорт коллекции как патча — одного JSON‑файла с операциями вида upsertRequest / removeRequest / setCollectionMeta. Достаточно, чтобы переслать коллеге точечное изменение: поправил заголовок в одном запросе — экспортировал — коллега применил патч у себя. Рабочая штука для передачи «из рук в руки».

Ниже — история одной конкретной фичи: зачем понадобился «git‑friendly» экспорт коллекции, как устроена стабильная сериализация и разрешение коллизий имён файлов, и какую дыру в защите секретов мы нашли и закрыли по пути. Без сравнений с другими клиентами — только то, что случилось и что мы с этим сделали.

Мы делаем пет-проект «Чатограмма»: он считает статистику переписки прямо в браузере, файл с перепиской на сервер не уходит. Такое обещание проще всего проверить без чтения политик: включить авиарежим и посмотреть, посчитается ли. Для этого странице нужно ответить на, казалось бы, тривиальный вопрос: есть ли сейчас сеть? На iPhone ответ оказался неожиданным.

Большинство экспертов, наставников, онлайн‑школ при запуске своего курса/обучения думают о том, как получить ту конверсию заявок и учеников, которые они поставили себе как цель. Думают также о своем продукте и его качестве, чтобы ученики получили и были довольны своими результатами. И совсем забывают обезопасить свой запуск с юридической стороны. Как итог: несут колоссальные убытки.

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

Привет, Хабр!

Я часто вам рассказываю, как HTML и CSS помогают улучшить пользовательский опыт в наших веб-интерфейсах. Мне это наскучило. Сегодня я хочу поговорить с вами о практиках, которые заставляют пользователей очень сильно ругать разработчиков.

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

Давайте посмотрим, что я вам подготовил.

Привет! Меня зовут Александр Каненков, я backend-разработчик в компании Домклик.

После перевода сервиса со второго Spring Boot на третий (а у кого-то уже и на четвёртый) мы с командой заметили следующую картину: HTTP-запрос журналируется с traceId, цепочка собирается в трейсе, но стоит сработать задаче Quartz — в журналах worker-потока гордо красуется [NoTrace, NoSpan]. Задача исполняется «в никуда» — без единого идентификатора, вне какого-либо трейса, и связать её с запросом, который её запланировал, невозможно.

Давайте разберём по шагам, почему это случилось и как починить так, чтобы работало и с RAM (in-memory), и с JDBC job store.

Откройте форму заказа почти любого интернет-магазина. Под полями две-три галочки: согласие на обработку персональных данных, согласие на рассылку, согласие с офертой. Пока все не отмечены, кнопка «Оплатить» серая. Спросите, зачем так, и ответ почти всегда будет один: юрист сказал, что без согласия нельзя, а лишнее согласие точно не повредит.

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

Главное: согласие - лишь одно из оснований обработки, причём самое хрупкое, потому что человек может отозвать его в любой момент. Если ваш процесс держится только на согласии, он держится на честном слове клиента.

Каталог всех оснований мы уже разбирали в отдельной статье. А теперь о другом: почему бизнес собирает согласия там, где они не нужны, и во что ему это обходится.

Этой осенью сын пошёл в пятый класс, и я заметил странную вещь: со смартфоном он на «ты», а за обычной клавиатурой теряется. Мы попробовали несколько тренажёров слепой печати, но ему быстро стало скучно — и я решил сделать свой.

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

С AI в клиентской разработке стало выгодно делать то, что раньше технически было несложно, но экономически бессмысленно. Какой‑нибудь специфический фильтр, дополнительный экран в админке, сценарий обработки данных... Раньше смотришь на задачу и понимаешь, что руками это несколько часов работы. Клиенту функция не настолько нужна, сколько она стоит в хорошей реализации, поэтому либо от неё отказываемся, либо ищем готовый плагин, который умеет нужное и подгружает ещё семьдесят свистелок.

Сейчас значительную часть такой работы можно сделать намного дешевле. AI снимает вагон рутинной работы, и маленькие кастомные решения перестали быть чем‑то вроде «ну нет, это полдня печатать код и ещё день на отладку». Там, где раньше приходилось подгонять задачу под готовый инструмент, теперь чаще можно подогнать инструмент под задачу.

10 браузерных API, заменяющих пакеты NPM и плагины jQuery: dialog, popover, переходы отображения (view transitions), structuredClone, groupBy и Temporal с заметками о поддержке.

Мы делаем пет‑проект «Чатограмма», который считает статистику переписки: кто пишет первым, кто быстрее отвечает, в какие часы вы на связи. С первого дня у него одно жёсткое правило: файл с перепиской не уходит на сервер. Всё считается в браузере пользователя, а сервер не видит ни одного сообщения — не потому, что обещает не смотреть, а потому, что сообщения до него физически не доходят.

Потом понадобилась подарочная книга: PDF формата A5, где самые яркие моменты переписки собраны по главам — с чего всё началось, первое «мы с тобой», лучшие моменты каждого года, общий словарь, квиз «Кто это написал?». Плюс вариант для печати дома брошюрой: A4, сложить пополам, скрепить степлером.

И здесь правило «ничего на сервер» перестаёт быть бесплатным. Книгу обычно верстают на сервере: headless Chrome, LaTeX, что угодно с нормальными шрифтами и без ограничений по памяти. У нас всё это должно работать на телефоне, в том числе на iPhone, в том числе во встроенном браузере мессенджера. Ниже — как это устроено и на какие грабли мы наступили.

Я сделал бесплатную проверку сайтов на нарушения 152-ФЗ: вводишь адрес, получаешь список проблем. Первая версия умела ещё кое-что, чего я в неё не закладывал. Подставляешь чужой хост и порт, и по тексту ошибки видно, открыт порт или закрыт. Бесплатный сканер портов для всего интернета, причём запросы идут с адресов Cloudflare.

Это одна из трёх дыр, которые автоматическое ревью нашло в первой версии до выкладки. Ниже про все три, про то, почему такой сервис вообще нельзя ставить рядом со своими серверами, и про слабые места. Одно из них я нашёл и закрыл, пока писал эту статью.

Про свой тренажёр английского Yet Another English я уже писала. Там можно собирать слова, заниматься, повторять забытое. Но мне захотелось ещё геймифицировать это все. Чтобы начинаешь с яйца, учишь слова, получаешь плюшки и постепенно выращиваешь себе персонажа. Ну то есть тамагочи, только кормить его надо своими занятиями.

Начала с Claude Opus 5.0, подключённого к Blender через MCP, потом продолжила через GPT. Ушла примерно неделя по два часа в день, то есть около 14 часов и 100 баксов за Астру.

Покажу, с чего начинала, какие версии пришлось переделать и сколько всё это весит. Если тоже хотите добавить 3D-персонажа в свой проект, возможно, сэкономлю вам пару переделок.

DISCLAIMER: Это неофициальный форк. Но, по моим сведениям, и в официальный pony эти фичи скоро подъедут в каком‑то виде.

Некоторое время назад, я решил испробовать программирование с помощью ИИ‑агентов и решил выбрать pony в качестве пет‑проекта. О pony я уже писал в предыдущей статье. Теперь хочу поделиться результатами своего недельного спринта.

В pony добавилось:
— поддержка асинхронности
— поддержка миграций
— разные улучшения из серии quality‑of‑life

Так что, фреймворк pony теперь чрезвычайно важен и сердит — что можно понять по этой картинке. Всё — благодаря DeepSeek 4.1 Flash и Kimi K3 (последняя — умная, но дорогая — она делала ревью).

SAML больше двадцати лет обеспечивает единый вход (SSO) в корпоративной и академической среде. Но протокол прогибается под тяжестью собственной сложности, и ему пора на пенсию. Разбираемся, как SAML появился, почему его раз за разом ломают исследователи безопасности и почему на смену ему должен прийти OpenID Connect (OIDC).

Всем привет! Меня зовут Денис, я фронтенд-разработчик в ISPsystem. В этой статье расскажу, как мы разработали и встроили модуль ИИ-ассистента в BILLmanager.

Разберём, как устроен ИИ-консультант, почему выбрали такие решения, с какими сложностями столкнулись и как всё это реализовали — внутри много кода и деталей.

Всем привет! Меня зовут Павел Барсуков, я frontend-разработчик в компании «Программный Продукт».

Основной мой стек – Vue, Nuxt и все рядом лежащее. Angular до недавнего времени я видел в основном в курсах на Youtube, пару раз на фрилансе, где особо с ним не взаимодействовал, и в мемах про исключительность Angular разработчиков и очень частые обновления версий. И тем не менее, мне была поставлена задача мигрировать проект со старой версии на более новую, и я взялся за это.

Обычно задача «создать базу знаний из сайта» звучит просто: взять HTML, извлечь текст, разбить его на фрагменты, построить embeddings и отправить всё в RAG.

На современных сайтах этот подход всё чаще перестаёт работать.

Главная причина — сайт может практически не содержать данных в исходном HTML. Пользователь открывает страницу, браузер загружает JavaScript, JavaScript обращается к API, а уже API возвращает услуги, товары, объекты, статьи, цены и другие данные.

Именно с такой проблемой мы столкнулись при разработке новой возможности в LLMCOD.

Теперь система умеет работать не только с обычными страницами, но и с SPA-сайтами и доступными открытыми API.

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

Я держал проект на Next.js на Vercel почти три месяца и уехал на обычный VPS за 990 рублей в месяц. Главное, чего боялся: потерять то, за что Vercel любят. Сборка, которая не трогает живой сайт. Переключение без простоя. Откат одной кнопкой. Под катом схема, которая всё это повторяет на одном сервере без Kubernetes, Docker и прочей тяжёлой артиллерии, и список граблей, на каждую из которых я наступил.