# GPIO Monitor Web Interface

Веб-интерфейс дашборда GPIO Monitor: мониторинг в реальном времени, просмотр исторических логов, видеопоток камеры. Подробная документация фронтенда — [docs/frontend.md](../../../docs/frontend.md).

## Требования

- Node.js 20.x или выше
- npm 10.x или выше

Node.js нужен **только для компиляции TypeScript** — в рантайме фронтенд не имеет зависимостей и раздаётся Go-сервером из встроенных файлов.

## Установка Node.js на Raspberry Pi

```bash
# Официальный репозиторий NodeSource
curl -fsSL https://deb.nodesource.com/setup_20.x | sudo bash -
sudo apt install -y nodejs

# Проверка
node --version   # v20.x
npm --version    # 10.x
```

## Сборка

`package.json` и `tsconfig.json` уже в репозитории — инициализировать проект не нужно, только установить зависимости:

```bash
cd cmd/server/web
npm install       # однократно
npm run build     # tsc: js/*.ts → dist/*.js
npm run watch     # пересборка при изменениях
npm run clean     # удалить dist/
```

Проще из корня проекта: `make build-frontend` (сам выполнит `npm install` при необходимости).

> **Важно:** каталог `dist/` не хранится в git, но обязателен для сборки Go-сервера (`go:embed`). Всегда собирайте фронтенд до `go build` — подробности в [docs/development.md](../../../docs/development.md#порядок-сборки).

## Структура

```
web/
├── js/               # TypeScript-исходники (10 модулей, см. docs/frontend.md)
├── dist/             # Скомпилированный JS (генерируется tsc)
├── css/              # Стили
├── fonts/            # Шрифты
├── index.html        # Редирект на дашборд
├── dashboard.html    # Мониторинг в реальном времени
├── logs.html         # Просмотр исторических логов
├── favicon.png
├── package.json
└── tsconfig.json
```

Карта модулей `js/`, взаимодействие с API и цикл разработки — [docs/frontend.md](../../../docs/frontend.md). Спецификация API сервера — [docs/api.md](../../../docs/api.md).