8 сентября в 13:16 UTC система мониторинга Aikido зафиксировала подозрительные действия: в npm начали публиковаться новые версии популярных пакетов, содержащие вредоносный код.
На Хабре уже есть статьи про качество кода (линты, хинты, хорошие практики), стратегии обработки ошибок (feature toggle, request retry) и UX/UI их отображения.
Это еще одна статья про разбор ошибок и аварий, но с точки зрения небольших фич фронта, которые вы можете внедрить самостоятельно и упростить свою работу, а также помочь отделу в целом.
На днях обнаружил, что в русскоязычной сети нет перевода этой раритетной статьи, которая положила начало разработке самого известного архитектурного паттерна MVC. Восполняем пробел.
Содержание этого документа интересно и с исторической точки зрения (а как там “деды” воевали программировали), так и в плане уточнения некоторых современных представлений об этом паттерне и программной архитектуре в целом.
Иллюстрации по максимуму сохранены как в оригинале. По ходу есть сноски с подробностями и ассоциации редактора в конце.
СУЩНОСТЬ-МОДЕЛЬ-ВЬЮ1-РЕДАКТОР
на примере из системы планирования2
Кому: LRG3
От: Тригве Реенскауг4
Файл: [IVY]<Reenskaug>SMALL>TERMINOLOGY2.DOC
Дата: 12 мая 19795
Цель данной заметки - исследовать метафоры thing-model-view-editor через последовательный набор примеров. Все примеры взяты из моей системы планирования и иллюстрируют вышеуказанные четыре понятия. Все примеры были реализованы, хотя и не в рамках чистой структуры классов, описанной здесь. Метафоры соответствуют real world-Model-view-Tool, предложенным в заметке о требованиях DynaBook ([Ivy]<Reenskaug>DynaBook.doc).
THING (СУЩНОСТЬ)
ОПИСАНИЕ ТЕРМИНА
Нечто, представляющее интерес для пользователя. Это может быть что-то конкретное, как дом или интегральная схема. Это может быть что-то абстрактное, как новая идея или мнения о статье. Это может быть целое, как компьютер, или часть, как элемент схемы.
ПРИМЕР: КРУПНЫЙ ПРОЕКТ
Сущность здесь - это крупный проект. Это может быть проектирование и строительство большого моста, электростанции или морской нефтедобывающей платформы.
Без сомнений, JavaScript — крайне популярный язык программирования. И разработчики постоянно создают обновления, которые позволяют писать код проще, короче и понятнее. Одним из таких инструментов стала деструктуризация — способ получения данных
Привет, Хабр! Меня зовут Александр Дудукало, я автор базового курса по JavaScript. В этом тексте на примерах разберемся, как работает синтаксис и как деструктуризировать массив. Подробности под катом!
Тема безопасности в эпоху LLM всплывает всё чаще. И речь идёт не о самой модели — а о пользователях, которые доверяют ей без оглядки.
Сегодня многие разработчики и админы спрашивают у GPT не только совета, но и готовые команды. Результат выглядит правдоподобно — и команда уходит в терминал. Иногда прямо на прод.
Обзор развития проекта Boson PHP — платформы для создания десктопных приложений на веб-технологиях. Новый сайт, обновленная документация, веб-компоненты (главная фишка проекта), и технические особенности разных ОС.
По мере роста фронтенд-приложений управление пользовательскими взаимодействиями становится все более важным. Добавление обработчика событий на каждый интерактивный элемент — плохая практика: это усложняет код, увеличивает расход памяти и снижает производительность. Здесь на помощь приходит делегирование событий (event delegation).
Каждая интерактивная веб-страница опирается на Document Object Model (DOM) и ее систему событий. Когда мы нажимаем кнопку, вводим текст в поле или наводим курсор на изображение, возникает событие. Но оно не происходит само по себе — событие проходит по дереву DOM в процессе, который называется распространением события (event propagation).
Продолжение статьи о safe-fetch — библиотеке без try/catch для HTTP.
Через день после первой публикации произошла эволюция: stable релиз 1.0 + экспериментальный адаптер для React Query.
Рассказываю, как фидбек сообщества превратил простую обертку в экосистему с монорепо.
Всем привет! Я Артём Седых, ведущий разработчик и тимлид проекта банковского сопровождения. Наш сервис — 8-летний монолит на PHP с командой из 39 человек. В цикле статей рассказываю об опыте разработки и внедрения альтернативы pinba: гибкого инструмента мониторинга, который позволяет увидеть живую систему как на ладони и понять, из‑за чего именно проседают определенные экшены. Сегодня, в продолжение первой статьи, закрываем архитектурную часть — поговорим об отправке и хранении метрик. А главное, перейдём к самому интересному: получившимся дашбордам Grafana. На конкретных примерах покажу, какие проблемы удалось обнаружить и какие рекомендации по оптимизации можно извлечь из каждого элемента.
Telegram Music Hub (TMH) — это open-source решение, которое превращает ваш Telegram-канал в единое цифровое пространство для музыки, блога и сообщества.
И всё это — на самом обычном виртуальном хостинге, без баз данных, без сложных зависимостей, без дорогих серверов.
В начале 2025 года мне в голову пришла идея запустить свой проект.
Наверняка многим знакомо это состояние: когда ты горишь своим пет-проектом, готов работать днями и ночами, в выходные и даже в отпуске. Когда не страшно браться за новые области, о которых раньше мало что знал — маркетинг, продуктовую часть и всё остальное.
Я тоже несколько месяцев жил именно так. И даже радовался тому, что вкладываю в это свои собственные деньги.
Но однажды наступает момент, когда понимаешь: всё сделал неправильно. Сил и желания начинать с нуля уже нет. Ты ловишь себя на мысли, что будешь счастливее всего просто бросив всё это. И бросаешь.
Плохой URL путает пользователей, хороший — работает как швейцарский нож. Разбираем анатомию, правила построения иерархичных путей, мощь Query-параметров и истинное назначение Hash. Практика на JavaScript и чеклист готовых решений.
Ситуация: пишешь код на JS, хочешь обработать исключение, пробрасываешь throw, ловишь его с помощью try‑catch. Но добавим нюанс: пусть это нужно сделать для setTimeout. Эта функция использует окружения браузера — не JS‑функция, асинхронная.
Загвоздка: catch не сможет поймать ошибку.
Этот пример — одна из нескольких особенностей JS, из‑за которых я считаю обработку исключений «из коробки» на этом языке неудобной. Но есть и хорошие новости — для JS существуют альтернативные способы работы с исключениями, с которыми дела обстоят получше; например, паттерн «контейнерный тип».
Давайте разбираться.
5 месяцев назад я публиковал материал про пет-проект календаря домаших тренировок. Сегодня хочу рассказать, что было сделано мной за прошедшее с тех пор время.
Самим приложением пользуюсь регулярно. На главной странице для незарегистрированных пользователей в качестве примера как раз показывается моя статистика. Помимо меня есть ещё 53 зарегистрированных пользователя с подтверждённым email.
https://github.com/dergunovs/fit - исходный код приложения
https://vkvideo.ru/playlist/15313879_11 - видео про разработку
Frontend: Typescript, Vite, Vue, Tanstack Query, Vitest, Vue I18n, Tauri
Backend: Typescript, Fastify, Mongoose, MongoDB, Swagger
Публикация приложения в RuStore
С помощью Tauri добавил генерацию формата APK. Зарегистрировался в RuStore в качестве разработчика, заполнил поля с описанием, сделал скриншоты. Модерация прошла очень быстро. Теперь приложение можно удобно скачивать и обновлять. Сам APK файл весит около 10 мегабайт. За 4 месяца с момента публикации в RuStore оттуда было 65 установок приложения.
Каждый фронтендер знает эту боль: пишешь запрос через fetch - и автоматически добавляешь try/catch. Где-то ловишь TypeError, где-то 500-й статус, где-то подвисший запрос с AbortController. В итоге половина кода в проекте - это обработка ошибок, а не бизнес-логика.
Я прожил с этим годами. Чем больше становился проект, тем больше росла копипаста: таймауты, ретраи, проверки на res.ok, костыли для разных браузеров. Одно и то же, снова и снова.
И вот в какой-то момент я понял: проблема не в том, что ошибки случаются. Проблема в том, что сам fetch вынуждает нас ловить их вручную, каждый раз, в каждом запросе.
Так появилась библиотека @asouei/safe-fetch. Маленькая (3kb), без зависимостей, но с тем, чего нет у самого fetch: общий таймаут, умные ретраи, нормализованные ошибки и поддержка Retry-After.
🌟 Библиотека добавлена в Awesome TypeScript — один из крупнейших мировых списков лучших TypeScript-проектов
«Сторонние куки больше не нужны», — заявили разработчики Google Chrome и в январе 2024 года начали принудительно отключать их у каждого сотого пользователя браузера. Однако уже в июле последовало осторожное: «Ну, с другой стороны...» — и отмена кук была отменена.
Многие даже не заметили, что произошло. Но на самом деле речь шла о том, как должен работать интернет в целом: отказ затронул бы почти каждый сайт из тех, что ты посещаешь,%USERNAME%.
На связи Артём из команды Яндекс Браузера. В этой статье расскажу о том, как технологии, изначально созданные для упрощения жизни, со временем стали инструментом манипуляций, и о контрасте разных подходов к борьбе с этим. Поговорим о масштабных системных решениях и простых прикладных методах, сравним их эффективность, сложности внедрения и неожиданные подводные камни. И заодно разберёмся, почему проблема трекинга — это не только про сторонние куки.
Сегодня мы разработаем с 0 собственный геймтон и запустим соревнования среди хабравчан и всех желающих just for fun. А также дадим возможность запустить свой геймтон локально по своим правилам Под катом вас ждет разработка геймтона на стеке nodejs + prisma + vuejs + fastify. А также пример разработки фулстек приложения с различными тонкостями построения API.
Привет, Хабр!
Общаясь с фронтендерами, я заметил, что многие не знают новые классные возможности HTML и CSS. Мне от этого грустно. Надо это исправлять!
Я подумал и составил список, состоящий из наиболее рекомендуемых мной новых фишек. Они поддерживаются в большинстве современных браузеров. Решают старые проблемы. Упрощают разработчикам жизнь. В общем суперполезные!
И да, это поверхностный обзор. Я не буду рассказывать все нюансы. Моя цель — проинформировать вас о новых возможностях. Дальше вы уже сами решите, что изучать детальнее.
Больше не буду тянуть. Давайте посмотрим, что я вам подготовил.
Дизайн-система — это набор правил, компонентов и инструментов, который помогает дизайнерам и разработчикам программного обеспечения работать наиболее эффективно и согласованно. Она включает в себя всё: от цветовых палитр и шрифтов до кнопок, форм и правил взаимодействия с ними. Когда в проекте есть своя дизайн-система, команды могут быстро создавать новые элементы и страницы, избегая неразберихи и повышая качество своего продукта, а пользователи в свою очередь получают интуитивно понятный интерфейс, с которым приятно иметь дело.
Я разработчик в компании bpm (ранее “ЛАНИТ - Би Пи Эм”). Столкнувшись с хаосом в интерфейсах и постоянными правками, я решила изучить, как можно организовать процесс создания дизайн-системы самостоятельно. Результат вы видите в этой статье. Очень надеюсь, что описанные правила помогут вам сделать первые шаги в создании дизайна для вашего проекта.
В этой статье мы рассмотрим интеграцию сервера реального времени Centrifugo с фреймворком Laravel, основные настройки и нюансы работы
Centrifugo – это сервер для работы в реальном времени, который поддерживает различные транспорты для подключения клиентов, включая WebSocket, HTTP-streaming, Server-Sent Events (SSE) и другие. Он использует publish-subscribe паттерн для обмена сообщениями
