Статья посвящена архитектурной эволюции и технологическим решениям фронтенд-приложения системы анализа и классификации документов «Атом.ОКО». Описаны основные этапы перехода от модульной структуры к Feature-Sliced Design (FSD), применение React 18, MobX и TypeScript для построения масштабируемой бизнес-логики. Рассмотрены решения по визуализации интерактивных графов с использованием React Flow, управление позиционной разметкой документов через Paper.js, а также оптимизация интерфейса и сборки при переходе с Webpack на Vite. Особое внимание уделено lazy loading компонентов, организации CI/CD, контейнеризации с Docker, обеспечению качества кода и тестированию с помощью Jest, React Testing Library и BackstopJS. Подчёркивается важность системного подхода к архитектуре, обеспечивающего масштабируемость, предсказуемость и удобство сопровождения фронтенд-приложения.
фронтенд, React, MobX, TypeScript, Feature-Sliced Design, React Flow, Paper.js, Ant Design, Vite, lazy loading, CI/CD, Docker, тестирование, Jest, React Testing Library, BackstopJS, визуальная бизнес-логика, OCR
1. Мартин Р. Чистая архитектура: искусство разработки программного обеспечения высокого качества. — М.: Вильямс, 2013.
2. Фаулер М. Шаблоны корпоративных приложений / Пер. с англ. — М.: Диалектика, 2004.
3. Никульчев Е., Ильин Д., Гусев А. Модель выбора технологического стека для проектирования программного обеспечения цифровых платформ // Математика. — 2021. — Т. 9, №4. — С. 308.
4. Стефанов, С. React. Быстрый старт / С. Стефанов. – 2-3 изд., стер. – Санкт-Петербург: Питер, 2023. – 304 с.
5. Podila, P. MobX Quick Start Guide / P.Podila, M. Weststrate. – 1st ed. – Packt Publishing, 2018. – 236 с.
6. Ant Design 5.0: сайт URL: https://ant.design/ (дата обращения: 28.07.2025).
7. Vite. The Build Tool for the Web: сайт URL: https://vite.dev/ (дата обращения 28.07.2025)
8. JestJs: сайт URL: https://jestjs.io/ (дата обращения 28.07.2025)
9. React Testing Library: сайт URL: https://testing-library.com/docs/react-testing-library/intro/ (дата обращения 28.07.2025)
10. Эммануил Г. Docker Compose для разработчика // ДМК-Пресс. — 2023. — С. 154–158
11. Feature-Sliced Design: сайт URL: https://feature-sliced.design/ (дата обращения 28.07.2025)
