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

Когда возникает идея создать браузерный IRC-клиент без JavaScript, приходится сталкиваться с классической проблемой фронтенда: все насколько привыкли гнать динамику через JavaScript, что перестали замечать возможности HTML/CSS с щепоткой серверной магии по реализации многих фич. HTTP Streaming существует с давних времён, а CSS эволюционировал настолько, что может справиться с логикой состояний — но мы упорно продолжаем грузить мегабайты JavaScript (и иногда даже WebAssembly) для решений, которые вполне можно реализовать иначе.

Идея создать IRC клиент без JavaScript не совсем нова (хоть это и выяснилось уже после создания такого :) ). Ещё в нулевых появился CGI:IRC — настоящий IRC клиент, который может работать полностью без JavaScript, позволяя людям общаться в реальном времени через браузер, даже если JavaScript по каким-то причинам не работал. Но это было в эру table-layouts, и когда CSS не был так развит, как сейчас. Сегодня возможностей больше, и мы воспользуемся ими, чтобы навернуть функциональность, которая не видана CGI:IRC.

Результат можно глянуть (хоть и с дополнительной стилизацией и изменениями, которые не так важны для статьи) здесь, а ещё на GitHub

Привет! Меня зовут Дмитрий Михеев, я ведущий разработчик в MAGNIT OMNI — бизнес-группе ритейлера «Магнит», которая отвечает за развитие омниканального опыта для клиентов.

В своих сервисах для межсервисных коммуникаций помимо gRPC-запросов мы используем брокер сообщений Kafka. Если описывать его в двух словах, Kafka — это распределённый журнал событий (event log), через который сервисы обмениваются данными в реальном времени.

Не буду подробно останавливаться на устройстве Kafka — это хорошо описано в документации. В этой статье хочу подсветить один неочевидный момент, который может привести к проблемам при работе с consumer’ами — повторную обработку сообщений (retry).

Сегодня я подробно разберу раздел Websites в opensource системе аналитики Matomo. Как Matomo хранит сайты внутри системы, чем различаются Website, Mobile App и Roll-Up, как правильно строить архитектуру аналитики, какие ошибки почти все совершают при масштабировании Matomo.

Наступило время, когда рынок ИТ-специалистов начал чётко разделяться на суперпрофессионалов и вечных джунов. Промежуточного звена больше не будет.

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

Забудьте о привычном карьерном росте, который вы знали. Правила уже поменялись. Вас заменила не нейронная сеть. Вас заменили четырёхрукие сеньоры-Шивы, которые в одиночку выдают результат за целую команду.

Каково ваше место за этим столом? Давайте разбираться вместе.

Хотим рассказать о том, как мы делаем платформу для онлайн звонков и видео конференций с ИИ, но чтобы не слишком сложно было. Начнем с самого низкого уровня - с механизма передачи данных между клиентами в созвоне. В этой статье мы расскажем про WebRTC, NAT, STUN/TURN и немного про LiveKit

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

Это NoiR Code. Он кодирует текст в изображение, которое читается как чёрно-белый нуар-кадр: полутоновый силуэт города, луна, штрихованные тени. Наводишь камеру в специальном приложении или веб-сервисе, созданном для поддержки этого формата, и получаешь своё сообщение обратно. Попробовать можно здесь: noir-code.suncake.xyz

Предположим, вы пишете интерпретатор машины Тьюринга, запущенный в Web Worker’е. UI должен показывать трейс — как машина шагает от состояния к состоянию, что пишется на ленту, как двигается каретка. Чтобы пользователь успевал считывать изменения в UI, между итерациями движка нужна короткая задержка — миллисекунды, регулярно, на каждом шаге. Это приостановка движка между итерациями — регулярная и предсказуемая, не «пауза» в смысле UI-кнопки «Пауза» (та останавливает машину до клика «Продолжить»).

Возникает вопрос: где именно в цикле итерации воркеру нужно реализовать приостановку? Кандидатов два, и выбор между ними фиксирует сразу два контракта: хуков движка и протокола между воркером и основным потоком. Выбрать точку — это спроектировать обе стороны сразу; промахнуться — испортить обе. Эта статья — про этот выбор.

Шесть лет назад, в начале 2020 года, группа разработчиков оглянулась на Firebase и подумала: «А давайте сделаем то же самое, но открытым кодом и на SQL!» Так родился Supabase: проект с искренней целью дать разработчикам контроль над данными и избавить от проприетарных заморочек.

А с распространением Vibe Coding, когда нейросети удобнее работать с API, а не писать логику для СУБД, взлёт Supabase пошел по экспоненте.

Большинство проблем с SSL-сертификатами возникает не при настройке TLS, а на этапе создания CSR: забытые SAN-домены, неправильные ожидания от wildcard, ручные ошибки в openssl.cnf. Разбираем, почему с сокращением срока действия сертификатов до 47 дней к 2029 году ручной выпуск перестаёт быть жизнеспособным, и какие инструменты приходят ему на замену.

Мультиконтекстный сайт на статических страницах без генерации на лету. Почему мы выбрали ручную вычитку и фиксированные версии

Я не программист, но я создал два сайта. Один с нуля, второй перенёс с Tilda, оба через Claude Code и с админ-панелью через Claude же. В процессе я прошёл через ИИшный газлайтинг, сотню правок уровня «перемести это выше, еще выше, теперь ниже» и получил два проекта, которыми теперь могу проще управлять.

Рассказываю, как, зачем и почему (и стоит ли так делать).

В Next.js формы и inline CRUD довольно быстро упираются в одну и ту же развилку. Можно пойти привычным путём и собрать ручной API: отдельный route handler, fetch из клиента, локальные флаги pending, error, success, плюс своя логика для blur, Enter, Escape и закрытия редактора. На небольшом примере это выглядит терпимо. Но как только в проекте появляются создание, переименование, удаление и несколько inline-форм на одном экране, код начинает расползаться не по бизнес-логике, а по обвязке.

Проблема в количестве промежуточных слоёв между формой и записью данных. Отдельный endpoint, отдельный клиентский submit, отдельный формат ответа, отдельные флаги состояния, отдельная синхронизация UI после успеха или ошибки. Для таких сценариев Server Actions в App Router нужны потому, что для форм и inline-редактирования дают более короткую и предсказуемую write-точку.

В проекте примере Workbench покажем на создании, переименовании и удалении проектов, секций и заметок. У формы есть action, серверная функция получает FormData, возвращает типизированное состояние, а клиент живёт вокруг одного паттерна: state, formAction, isPending. В результате форма собирается как связанный цикл, а не как набор разрозненных обработчиков.

Разбираемся, как работает robots.txt, почему его часто путают с инструментами индексации и какую роль он играет в эпоху ИИ-сканеров.

Не совсем пятничное чтиво, но…

Как-то так случилось, что решил разобраться для себя лично – какие подвижки появились в вопросе внедрения искусственного интеллекта в сфере сайтостроительства. ИИ действительно показал себя неплохо в отдельных задачах, но есть у него и минусы. Всё это тема для отдельного обсуждения, но здесь – только обзор реальной картинки. Делюсь бесплатно и без SMS ))

Я не мечтал попасть в IT. У меня вообще не было ощущения, что это «моя история». Но в какой-то момент появилась возможность, которой я просто воспользовался, — и дальше всё закрутилось.

Меня зовут Максим Никитин, я техлид разработки в крупном банке и выпускник курса «Веб-разработчик» в Яндекс Практикуме. Хочу рассказать свою историю, проанализировать опыт и пофантазировать, что бы я посоветовал себе, если бы начинал путь в IT сегодня.

Два часа ночи, у разработчика горит релиз, он подключает ваш API — и получает в ответ голое «invalid_request». Что не так, почему, что делать — ни слова. Сорок минут гаданий и злое письмо в поддержку.

Разбираем, как сделать опыт разработчика (DX) человеческим: как переписать ошибки по стандарту RFC 9457, но для живого человека; почему время до первого успешного вызова — главная метрика онбординга; и отчего предсказуемый, «скучный» API — это комплимент. С готовым шаблоном, который можно прикрутить к себе сегодня.

Думаю, многие хотя бы раз мечтали о собственном микро-продукте.

Маленький сервис, который можно спокойно пилить по вечерам, постепенно продвигать, а он со временем начнёт приносить вторую зарплату.

Я тоже так думал.

Полтора года назад мы с другом начали делать свой небольшой продукт. Потратили на него примерно 100 000 ₽, вложили кучу времени и сил. Сервисом воспользовались более 5 000 человек. А заработали мы примерно 1 000 ₽.

И теперь я пытаюсь понять, где именно мы облажались.

Привет!

Это 17 выпуск Frontend Status — дайджеста по фронтенд-разработке.

В этом выпуске:

📺 Страница отрисована, а интерфейс всё ещё «оживает»: отложенная гидратация в TanStack Start на карусели Jack Herrington и подкаст с Андерсом Хейлсбергом — от Turbo Pascal до того, как ИИ меняет ремесло, когда код пишут не построчно — чтобы понять, где теряется скорость и куда движется разработка.

🤖 Половина кода уже с ИИ, а доверия меньше: опрос State of AI 2026 (54% сгенерированного кода), Яндекс и тысячи конфликтов при мерже Chromium, перцептрон 1959 года и «чтение мыслей» модели Anthropic — чтобы смотреть на внедрение ИИ цифрами и без иллюзий.

🛡️ Пустили агента в репозиторий — а что он может сломать: разбор Positive Technologies и история, когда ИИ «находит» CVE, который уже был в обучающих данных — чтобы не открывать доступ вслепую.

💫 Анимация замирает вместе с React: управление бесконечными CSS-циклами без прыжков и сравнение CSS, Motion и GSAP на главном потоке — чтобы интерфейс оставался плавным без лишнего JavaScript.

⚡ Нужна коллаборация как в Figma и Miro: Hocuspocus от Tiptap на Y.js и CRDT без гонок правок — WebSocket, офлайн и Redis — чтобы собрать совместное редактирование в своём редакторе без тяжёлого бэкенда.

⚡ Поиск раздувают до эмбеддингов и LLM: Fuse.js ~6 КБ с нечётким поиском, кириллицей и Web Workers в 7.4.0 — чтобы находить по списку в браузере без сервера и векторной базы.

⚡ TypeScript кажется очевидным, пока не упёрлись в типы: 15 коротких приёмов от Matt Smith — satisfies, проверка «все варианты учтены», строгий режим — чтобы писать безопаснее и без лишних аннотаций.

⚛️ React-шаблон на 35 000 звёзд без хаоса в репозитории: разбор Bulletproof React на Habr и MUI X 9.3 — чтобы взять проверенную архитектуру и не собирать стек с нуля.

🔥 Ember 7.0 без сюрпризов при мажоре: в основном сняли устаревшее, путь через 6.12 и Vite по умолчанию — чтобы обновиться без лотереи.

🅰️ Angular 22 меняет правила игры: OnPush по умолчанию, signal forms и инструменты для агентов в API — чтобы заложить новый проект на актуальных примитивах, а не по инерции.

𝐒 Svelte: $state.eager и pending больше не рвут зависимости, батчи идут связным списком — чтобы асинхронный UI вёл себя предсказуемо после обновления.

📦 Solid 2 в бета-версии, звонки WebRTC в production и шрифтовые иски на 15,3 млн ₽: асинхронность как примитив, грабли CallKit и SFU, PHP-парсер для проверки сайта — чтобы не удивляться ни релизу, ни иску.

🌎 Браузер снова забирает вёрстку у хаков: column-rule и row-rule в зазорах grid/flex и HTML внутри canvas за флагом — чтобы меньше DOM-обходов и проще UI поверх 3D.

🌐 Стандарты без костылей: сравнение объектов по значению (Composites в TC39) и элемент <install> для PWA без своего JavaScript — чтобы меньше полагаться на ссылки и самописные кнопки установки.

🛠️ Агенты под контролем: statewright с фазами и лимитами, свой Claude Code за вечер на DeepSeek и экспериментальный агент доступности GitHub н

В процессе кастомизации коробочной CRM Битрикс24 часто клиенты просят внедрить им права доступа. Захотелось внедрить с интерфейсом, как это выглядит в Задачах или Сделках. Изучил документацию — там всё изложено лишь в общем виде, пришлось анализировать исходники, сжечь несколько миллионов токенов различных нейронок, и даже после этого вникать в нюансы и дебажить код.

В статье подробно разбираются нюансы архитектуры компонента BX.UI.AccessRights.V2, подводные камни при внедрении в свой модуль (готовый репозиторий прилагается).

Короткая статья о плагине, с помощью которого можно сделать строку поиска на сайте по товарам чуточку удобнее.