Веб-приложения
ChurchApps включает три веб-приложения, каждое из которых служит разной аудитории и цели. Они разделяют общую техническую основу -- React 19, TypeScript и Material-UI 7, но различаются инструментами сборки и целями развёртывания.
Обзор приложений
| Приложение | Назначение | Фреймворк | Порт разработки |
|---|---|---|---|
| B1Admin | Панель администрирования церкви | React 19 + Vite + MUI 7 | 5173 |
| B1App | Публичное приложение для членов церкви | Next.js 16 + React 19 + MUI 7 | 3301 |
| LessonsApp | Управление учебным контентом | Next.js 16 + React 19 | 3501 |
Общий технологический стек
Все три веб-приложения построены с использованием:
- TypeScript -- Сквозная типобезопасность
- React 19 -- Библиотека UI-компонентов
- Material-UI 7 -- Дизайн-система и набор компонентов
- React Query 5 -- Управление серверным состоянием
Общие компоненты
Приложения разделяют UI-компоненты и утилиты через семейство пакетов @churchapps/apphelper*:
| Пакет | Назначение |
|---|---|
@churchapps/apphelper | Основные общие React-компоненты |
@churchapps/apphelper-login | UI-компоненты аутентификации |
@churchapps/apphelper-donations | Формы пожертвований |
@churchapps/apphelper-forms | Компоненты конструктора форм |
@churchapps/apphelper-markdown | Рендеринг markdown |
@churchapps/apphelper-website | Компоненты сайта/CMS |
Подробности о локальной разработке этих общих пакетов см. в документации AppHelper.
Скрипт postinstall
Каждое веб-приложение имеет скрипт postinstall, который копирует файлы локализации и CSS-ресурсы из @churchapps/apphelper в проект. Он запускается автоматически после npm install.
Если компоненты выглядят без стилей после установки зависимостей, возможно, скрипт postinstall не выполнился корректно. Вы можете запустить его вручную командой npm run postinstall.
Инструменты сборки
Приложения используют два разных инструмента сборки:
- B1Admin использует Vite -- быстрый, современный сборщик, идеальный для одностраничных приложений
- B1App и LessonsApp используют Next.js -- обеспечивая серверный рендеринг, маршрутизацию на основе файлов и оптимизированные продакшен-сборки