207 lines
8.0 KiB
Markdown
207 lines
8.0 KiB
Markdown
# htop-web
|
|
|
|

|
|
|
|
**Пользовательский веб-дашборд для мониторинга системы на базе Angular и Spring Boot.**
|
|
|
|
htop-web объединяет фронтенд на Angular и бэкенд на Spring Boot WebFlux в одном Docker-контейнере, предоставляя веб-интерфейс для просмотра метрик системы и информации о процессах.
|
|
|
|
<p align="center">
|
|
<img alt="Java 21" src="https://img.shields.io/badge/Java-21-orange?logo=openjdk&logoColor=white">
|
|
<img alt="Spring Boot" src="https://img.shields.io/badge/Spring%20Boot-WebFlux-6DB33F?logo=springboot&logoColor=white">
|
|
<img alt="Angular" src="https://img.shields.io/badge/Angular-22-DD0031?logo=angular&logoColor=white">
|
|
<img alt="Docker" src="https://img.shields.io/badge/Docker-Compose-2496ED?logo=docker&logoColor=white">
|
|
</p>
|
|
|
|
## Демо
|
|
|
|
https://htop-web.jambotron.com/
|
|
|
|
## Возможности
|
|
|
|
- **Системный дашборд** — просмотр информации о системе через браузер.
|
|
- **Метрики CPU и памяти** — просмотр показателей использования ресурсов.
|
|
- **Информация о процессах** — просмотр деталей системных процессов.
|
|
- **Информация о Linux-системе** — дополнительные метрики операционной системы.
|
|
- **Реактивный бэкенд** — реализован на Spring WebFlux.
|
|
- **Архитектура одного контейнера** — статические файлы Angular обслуживаются Spring Boot.
|
|
- **Развёртывание через Docker Compose** — сборка, запуск, просмотр и остановка приложения стандартными командами Docker.
|
|
|
|
> **Область мониторинга:** метрики зависят от операционной системы, среды контейнера и предоставленных прав. Docker Desktop на Windows запускает Linux-контейнеры в виртуальной среде; метрики из контейнера не обязательно отражают полную картину Windows-хоста.
|
|
|
|
## Технологический стек
|
|
|
|
| Слой | Технология |
|
|
|---|---|
|
|
| Фронтенд | Angular 22, TypeScript, RxJS |
|
|
| Бэкенд | Java 21, Spring Boot, Spring WebFlux |
|
|
| Сбор метрик | OSHI |
|
|
| Сборка | Gradle, npm |
|
|
| Развёртывание | Docker, Docker Compose |
|
|
|
|
## Архитектура
|
|
|
|
```text
|
|
Браузер
|
|
|
|
|
v
|
|
+----------------------+
|
|
| контейнер htop-web |
|
|
| |
|
|
| Spring Boot |
|
|
| WebFlux |
|
|
| | |
|
|
| +-- REST API |
|
|
| +-- Метрики |
|
|
| +-- Процессы |
|
|
| |
|
|
| Angular (статика) |
|
|
+----------------------+
|
|
```
|
|
|
|
Фронтенд на Angular собирается в production-режиме и упаковывается в статические ресурсы Spring Boot. Обе части развёртываются вместе как один контейнер.
|
|
|
|
## Пример использования
|
|
|
|
```yaml
|
|
services:
|
|
htop-web:
|
|
image: gitea.jambotron.com/liosha84/htop-web:latest
|
|
container_name: htop-web
|
|
restart: unless-stopped
|
|
pid: host
|
|
read_only: true
|
|
security_opt:
|
|
- no-new-privileges:true
|
|
tmpfs:
|
|
- /tmp:noexec,nosuid,size=64m
|
|
volumes:
|
|
- /proc:/host/proc:ro
|
|
- /sys:/host/sys:ro
|
|
- /etc/hostname:/host/etc/hostname:ro
|
|
- /etc/os-release:/host/etc/os-release:ro
|
|
- /var:/host/var:ro
|
|
- /home:/host/home:ro
|
|
- /opt:/host/opt:ro
|
|
- /tmp:/host/tmp:ro
|
|
- /srv:/host/srv:ro
|
|
- /usr:/host/usr:ro
|
|
labels:
|
|
caddy: htop-web.jambotron.com
|
|
caddy.reverse_proxy: "{{upstreams 8080}}"
|
|
networks:
|
|
- jambotron-net
|
|
|
|
networks:
|
|
jambotron-net:
|
|
external: true
|
|
```
|
|
|
|
```bash
|
|
docker compose up -d
|
|
```
|
|
|
|
## Быстрый старт
|
|
|
|
### Требования
|
|
|
|
- Docker Engine или Docker Desktop.
|
|
- Docker Compose.
|
|
|
|
Локальная установка Java или Node.js не требуется — Dockerfile использует multi-stage сборку, которая компилирует всё внутри Docker.
|
|
|
|
### 1. Сборка и запуск контейнера
|
|
|
|
Из корня репозитория выполните одну команду:
|
|
|
|
```bash
|
|
docker compose up -d --build
|
|
```
|
|
|
|
Флаг `--build` запускает multi-stage сборку Docker, которая компилирует фронтенд на Angular и бэкенд на Spring Boot внутри Docker.
|
|
|
|
По умолчанию конфигурация Compose маппит порт `8088` хоста на порт `8080` контейнера.
|
|
|
|
Откройте [http://localhost:8088](http://localhost:8088).
|
|
|
|
### Альтернатива: локальная сборка через Gradle (требуется Java 21 и Node.js)
|
|
|
|
Если нужно собрать локально (например, для запуска тестов):
|
|
|
|
**Linux:**
|
|
|
|
```bash
|
|
cd backend
|
|
./gradlew clean build
|
|
cd ..
|
|
```
|
|
|
|
**Windows PowerShell:**
|
|
|
|
```powershell
|
|
cd backend
|
|
.\gradlew.bat clean build
|
|
cd ..
|
|
```
|
|
|
|
Настроенная сборка Gradle собирает фронтенд и упаковывает его production-активы вместе с бэкендом.
|
|
|
|
### 3. Просмотр логов
|
|
|
|
```bash
|
|
docker compose ps
|
|
docker compose logs -f htop-web
|
|
```
|
|
|
|
### 4. Остановка приложения
|
|
|
|
```bash
|
|
docker compose down
|
|
```
|
|
|
|
## Структура проекта
|
|
|
|
```text
|
|
htop-web/
|
|
├── backend/
|
|
│ ├── src/main/java/com/htopweb/
|
|
│ ├── src/main/resources/
|
|
│ └── build.gradle
|
|
├── frontend/
|
|
│ ├── src/app/
|
|
│ ├── package.json
|
|
│ └── angular.json
|
|
├── docs/
|
|
│ ├── INSTALLATION.md
|
|
│ ├── CONFIGURATION.md
|
|
│ ├── ARCHITECTURE.md
|
|
│ └── DEVELOPMENT.md
|
|
├── Dockerfile
|
|
├── docker-compose.yml
|
|
├── CONTRIBUTING.md
|
|
├── CHANGELOG.md
|
|
└── README.md
|
|
```
|
|
|
|
## Документация
|
|
|
|
- [Установка](docs/INSTALLATION.md)
|
|
- [Конфигурация](docs/CONFIGURATION.md)
|
|
- [Архитектура](docs/ARCHITECTURE.md)
|
|
- [Разработка](docs/DEVELOPMENT.md)
|
|
- [Список изменений](CHANGELOG.md)
|
|
- [Участие в проекте](CONTRIBUTING.md)
|
|
|
|
## Безопасность
|
|
|
|
Данные мониторинга системы могут раскрыть конфиденциальную информацию об окружении. Перед тем как сделать htop-web доступным за пределами доверенной сети:
|
|
|
|
- Разместите его за аутентификацией и контролем доступа.
|
|
- Используйте HTTPS при доступе через недоверенную сеть.
|
|
- Предоставляйте контейнеру только те права и доступ к хосту, которые действительно нужны.
|
|
- Избегайте публикации учётных данных, приватных ключей или конфиденциальной конфигурации окружения.
|
|
|
|
## Лицензия
|
|
|
|
Лицензия ещё не указана. Пока лицензия не добавлена, не считайте исходный код доступным для неограниченного повторного использования или распространения.
|