57 lines
2.7 KiB
Markdown
57 lines
2.7 KiB
Markdown
# 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).
|