Обновить
366.37

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

Делаем веб лучше

Сначала показывать
Порог рейтинга
Уровень сложности

React Reconciliation: скрытый механизм, управляющий компонентами

Уровень сложностиПростой
Время на прочтение11 мин
Количество просмотров4.9K



❯ Механизм согласования


В моих предыдущих статьях (1, 2) я подробно рассматривал, как работает React.memo, а также делился более эффективными подходами к оптимизации производительности с помощью компоновки. Однако для глубокого понимания работы React необходимо разобраться в основном механизме, лежащем в основе всех этих оптимизаций – алгоритме согласования (reconciliation).


Согласование – это процесс, в результате которого React приводит DOM в соответствие с деревом компонентов. Именно этот механизм позволяет реализовать декларативный подход к программированию на React: вы формулируете свои намерения, а React самостоятельно определяет, как выполнить эти намерения наилучшим образом и с наименьшими затратами.

Читать дальше →

Kubernetes и микросервисы для интернет-магазина

Уровень сложностиСредний
Время на прочтение7 мин
Количество просмотров4.6K

История Kubernetes

 7 июня 2014 года был выпущен первый выпуск Kubernetes

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

Kubernetes на греческом языке означает «кормчий» или «рулевой» (лицо, держащее рулевое колесо корабля).

Kubernetes использует контейнерные технологии Linux, для того чтобы обеспечить изоляцию выполняющихся приложений. Данные технологии позволяют запускать несколько сервисов на одной хост-машине, не только обеспечивая доступ к разным средам, но и изолируя их друг от друга, подобно виртуальным машинам, но с гораздо меньшими затратами.

Процедура развертывания приложений через Kubernetes всегда одинаковая, независимо от того, содержит ли кластер всего несколько узлов или тысячи. Размер кластера не имеет никакого значения. Дополнительные узлы кластера просто представляют собой дополнительный объем ресурсов, доступных для развернутых приложений.

 Основные понятия в Kubernetes

 Кластер – это несколько серверов, где нужно развернуть наше приложение.

Под (pod) – минимальный элемент развертывания в Kubernetes, который состоит из одного или нескольких контейнеров, работающих на одном компьютере. Контейнеры внутри пода работают по одному IP-адресу
и могут обмениваться информацией через доступную в контейнере директорию (том, volumes).

Сервисы (Service) – соединяет поды, которые объединяются в группы
с постоянным IP-адресом и балансирует нагрузку между ними.

Читать далее

Личный ИИ-ассистент на ваших данных. Часть 2: Веб-интерфейс, авторизация и стриминг ответов от ИИ

Время на прочтение27 мин
Количество просмотров7.5K

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

В этой части статьи мы шаг за шагом превращаем консольную заготовку из первой части в полноценный веб-сервис:
— реализуем авторизацию
— создаём веб-чат с выбором нейросети
— интегрируем всё через FastAPI
— готовим к деплою

Если вы хотите, чтобы ваш ИИ-ассистент выглядел и работал как настоящий сервис — поехали!

Читать далее

Двойной Backend, премьера секции для техлидов и выступление легендарного Михаила Гельфанда: что еще будет на DUMP 2025

Время на прочтение3 мин
Количество просмотров741

Уже на этой неделе, 25 апреля в пятницу, в Екатеринбурге пройдет DUMP — одна из самых масштабных ИТ-конференций на Урале. В этом году у нас 11 тематических секций, включая новенькую TechLead, отдельный трек для круглых столов и воркшоп от Андрея Цветциха. Рассказываем детальнее о программе

Backend — пройдет в двух параллельных треках. Будет больше докладов, Андрей Цветцих проведет воркшоп «Паттерны асинхронного взаимодействия в распределённых системах», Юля Волкова поможет справиться со страхом триггеров, а Максим Стаценко покажет, как сделать максимально дешёвый Statefull процессинг с 1кк RPSа. Также обсудим за круглым столом, кто должен исправлять срочные баги, если работа над проектом уже закончилась...

Смотреть другие секции

Как создать приложение-агрегатор для ресторанов в 2025 году

Время на прочтение10 мин
Количество просмотров810

В этой статье мы рассмотрим:

- Как работают агрегаторы ресторанов?
- Какие перспективы у этой бизнес-модели на рынке foodtech?
- Какой функционал необходимо добавить в приложение для ресторанов?
- Как убедить заведения в преимуществах интеграции с агрегаторами?
- В чем особенности разработки и масштабирования приложений-агрегаторов?

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

Читать далее

Как использовать любой CSS-фреймворк в вашем проекте — Часть 4

Уровень сложностиПростой
Время на прочтение4 мин
Количество просмотров2.2K

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

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

Читать далее

Как программисты делали куличи

Уровень сложностиПростой
Время на прочтение13 мин
Количество просмотров3.5K

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

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

Чтобы процесс пошёл быстрее, всю работу, конечно же, разбили на задачи и определили, кто и чем будет заниматься. Вован, Лёньчик и Гриша будут заниматься замесом теста. Александр и Олександр — изготовлением верхних украшений. Решили, что сверху куличи украсят белково-заварной помадкой по классике, но поверх добавят цветки из мастики и желатинового единорога, покрытого белым шоколадом. Маргарита, Вика и Октавия будут заниматься финальной сборкой, ну а курировать процесс будет Семён.

Читать далее

Бумер, джуниор и нейросеть

Время на прочтение3 мин
Количество просмотров4.3K

Настало время... интересных историй. Про то, как я заказал сайт и что из этого вышло. Спойлер — человек не справился, а нейросетка — да

Читать далее

Поведенческие факторы в поисковой системе Яндекс: влияние, стратегия и возможности оптимизации

Уровень сложностиСредний
Время на прочтение4 мин
Количество просмотров1.5K

SEO — это не просто механическое следование алгоритмам поисковых систем, а настоящая игра на грани аналитики, психологии пользователей и технического мастерства. Одним из ключевых факторов успешного продвижения в Яндексе являются поведенческие факторы (ПФ), определяющие, насколько сайт удовлетворяет запросам пользователей.

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

Читать далее

Рулим CDN с клиента

Время на прочтение19 мин
Количество просмотров2.7K

Привет! На связи Ольга Попова, и вместе с Алексеем Гусевым @MAD_GooZe мы работаем в Yandex Infrastructure — это команда, которая создаёт и предоставляет внутреннюю инфраструктуру Яндекса — фундамент из продуктов и технологий, которые помогают разрабатывать, деплоить и эксплуатировать все основные сервисы компании. Наша команда носит название «Видеоплатформа» и занимается созданием инфраструктуры для показа видеоконтента на таких платформах, как Кинопоиск, Яндекс Музыка, Станция, Маркет и других.

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

Читать далее

Знакомство с Web Locks API

Уровень сложностиСредний
Время на прочтение9 мин
Количество просмотров3.1K

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

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

Долгое время разработчики обходились кустарными решениями — флагами в localStorage, хитрыми setInterval и т.д. Но с появлением Web Locks API у нас наконец появился стандартный способ расставить приоритеты в этом хаосе.

Web Lock API — это механизм, позволяющий скриптам, находящимся в рамках одного orign, блокировать доступ к ресурсу, удерживать блокировку пока выполняется необходимый код, а затем разблокировать ресурс, чтобы другие части программы могли получить к нему доступ.

Читать далее

Люблю я http, и вот как я его готовлю

Уровень сложностиСредний
Время на прочтение19 мин
Количество просмотров5.6K

Я старый фуллстек-разработчик и не знаю слов любви, но около полугода назад при очередной итерации сервера почувствовал себя утомленным путником, который узрел нежную красоту wr-обработчика нативного net/http! Вот раньше всё было ужасно - а теперь красиво, приятно читать и интересно показать! За несколько месяцев я переделал свои сотни обработчиков на новый стиль - и всё еще доволен! Почистил авгиевы конюшни слоев логики - теперь там царит запах фиалок! Также у меня была возможность посмотреть как пилят http профессионалы бэкенда - далеко не как фуллстеки, о чем тоже хочется рассказать!
Для ленивых читать - пора вернуть логику в обработчики! Но я расскажу подробно о той красоте, которая скрывается за этими многими восклицательными знаками, и о том, как её можно испортить. Структура такова:
- сначала чем фуллстек отличается от нативного бэкенда,
- потом пройдемся по API-стилю а-ля РЕСТ,
- прочтем оду нативному http-модулю, расковыряем пару болячек фреймворков,
- почитаем мои слова, почему wr-обработчик хорош сразу из коробки,
- и посмотрим пример того, как превратить обработчик в простой вид "задача-дано-решение-ответ".

Внимание, это мнение. В статье поднимаю холиварные темы, при этом я могу быть не прав, но буду настаивать! И фотка из личного фотоархива на тему "Люблю лето!", потому что уже надоели сгенерированные картинки.

Читать далее

LitestarCatsCV. Тренируемся на кошках. Расширяем возможности и готовимся к продакшену. Часть 3

Уровень сложностиПростой
Время на прочтение17 мин
Количество просмотров1.1K

Привет, котики и котолюбы! В первой части нашего кошачьего приключения мы выбрали инструменты (Litestar вместо FastAPI, Granian вместо Gunicorn, KeyDB вместо Redis), настроили uv и заложили фундамент проекта. Во второй части мы построили полноценное CRUD API для резюме котиков (или людей, если вам так ближе), подружили его с PostgreSQL через SQLAlchemy, настроили миграции с Alembic и написали тесты с Pytest. У нас уже есть стены и фундамент, но пора ставить крышу и готовиться к продакшену! 🏠

Сегодня мы сделаем наш API ещё круче: вынесем конфиги в отдельный модуль с помощью msgspec, добавим аутентификацию через встроенный JWT в Litestar, ускорим API с KeyDB, проверим покрытие тестами с coverage, упакуем всё в Docker и нарисуем резюме котиков с помощью Jinja. К концу статьи наш кошачий проект будет готов к реальной жизни — поехали! 🚀

Читать далее

Ближайшие события

Разрабатываем PWA. Полная инструкция по работе с Web App Manifest и Service Worker

Уровень сложностиСредний
Время на прочтение8 мин
Количество просмотров9.2K

Привет! Меня зовут Сергей Васильев, я фронтенд-разработчик в AGIMA. Наша команда часто работает с PWA — прогрессивными веб-приложениями. Они стали особо популярны в последние три года, когда из-за санкций некоторым корпорациям пришлось отказаться от мобильных приложений. Но и раньше многие компании с интересом смотрели на это решение.

Ниже расскажу, как сделать из обычного веб-приложения прогрессивное: вместе настроим Web App Manifest и Service Worker. Если вам еще не доводилось работать с PWA — текст точно для вас.

Читать далее

Пробуем Codex CLI от OpenAI для доработки ХрюХрюКара

Уровень сложностиПростой
Время на прочтение4 мин
Количество просмотров2.7K

Пару дней назад я опубликовал статью про ХрюХрюКар - телегам-бот для борьбы со стоянкой автомобилей на зелёных зонах. Проект с открытым исходным кодом.

За два дня ко мне обратилось несколько сторонников с просьбой добавить их города. Но вот незадача: у меня была возможность через админ-панель Django править данные в базе, но об этом кеш сервера не узнает (основной бекэнд на Go). В результате приходилось добавлять данные и перезагружать контейнеры с go-бекэндом вручную.

Основные серверы ХХК уже имели сторы, которые получают и обрабатывают апдейты, прилетающие через redis.

По сути, оставалось внести правки в часть django-бэкенда, чтобы обрабатывать сигналы pre_save и pre_delete, сериализовать данные и отправлять их в нужный канал редиса.

Решил поручить эту задачу Codex CLI, которую вчера OpenAI представили нам с вами. 

Читать далее

Книга: «Создание фронтенд-фреймворка с нуля»

Время на прочтение3 мин
Количество просмотров4.8K
Привет, Хаброжители!

Мы используем фронтенд-фреймворки каждый день. А понимаем ли мы, что происходит там, под капотом? Книга Анхеля Солы Орбайсеты «Создание фронтенд-фреймворка с нуля» предлагает уникальный подход к изучению этой темы — через практическое создание собственного фреймворка. Автор убежден, что лучший способ понять принципы работы фреймворков — самостоятельно реализовать их ключевые механизмы.
Читать дальше →

Вкалывают роботы, а не человек: как мы разработали ТГ-бота, который в 4 раза ускорил проведение маркетинговых акций

Уровень сложностиСредний
Время на прочтение24 мин
Количество просмотров2.1K

Привет, хабровчане! Я Алиса — тимлид в e-commerce агентстве KISLOROD. Хочу рассказать об интересном кейсе по разработке ТГ-бота, который мы интегрировали с сайтом на 1С-Битрикс.

Бот забрал на себя до 70% механической работы и рутинных операций менеджеров со стороны клиента, а покупателям упростил регистрацию в акциях в несколько раз.

Читать далее

Динозаврик по имени Джун

Уровень сложностиПростой
Время на прочтение4 мин
Количество просмотров1.7K

Еще совсем недавно джуны очень ценились. Можно было вырастить преданного сотрудника, гораздо медленнее поднимать ему зарплату, и в итоге получался отличный боец, который знает все правила взаимодействия в компании и плавно перерастает в мидла. Вакансий на рынке было много. Если говорить о веб-разработке, то залететь верстальщиком было вообще плевое дело — пару недель почитать книжки по HTML/CSS, попрактиковаться с табличной версткой (да, бывалые динозавры еще помнят, когда такой подход был мейнстримом), потом перейти к блочной — и можно отправляться на собеседования. Неделя — и вы уже в руках какой-нибудь веб-студии, а там, при желании, через полгода станете полноценным фронтендером или переквалифицируетесь в бэкенд-разработчика. Хорошие времена: можно не особо напрягаясь было заработать на хлеб, клацая по клавиатуре.

Читать далее

Вайб-кодинг для продактов. Как быстро тестировать гипотезы

Уровень сложностиСредний
Время на прочтение5 мин
Количество просмотров2.8K

Меня, как продакта, очень захватила идея: создавать прототипы для кастдева, проверки гипотез и вообще любой новой фичи без статьи в Confluence, груминга с командой и вороха тикетов в Jira. Сейчас на сборку прототипа у меня уходит день - и я хочу рассказать, как это устроено, готов от вас нахватать в панамку, сделать выводы и вайбить дальше, лучше и глубже!

Читать далее

Игра по своим правилам: хак лидерборда в Telegram MiniApp

Уровень сложностиПростой
Время на прочтение2 мин
Количество просмотров982

Игра по своим правилам. Рассказываю, как с помощью DevTools и нестандартных методов можно выйти на первое место в Telegram MiniApp.

Читать далее

Вклад авторов