Проблемы во фронтовых проектах и их решения Подсобрал список типовых проблем и их решений, с которыми неизбежно сталкиваются разросшиеся фронтовые монорепы или семейства проектов, если заранее не позаботиться о решениях. ⚠️ Неудобная локальная разработка, зоопарк технологий/подходов, сложно вкатываться в существующие проекты Решения: 0️⃣ Переход на единую типовую сборку (Vite, Webpack…) с общим конфигом, общий инструментарий для монореп (workspaces, turbo, lerna…). 1️⃣ Создание единого шаблона для старта нового приложения. 2️⃣ Выработка единообразного стека: 🔡 система: node/bun, TS, фреймворк (React, Vue, Next…) 🔡 зависимости: 🔵пакетный менеджер (yarn/npm/pnpm, для консистентности лок-файлов) 🔵стейт-менеджер (или его отсутствие => Tanstack Query) 🔵роутер 🔵инструменты для работы с формами (хуки, валидация, маски для инпутов…) и валидатор схем 🔵стилизация (CSS Modules, SASS, Styled-подобные, ваниль), использование единообразного UI-kit (Storybook) 🔵утилиты (работа с датами, общие либы типа lodash) 3️⃣ Процесс регулярных обновлений зависимостей. 4️⃣ Единообразная структура проекта/проектов, приведение к единому виду (FSD…). 5️⃣ Архитектурные соглашения по выносу шаренных кусочков в микрофронты, связь между «отдельными кусочками» приложений в рамках общих приложений. 6️⃣ Общий/стандартизированный CI/CD. 7️⃣ Общий подход к проксированию запросов на бэк, к развёртыванию проекта локально. 8️⃣ Общий код-стайл и линтинг (ESLint, Prettier, Biome…). 9️⃣ Общий подход к логированию аналитики. ⚠️ Долгая разработка, необходимость частых ресерчей Решения: 0️⃣ Централизованное внедрение AI-инструментов для помощи в написании кода (выбор единых агентов, генерация вспомогательных артефактов типа claude.md) 1️⃣ Создание бойлерплейта для документации и внедрение AI-генерации документации. Хранение документации в самих проектах и регулярная перегенерация. ⚠️ Дублирования кода, велосипеды Решение: Вынос повторяющихся пакетов в шареное хранилище переиспользуемых решений, хостинг в приватном npm-реестре, поддержка. ⚠️ Большое количество багов, уязвимостей и неконтролируемый/плохой перф и UX Решения: 0️⃣ Внедрение мониторинга ошибок (Sentry), настройка алертов в чаты/дашбордов на ошибки (Grafana). 1️⃣ Подключение измерения метрик перфа в рантайме у пользователей (Vitals, TTVC и подобные), а также на CI/CD («бюджет» на перф в пулреквестах). 2️⃣ Интеграция в CI/CD инструментов для поиска уязвимостей в коде. 3️⃣ Процесс регулярного пополнения и разгребания бэклога техдолга (баги, уязвимости, оптимизации). 4️⃣ Внедрение среды для тестов/автотестов, написание/генерация юнит-тестов и e2e-тестов, регрессионное тестирование, запуск на CI/CD. 5️⃣ Выработка плавил работы со статикой (картинки на CDN, автоматизированное сжатие, ленивая загрузка). ⚠️ Несогласованная командная работа Решения: 0️⃣ Использование контрактов (Open API) на бэке/фронте, кодогенерации типов и API-клиентов, клиент-серверных фреймворков (trpc). 1️⃣ Внедрение автоматизации в код-ревью (автоназначение ревьюеров, выработка правил мерджа в master, AI-генерация описаний пулреквестов и ревью). 2️⃣ Договорённости в единообразном именовании коммитов (conventional commits), веток, пулреквестов; единые подходы к организации дев/стейдж/релиз-веток; семантическое версионирование релизов. #Лаборатория_веб_платформы @web_platform | Поддержать платформу 💕