📊 UptimeRobot Status Dashboard

Современный веб-интерфейс для мониторинга серверов с использованием API UptimeRobot.

✨ Возможности

• 📱 Адаптивный дизайн - отлично работает на всех устройствах
• 🌓 Темная/светлая тема - автоматическое переключение и ручной выбор
• 🌍 Мультиязычность - поддержка русского и английского языков
• 🏳️ Флаги стран - автоматическое определение и отображение флагов по префиксам серверов
• 📈 Timeline графики - визуализация работы серверов за указанный период
• ⚡ Реальное время - данные обновляются с помощью API UptimeRobot
• 🔧 Fallback система - автоматическое переключение между CORS прокси при сбоях
• 🗂️ Умное кеширование - каждый API ключ имеет свой отдельный кеш
• 🔄 Автоматические обновления - Service Worker для бесшовных обновлений
• 📱 Мобильная оптимизация - уведомления об обновлениях без принудительного обновления

🚀 Технологии

• Frontend: React 18, Bootstrap 5.3.3
• Styling: SCSS с CSS переменными для тем
• Иконки: Bootstrap Icons (SVG)
• Шрифты: Google Fonts (Rubik)
• API: UptimeRobot API v2
• Caching: Service Worker + LocalStorage
• Deployment: Docker + Nginx

🏗️ Развертывание

Docker (рекомендуемый способ)

# Клонирование репозитория
git clone <ваш-репозиторий>
cd uptime-status

# Настройка API ключей
nano public/config.js

# Быстрый деплой (рекомендуется)
chmod +x rebuild-prod.sh
./rebuild-prod.sh

# Или через основной скрипт
chmod +x docker-run.sh
./docker-run.sh build
./docker-run.sh start

Приложение будет доступно на http://localhost:34481

Деплой на сервере

Для обновления на сервере используйте:

# Быстрый деплой с автоматическим обновлением версии
./rebuild-prod.sh

# Или пошагово
./docker-run.sh rebuild

⚙️ Конфигурация

Отредактируйте public/config.js:

window.Config = {
    // Название сайта
    SiteName: 'Nerjel',

    // API ключи UptimeRobot (Monitor-Specific или Read-Only)
    ApiKeys: [
        'm800673107-ваш-api-ключ-1',
        'm800673135-ваш-api-ключ-2',
        // ...
    ],

    // Количество дней для отображения в timeline
    CountDays: 45,

    // Показывать ли ссылки на мониторы
    ShowLink: false,

    // Меню навигации
    Navi: [
        {
            text: 'support',
            url: 'https://t.me/nerjel_help',
        },
    ],
}

🔐 Безопасность API ключей

⚠️ ВАЖНО: Используйте только Read-Only API ключи для публичных дашбордов!

• ✅ Read-Only: ur1234567-abcdefghijklmnopqrstuvwxyz1234567890abcd
• ❌ Monitor-Specific: m800123456-abcdefghijklmnopqrstuvwxyz123456

API ключи в React приложениях видны в браузере, поэтому никогда не используйте ключи с правами записи.

🌐 Флаги стран

Система автоматически определяет страну по префиксу в названии сервера:

• DE-Server → 🇩🇪 Германия
• SE-Server → 🇸🇪 Швеция
• FR-Server → 🇫🇷 Франция
• RU-Server → 🇷🇺 Россия

🎨 Темы

• Светлая тема: розовые акценты на светлом фоне
• Темная тема: розовые акценты на темном фоне
• Системная: автоматически следует настройкам ОС

🌍 Языки

• Русский (по умолчанию)
• English

Переключение без перезагрузки страницы через выпадающее меню.

📱 Управление Docker

Основные команды

./docker-run.sh start     # Запуск контейнера
./docker-run.sh stop      # Остановка контейнера
./docker-run.sh restart   # Перезапуск контейнера
./docker-run.sh rebuild   # Пересборка и запуск (с обновлением версии)
./docker-run.sh logs      # Просмотр логов
./docker-run.sh status    # Статус контейнера
./docker-run.sh clean     # Очистка образов

Быстрый деплой

# Для продакшена (обновление версии + полная пересборка)
./rebuild-prod.sh

# Для разработки (обновление версии + сборка)
./docker-run.sh build

🔄 Ребилд приложения

Что происходит при ребилде:

1. Остановка контейнера - docker-compose down
2. Обновление версии - node scripts/update-version.js
   • Обновляется timestamp в public/config.js
   • Обновляется CACHE_NAME в public/sw.js
3. Очистка старых образов - удаление кеша Docker
4. Сборка нового образа - docker build с флагом --no-cache
5. Запуск контейнера - docker-compose up -d

Когда нужен ребилд:

• ✅ Изменение API ключей в public/config.js
• ✅ Обновление кода (новые функции, исправления)
• ✅ Изменение конфигурации (SiteName, CountDays, etc.)
• ✅ Деплой на сервер (обязательно с обновлением версии)

Типы ребилда:

# Быстрый ребилд для продакшена
./rebuild-prod.sh

# Ребилд через основной скрипт
./docker-run.sh rebuild

# Ручной ребилд (пошагово)
docker-compose down
node scripts/update-version.js
docker build -t uptime-status . --no-cache
docker-compose up -d

Особенности ребилда:

• Автоматическое обновление версии - предотвращает проблемы с кешированием
• Полная очистка кеша - гарантирует свежую сборку
• Безопасная остановка - корректное завершение процессов
• Проверка статуса - отображение результата после запуска

🔧 Разработка

# Установка зависимостей
npm install

# Запуск в режиме разработки
npm start

# Сборка для продакшена
npm run build

# Обновление версии вручную
npm run version:update

🗂️ Кеширование

Система использует многоуровневое кеширование:

1. Service Worker - кеширует статичные файлы
2. LocalStorage - кеширует API ответы (отдельно для каждого ключа)
3. HTTP заголовки - предотвращают кеширование конфигурации

Автоматическое обновление версий

При каждой сборке автоматически обновляется версия в:

• public/config.js (добавляется timestamp)
• public/sw.js (обновляется CACHE_NAME)

Это обеспечивает мгновенное получение новых настроек без необходимости очистки кеша.

🔄 Система обновлений

• Service Worker автоматически проверяет обновления
• UpdateNotifier уведомляет пользователей о новых версиях
• Один клик для обновления без перезагрузки страницы
• Мобильная оптимизация - работает на всех устройствах

📊 Поддерживаемые статусы

• ✅ Работает - сервер доступен
• ❌ Недоступен - сервер не отвечает
• ⚠️ Неизвестно - нет данных

🏷️ Лицензия

MIT License

📧 Поддержка

• Telegram: @nerjel_help
• Домен: status.nj0.ru