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

Привет, Хабр! Меня зовут Александр Гончаров, и я — Head of Frontend в ГК Юзтех. В коммерческом IT я c 2011 года, регулярно выступаю как спикер на конференциях и митапах, а также с 2014 года веду подкасты, в том числе «Суровый веб». Мы в Юзтехе занимаемся заказной и продуктовой разработкой с 2006 года, в моём отделе около 80 человек, а в команде текущего проекта — 50 разработчиков.

Ещё любопытные факты с цифрами: у меня три высших образования (также сейчас учусь в аспирантуре), четыре кошки, более 300 записанных выпусков подкастов и больше 200 проведенных стримов.

Эта статья — адаптация моего доклада, который я рассказал на TechleadConf 2024. В ней я не буду углубляться в технические детали реализации микрофронтендов и архитектурных паттернов, а вместо этого разберу, как они могут помочь командам работать быстрее и без боли.

Хабр, привет! Я стабильно пишу здесь о CSS. Мне радостно, что моя работа вам полезна. Но хочется чего-то нового. Вызывающего споры. В общем я возвращаюсь к формату статей в виде вопрос-ответ. Вопросы будут те, которые я спрашиваю на интервью. Так что у вас будет повод сказать: «А зачем это надо?».

При составлении вопросов я хотел проверить понимание базовых моментов, которые есть в вёрстке любого проекта. Ещё будут вопросы на знание более редких аспектов и «новинок» в CSS. В общем я хочу вас завалить, чтобы казаться супер умным! (здесь ирония).

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

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

Иногда возникает необходимость разделить длительную дорогую (с точки зрения вычислений) задачу на несколько тиков (ticks) цикла событий (event loop). Существует множество способов это сделать. Рассмотрим их.

Легко "уничтожить" пользовательский опыт, позволив длительной дорогой задаче захватить основной поток (main thread). Неважно, насколько сложным является приложение, цикл событий может выполнять только одну задачу за раз. Пока выполняется одна задача, другие ждут своей очереди. Как правило, задача выполняется настолько быстро, что пользователь ничего не замечает. Но так бывает не всегда.

Сегодня релиз Laravel 12, основной фишкой которого заявлены минимальные критические изменения. Большинство проектов могут быть обновлены до новой версии без изменений кода. Разработка Laravel 12 будет вестись до 13 августа 2026 года, а патчи безопасности будут выходить до 24 февраля 2027 года — итого два года поддержки.

Как мы запустили простой редактор PDF под рынок США и набрали 30 000 активных пользователей. В статье разбираю, как искали идею, продвигали и как собираемся монетизировать наш микро-продукт.

Это в какой-то степени продолжение моей статьи — История создания идеального Docker для Laravel. В ней я рассказывал о том, как собрал идеальный Docker-образ для Laravel с Nginx Unit. Это был один из первых шагов по оптимизации моей инфраструктуры. Как я уже упоминал, у меня есть несколько pet-проектов, запущенных на VPS в docker-compose, и я хотел не только отслеживать их состояние, но и прокачать навыки в области Observability.

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

Это 240 вкладок браузера в плотной сетке 8x30. И в них запущен Pong! Видно, что мяч и ракетки перемещаются по canvas в окне и во всех вкладках.

Код (ужасный) можно посмотреть на GitHub. Но как он работает?

Более 10 лет прошло с момента публикации моего поста на Хабре, в котором я рассуждал о том можно ли стать программистом после 30-ти. За это время многое изменилось в моей жизни, стране и в мире. Ковид, протесты 2020-го в Беларуси (я родом оттуда), война… Та статья была выдержана в оптимистическом ключе. А сейчас я хочу взглянуть на проблему глазами уже состоявшегося программиста. И более приземлённо что-ли. Если не сказать больше — пессимиста. Ну, возраст всё-таки даёт о себе знать, вы понимаете.

Мой обеденный кофе прервался. Начали приходить уведомления от мониторинга, что сайт и API не отвечают, а CloudFlare отдаёт 521-ю ошибку на все запросы. Спустя пять минут ко мне в личку пришли пользователи с жалобами на неработающие приложения. А ещё спустя пять позвонил сооснователь проекта и сказал, что от нас требуют $250 за остановку DDOS'a.

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

JWT для сессий: удобство или головная боль?

JSON Web Token (JWT) приобрёл популярность как удобный способ аутентификации и передачи данных между клиентом и сервером. Его ценят за простоту, stateless-подход и гибкость. Однако большинство гайдов рассказывают только о плюсах, забывая о недостатках.

В этой статье мы разберём основные проблемы использования JWT для хранения пользовательских сессий и обсудим более надёжные альтернативы.

Представляю вашему вниманию перевод статьи SSL and SSL Certificates Explained For Beginners. Я долго разбирался с SSL, сертификатами, центрами сертификации - это единственная статья, после которой у меня что-то отложилось в голове :) Поэтому возникла идея перевести ее и донести до широких масс.

Выход ASP.NET Core 9 порадовал возможностью выборочно отключать http-метрики. В статье сценарии использования с примерами и детальный разбор того, как всё устроено под капотом.

Хотите освоить WebSocket и создать собственный чат с комнатами? В этой статье мы разберем:

• В чем разница между WebSocket и классическим HTTP

• Как реализовать сервер на FastAPI с поддержкой WebSocket

• Как создать простой FullStack-чат для мгновенного обмена сообщениями

• Как всего за пару минут развернуть готовое приложение на облачном сервисе

Статья написана с учетом новичков, но и опытные разработчики найдут здесь полезные инсайты.

Видеоаналитика в СИБУРе — это сложный и многогранный продукт, который внедряется на разных производствах. Несмотря на то, что это один продукт, его конфигурация может сильно отличаться: используются различные камеры, детекторы и параметры, а также интеграции с разнообразными сторонними системами.

В таких условиях инженеру не всегда понятно, что именно надо дописать, а валидация происходит только после окончания редактирования файла и перезапуска сервиса.

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

Меня зовут Владимир Кирилкин, я техлид в Цифровом СИБУРе, в команде Индустрии 4.0. Мы разрабатываем продукт «Видеоаналитика на производстве», и о наших задачах уже писали на Хабре.

Мы подошли к задаче нестандартно: вместо заранее заданных форм на фронте реализовали их автоматическую генерацию с использованием JSON-схем и немного ✨магии✨.

Наши сервисы построены на Python и React, но предложенный подход можно адаптировать и для других технологий — правда, с чуть меньшим количеством ✨магии✨.

Для целого ряда задач полезно использовать Serverless подход.

В этой статье мы кратко рассмотрим основные решения, их достоинства, и главное, недостатки. А также рассмотрим несколько интересных Open Source решений.

Эта статья была написана для конкурса Технотекст-7 «Тот момент, когда происходит изменение». Тема адаптации UI к меняющимся деталям была выбрана, так как связана с темой конкурса.

Современная UI-разработка живет быстрыми темпами. Мы постоянно создаем и меняем код, чтобы соответствовать новым трендам, но часто это делается «на коленке» и без долгосрочного видения. В итоге уже через пару месяцев все, что казалось суперсовременным, превращается в легаси из-за смены моды фреймворков и других деталей реализации.

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

История от задумки до запуска на Google Play приватного финансового менеджера inCourse для Android на React Native и TypeScript.

Создание адаптивных версий интерфейса это боль многих дизайнеров и, как следствие, разработчиков.  Разные экраны, хаос в макетах, непонимание между специалистами… Но есть способ сделать адаптацию проще, предсказуемее и удобнее для всех. В этой статье я предложу вам подход, который сократит количество макетов и сделает интерфейс аккуратным на любом устройстве. Готовы взглянуть на адаптацию под новым углом?

Разработка библиотеки для навигации групп мобильных роботов на транспортной платформе в заранее неизвестной среде

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

Для начала придумаем проект, который не займёт много времени(надеюсь) и над которым будет интересно посидеть пару вечеров.