Веб-приложение для просмотра веб-камер и погоды горнолыжного курорта Шымбулак. Поддерживает HLS-потоки в реальном времени, почасовой прогноз погоды и установку как PWA на устройство.
- Веб-камеры — просмотр до четырёх HLS-потоков с верхней, средней и базовых станций
- Погода — виджет с текущей температурой и почасовым прогнозом (Tomorrow.io)
- PWA — установка на главный экран, поддержка iOS и Android
- Vue 3, Vite 7
- Tailwind CSS 4
- HLS.js — воспроизведение HLS-потоков
- Tomorrow.io API — погода
- Node.js (рекомендуется актуальная LTS)
- npm
# Клонирование репозитория
git clone git@github.com:vaninanton/snowcam.git
cd snowcam
# Установка зависимостей
npm install
# Копирование примера переменных окружения
cp .env.example .envДля работы виджета погоды в .env нужно указать ключ API Tomorrow.io:
VITE_TOMORROW_API_KEY=ваш_ключКлюч можно получить на tomorrow.io.
# Режим разработки (с HTTPS через mkcert)
npm run dev
# Сборка для продакшена
npm run build
# Просмотр собранной версии
npm run previewПосле npm run dev приложение доступно по адресу из вывода Vite (по умолчанию с --host=0.0.0.0 — в локальной сети).
| Команда | Описание |
|---|---|
npm run dev |
Запуск dev-сервера с HTTPS |
npm run build |
Сборка в dist/ |
npm run preview |
Локальный просмотр сборки |
npm run eslint |
Проверка и автоисправление кода |
npm run format |
Форматирование через Prettier |
Развёртывание выполняется на GitHub Pages при пуше в ветку main (см. .github/workflows/deploy.yml). Для сборки в CI нужны секреты:
VITE_TOMORROW_API_KEY— ключ Tomorrow.ioTELEGRAM_TOKEN,TELEGRAM_TO— для уведомления о деплое в Telegram (опционально)
Продакшен: https://snowcam.vaninanton.ru