
Веб-разработка *
Делаем веб лучше
Инициативы «Гаража». Внутренний портал для коммуникации своими руками
Привет, Хабр!
Вероятно, некоторые из вас помнят, что мы уже рассказывали про наш внутренний портал «Интра», который нацелен на развитие сотрудников. Сегодня речь пойдет о другом портале, созданном для укрепления внутренней коммуникации в компании. Он называется «ПРО» и представляет собой платформу, объединяющую различные аспекты жизни наших коллег вне проектов.
9 open source библиотек для вашего следующего проекта

Разработчики часто сталкиваются с выбором, какие инструменты использовать для своего следующего проекта. Даже если вы серьёзно настроены на разработку продукта, проблема остаётся той же.
В этой статье я расскажу о 9 библиотеках с открытым исходным кодом, которые улучшат ваш проект.
Разбираемся с цветами: пространства, иллюзии и квантование

Привет! Меня зовут Илья, я iOS-разработчик в компании Банки.ру.
Однажды я заметил, что цвет из Figma на симуляторе почему-то выглядел иначе. Вроде бы HEX-код один и тот же, но они явно отличались. Это заставило меня задуматься о том, что происходит с цветами при передаче изображения из одного приложения в другое. Чтобы разобраться, я решил погрузиться в вопрос и изучить природу цвета. Из этого исследования и появилась данная статья.
Надеюсь, она поможет вам понять основы работы с цветом, разобраться в причинах несоответствия и, возможно, даже взглянуть на цвета с новой точки зрения.
В статье разберем следующие темы:
• Что такое цвет и WOW-эффекты с ним
• Дискретизация и квантование
• Цветовые модели
• Цветовое пространство
• HEX-квиз и выводы
WeakMap и WeakSet в JavaScript

Привет, Хабр!
Когда дело доходит до коллекций данных в JavaScript, большинство разработчиков сразу вспоминают про массивы, объекты, Map или Set. Но есть и другие, менее известные структуры данных, которые можно назвать «инструментами для особых случаев» — это WeakMap и WeakSet.
WeakMap и WeakSet — это структуры, которые созданы для работы с объектами. Их основная фичи — слабые ссылки, благодаря которым можно избежать утечек памяти. Эти структуры подчищают за собой автоматически, когда объект, используемый в них, становится недостижимым.
Однако их область применения не ограничивается только управлением памятью.
Разбираем базу по базам

Всем привет! Сегодня у нас на повестке дня работа с SQL-запросами, базами данных, какие есть варианты и как вообще правильно с ними работать в рамках BitrixFramework.
Разберем основы конфигурации, как подключать несколько БД на один проект, делать безопасные запросы и не тревожиться на счет инъекций.
Не стоит пугаться AI-шной картинки, внутри материал писала белковая нейронка ;-)
JavaScript: Удобство или Угроза? Размышления о Приватности и Вебе

В кругу людей, которые заботятся о своей приватности и что-то смыслят в технологиях, JavaScript пользуется дурной славой. Как правило, его отключают через специальные браузерные расширения и негодуют на онлайн-ресурсы, которые вынуждают включать JavaScript для их использования.
Сложно переоценить пользу JS, который делает сайты интерактивными, удобными и современными. В то же время опасность, которая в нем таится, обычно ускользает от внимания. Эта статья — попытка заглянуть монстру в глаза.
Парольная защита статичной HTML-страницы на JS

Обычно парольная защита производится через веб-сервер, который проверяет пароль и выдаёт контент. Стандартный способ:
.htaccess и htpasswd. Но что, если нужно выложить зашифрованную веб-страницу и файлы на публичном хостинге, где у нас нет контроля над сервером? Эту проблему решают инструменты StatiCrypt и Portable Secret.Для шифрования HTML перед публикацией StatiCrypt использует AES-256 и WebCrypto, а расшифровка происходит с помощью ввода пароля в браузере на стороне клиента, как показано в демо (пароль test).
StatiCrypt генерирует статическую страницу, которую можно безопасно заливать на любой хостинг, в том числе бесплатный сторонний хостинг, такой как GitHub Pages.
PHP Typed: Маленький Composer пакет, который нарушает PHP правила ради вас

Звучит слишком громко? Давайте уточним, чтобы избежать обманутых ожиданий: этот пакет использует немного магии вне Хогвартса, и будет действительно полезен любителям строгой типизации в PHP.
Как Ultimatum помогает бороться со слежкой в сети

Добрый день! Меня зовут Тимур и я программист.
В предыдущих статьях я рассказывал о своем форке хромиума — Ultimatum, для тех пропустил — можно начать отсюда. И если в тех статьях подход был с закосом в техническую сторону то сегодня я хочу показать как может себя чувствовать обычный пользователь браузера без программистских скилов.
Odinbit, продолжение разработки своей игры. Новые механики, оптимизации, появление мультиплеера

Всем привет, это вторая статья по счету про мою 2D игру песочницу под названием Odinbit. Первая статья была выпущена уже давно, за это время я ввел несколько обновлений, столкнулся с новыми проблемами, поэтому я хотел бы пролить свет на новые обновления и рассказать про архитектурные решения, решение проблем и почему я сделал так, а не иначе.
Идемпотентность: искусство не менять мир дважды

Привет! Эту статью я пишу для тех, кто хочет разобраться в сложных понятиях простыми словами.
Идемпотентность стала моей «любимой» темой после одного из первых собеседований, где меня попросили объяснить её так, чтобы понял кот. Тогда это было для меня вызовом, но спустя время я поняла, что вдохновение приходит из простых вещей и самый простой способ объяснить их — через примеры, которые мы видим каждый день.
Надеюсь, после прочтения статьи это будет понятно не только вам, но и вашему коту, если вдруг он читает.
Как эффективно управлять видеопотоком с веб-камеры в браузере

Веб‑технологии, такие как Media Capture and Streams API (или просто MediaStream API), открывают большие возможности для работы с видеопотоком в браузере. Они позволяют легко захватывать видеопоток с веб‑камеры и использовать его для создания мощных и интерактивных веб‑приложений. Однако несмотря на широкую доступность этих API их эффективное использование остаётся непростой задачей.
Меня зовут Артем Шовкин, я RnD‑разработчик в СберТехе. В процессе изучения MediaStream API наша команда столкнулась с рядом интересных вопросов. Как эффективно управлять параметрами видеопотока в зависимости от возможностей устройства и сети? Какие подводные камни возникают при кроссбраузерной реализации? Как лучше всего обрабатывать ошибки при работе с видеопотоком?
Мы решили не просто разобраться в работе API, но и в деталях изучить спецификацию Media Capture and Streams, чтобы понять, как она используется в реальных приложениях. В статье мы также использовали код исходников реализации getUserMedia.
Материал пригодится разработчикам, которые встраивают в свои решения работу с камерой, особенно полезен фронтендерам, которые столкнулись с задачами по созданию функциональности работы с веб‑камерой и которым нужно добиться качества видео не хуже, чем в нативных приложениях.
Поехали!
Ближайшие события
Чек-лист по запуску нового сайта: что нужно учесть?

Запуск нового сайта — момент ответственный. Надо сделать 1000 и 1 дело. Чтобы вы не потерялись в дедлайнах и задачах, вот вам чек-лист. Подрядчикам он поможет структурировать все действия, а заказчикам — понять и проверить, все ли пожелания учла команда разработки.
Как разработчик вышел на $400 000/мес на AI-сервисе для написания эссе

Разбираю, как разработчик вывел свой простой сервис для написания эссе в топ Google, несмотря на кучу конкурентов. Монетизировал продукт по подписке $30/мес и вышел на доход более, чем $400 000 в месяц.
Чистая архитектура фронтенд приложений. Часть первая

Чистая архитектура — не только доброе слово, а очень полезное дело. Если изначально ответственно отнестись к данному вопросу, то можно предупредить очень много проблем и болячек на проекте. В данном цикле статей я буду делиться своими наблюдениями и, как мне кажется, наиболее верными решениями.
Интернационализация (i18n) бэкенда в Express с использованием Intlayer

Недавно мне понадобилось добавить поддержку нескольких языков в API на базе Express. Я решил поделиться кратким руководством для тех, кто хочет сделать свой бэкенд отвечающим переведенным контентом в зависимости от предпочтительного языка пользователя.
Переводим 50 приложений на Module Federation и ничего не ломаем

Привет, меня зовут Степан, я главный frontend-разработчик в Альфа-Банке. Проектом, о котором пойдёт речь, занимается наша команда. Только фронтенд-разработчиков в ней 60. Множество команд поддерживают более 50 приложений, приносящих прибыль бизнесу.
У нас ранее были микрофронты, но они были построены не на WMF. Не вдаваясь в документацию, давайте покажу, как всё было устроено, чтобы описать причины переезда. Думаю, будет интересно, учитывая, что проект большой.
Я расскажу о микрофронтендах и сопутствующей концепции Model Federation на примере большого проекта.
Vite 6.0: Новые возможности и будущее веб-разработки

26 ноября 2024 года вышла новая мажорная версия инструмента для сборки приложений Vite. Это событие особенно примечательно тем, что это первый релиз после анонса VoidZero, где Even You представил грядущее направление развития основных продуктов.
Далее мы рассмотрим ключевые моменты этого обновления.
Мигрируем с JetBrains PHPStorm на Cursor (VS Code)

Разберем, как настроить в Cursor (VS Code) привычные функции JetBrains PHPStorm. Множество описанных в статье функций носит общий характер и не привязано конкретно к PHP, так что будет актуально и для миграции из других продуктов Jetbrains.
Тем не менее, настроим полноценную поддержку php, xdebug, .env, yaml, symfony, git, перенесем хоткеи и тему оформления, поймем, как подключаться к БД и удаленному серверу. Будет небольшое личное сравнение IDE между собой. Функции Cursor затрагивать почти не будем.
