Мобільний додаток випущено, користувачі зареєстровані — і тут виявляється, що немає способу заблокувати акаунт без прямого SQL-запиту, змінити банер без деплою або подивитися статистику без Excel. Наша команда розробляє адмін-панелі, які вирішують ці проблеми. Маючи 5+ років досвіду та понад 20 реалізованих проєктів, ми створюємо інтерфейси, що дозволяють керувати користувачами, контентом, push-сповіщеннями та аналітикою без жодного SQL-запиту. Тут розберемо ключові компоненти та технічні рішення, які ми застосовуємо.
Модулі адмін-панелі
Ось типові модулі, які ми включаємо:
| Компонент | Опис |
|---|---|
| Керування користувачами | Пошук, фільтрація, бан/розбан, ручна верифікація, історія дій |
| Керування контентом | CRUD для сутностей (товари, пости, події), модерація контенту користувачів |
| Push-сповіщення | Ручна відправка сегментам, шаблони, історія, статистика доставки |
| Аналітика | DAU/MAU, retention, воронки конверсії, crash rate, ANR rate |
| Feature flags | Увімкнення/вимкнення функцій без деплою, A/B-тест конфігурації |
| Конфігурація | Параметри додатку (ліміти, тексти, URL) без релізу |
Технічний стек та архітектура
Backend API для admin
Admin panel працює з тими ж бекенд-сервісами, що й мобілка, але через окремий набір ендпоінтів з ширшими правами. Важливо: не давати мобільному клієнту admin-права через той самий токен. Admin API — окрема аутентифікація (окремий OAuth2 client_id або окремий сервіс), окремий набір middleware з перевіркою ролей.
На Laravel використовуємо spatie/laravel-permission для ролей та дозволів. Ролі: super_admin, content_moderator, support. Кожна admin-дія логується в activity_log (пакет spatie/laravel-activitylog): хто, коли, що змінив, старе та нове значення. Без цього логу розібратися в інциденті неможливо.
На Node.js/NestJS — @nestjs/passport + casl для ABAC. Для аудит-логу — middleware, що пише в окрему таблицю або відправляє події в Kafka/RabbitMQ.
Який фронтенд обрати для адмін-панелі?
Три основні підходи, які ми порівнюємо:
| Підхід | Гнучкість | Швидкість розробки | Обмеження |
|---|---|---|---|
| Custom React (Tanstack Table, React Hook Form, Shadcn/ui) | Висока | Середня (2-3 тижні) | Вимагає досвідченої команди |
| React Admin | Середня | Висока (1 тиждень) | Складно кастомізувати під нестандартну логіку |
| Low-code (Retool/AppSmith) | Низька | Дуже висока (дні) | Vendor lock-in, обмежена кастомізація |
Для більшості мобільних продуктів ми рекомендуємо React + Tanstack Table + React Query + Shadcn/ui: custom-рішення в 2-3 рази гнучкіше за low-code, при цьому швидкість розробки порівнянна. Крім того, custom-рішення окупається в 2 рази швидше за low-code при більш ніж 10 сутностях.
Налаштування push-сповіщень з панелі
Інтеграція з Firebase Cloud Messaging через Admin SDK. Firebase Admin SDK дозволяє відправляти сповіщення батчами до 500 токенів. Панель дозволяє вибрати сегмент користувачів (за датою реєстрації, платформою, активністю, кастомними тегами), написати текст та заголовок, запланувати відправку або відправити негайно.
Нещодавно на проєкті з 500k DAU ми реалізували сегментну відправку: потрібно було відправити промо-акцію лише користувачам iOS, які не заходили більше 7 днів. Панель зібрала сегмент за 2 кліки, батчева відправка через sendMulticast обробила 200k токенів за 30 секунд. Результат: 15% конверсія в замовлення.
Кроки реалізації:
- Встановіть Firebase Admin SDK на бекенді.
- Реалізуйте ендпоінт для відправки (використовуйте
sendMulticastз батчами по 500 токенів для великих сегментів). - Обробіть результат:
successCountтаfailureCountзберігаються в історію. - Автоматично видаляйте протухлі токени (виняток
UNREGISTERED).
На бекенді: FirebaseAdmin.messaging().sendMulticast() для групової відправки. Результат відправки — BatchResponse — зберігаємо для історії.
Чому feature flags економлять час?
Найпростіша реалізація: таблиця feature_flags (key, enabled, rollout_percentage, updated_at). Мобілка запитує флаги при старті та кешує. Панель дозволяє вмикати/вимикати флаги та налаштовувати відсоток аудиторії. Це скорочує час на викат нової функції до хвилин замість деплою — наприклад, A/B-тестування нового онбордінгу: 50% користувачів отримують нову версію, ми збираємо метрики та через день приймаємо рішення. Без флагів довелося б викатувати окрему збірку.
Для складніших сценаріїв — Firebase Remote Config або LaunchDarkly. Remote Config безкоштовний та достатній для 90% завдань: панель у Firebase Console, SDK на мобілці з fetch() + activate(), minimumFetchInterval у секундах для контролю частоти запитів.
Як забезпечити безпеку адмін-панелі?
- Окремий домен або subdomain (тільки
admin.yourapp.com, неyourapp.com/admin) - MFA обов'язковий для всіх admin-акаунтів
- IP-whitelist якщо команда працює з фіксованих офісів
- Rate limiting на всі ендпоінти
- HTTPS only, HSTS
- Сесії з коротким TTL (8 годин), автологаут при бездіяльності
- Content Security Policy headers
Що входить у роботу та терміни
- Документація API: повний опис ендпоінтів, моделей та прав доступу
- Вихідний код: приватний репозиторій з CI/CD
- Інструкція з розгортання: покрокове керівництво для DevOps
- Навчання команди: вебінар або особиста консультація з адміністрування
- Підтримка: гарантійне обслуговування 3 місяці після здачі
Терміни: від 1 тижня до 3 місяців. Базова CRUD-панель з керуванням користувачами та push — 1–2 тижні. Повноцінна система з аналітикою, feature flags, складною рольовою моделлю та аудит-логом — 1–3 місяці.
Ми гарантуємо стабільну роботу та прозорість етапів. Зацікавились? Зв'яжіться з нами для консультації — оцінимо ваш проєкт та підберемо оптимальне рішення під ваші завдання.