До этого проекта я умел собрать React-компонент. Умел написать Express-роут. Умел сделать запрос к MongoDB. По отдельности. Это было похоже на знание трёх языков, на которых ты ни разу не вёл настоящего разговора. И я решил собрать ecommerce-магазин на React, Node и MongoDB — полноценное full stack приложение, от начала до конца, без туториала под боком и без того, чтобы кто-то водил меня за руку.

Это решение тихо перепрошило то, как я думаю о софте. Спустя годы именно из-за него я стал более сильным DevOps-инженером. Расскажу как было на самом деле.

Стек, и почему MERN тут в тему

Я взял MERN, потому что у каждого куска была понятная работа:

  • React — витрина: сетка товаров, корзина, экраны checkout.
  • Redux — управление состоянием, потому что корзина, сессия залогиненного пользователя и набор фильтров должны в один момент времени быть согласованы между собой.
  • Node.js с Express — REST API, каждый роут, который дёргает фронт.
  • MongoDB — каталог товаров и история заказов.

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

День первый: ничто не разговаривало ни с чем

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

Я потратил больше времени на дебаг зазоров между слоями, чем на написание самих слоёв. И именно в этом оказался весь смысл.

Когда собираешь одну штуку в изоляции, стыки спрятаны. Ты мокаешь API. Захардкоживаешь пользователя. Веришь, что база отдаст ровно то, что ты попросил. А собери всё сам — и прятаться негде: баг никогда не сидит внутри одного слоя, он в рукопожатии между двумя.

Фичи, которые заставили меня вырасти

Это было не демо с тремя ненастоящими товарами. Я собрал всё по-настоящему:

  • Каталог товаров с поиском и фильтрацией.
  • Корзина с управлением количеством — добавить, убрать, поменять число, держать всё в синхроне.
  • Полный checkout-флоу, а не фейковая кнопка «купить».
  • JWT-авторизация — регистрация, вход, защищённые роуты.
  • Админ-панель для создания и управления товарами.

Каждая из этих фич задевала все слои. Возьмём «Добавить в корзину». Звучит тривиально. Но проследи путь: клик прокатывается по Redux-состоянию, дёргает запрос к API, попадает в базу и возвращается изменённым — а UI должен отразить новую правду без полной перезагрузки. Одна кнопка, четыре слоя и десяток мелких способов всё сломать.

Авторизация стала главным уроком. Раньше я думал про auth как про фичу — страничку логина, которую прикручиваешь сбоку. Это не так. Это флоу, который пронизывает всё. Каждый защищённый роут, каждое действие в админке, каждая корзина, привязанная к живому пользователю. Чуть-чуть не так обошёлся с токеном в одном месте — и вся система где-то в другом месте теряет доверие.

От понимания кусков — к пониманию систем

Сдвиг умещается в одну фразу: до этого проекта я понимал куски, а после — понял системы.

Раньше у меня был React вот здесь, API вон там, база где-то на фоне. Собрав магазин от начала до конца, я увидел целый организм — как действие пользователя проходит через фронт, уходит в бэк, спускается в базу и возвращается обратно, меняясь на каждой остановке. Я понял, зачем существует каждый слой и, что важнее, где каждый ломается.

Такого знания туториал не даёт. Туториалы показывают счастливый путь. Они не показывают токен, который протухает посреди checkout, или запрос-фильтр, отдающий не те 40 товаров. Точкам интеграции учишься, только пожив внутри них.

Почему это сделало меня сильнее в DevOps

Спустя годы я ушёл в инфраструктуру и DevOps — и full stack мозг переехал вместе со мной. Потому что инфраструктура — это просто ещё один слой. Балансировщик, база, service mesh, deploy pipeline — та же история, что и с магазином, только уровнем ниже. Запросы текут насквозь, состояние должно оставаться согласованным, а сбои почти всегда живут в швах между компонентами, а не внутри отдельной коробки.

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

Собери одну вещь целиком

Мой честный совет: каждому инженеру стоит хотя бы раз собрать одну целостную вещь. Не чтобы зашипить. Не чтобы положить в портфолио. А чтобы перепрошить себе мышление.

Возьми что-то с настоящими слоями — магазин, сервис бронирования, что угодно — и собери всё сам: фронт, API, базу, авторизацию. Большую часть времени ты проведёшь в грязных зазорах между слоями, и именно там прячется рост. Full stack меняет то, как ты видишь софт. Это стоит сделать хотя бы раз.

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