jambotron_gang/htop-web
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Develop #3

Merged
Liosha84 merged 3 commits from develop into master 2026-10-29 00:52:20 +01:00
Conversation 0 Commits 3 Files Changed 2
+58 -59
1 changed files with 58 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 3f9ecc1113 - Show all commits
README.md
+57 -58
View File
@@ -2,9 +2,9 @@
![htop-web](htop-web.gif)
**A self-hosted, browser-based system monitoring dashboard powered by Angular and Spring Boot.**
**Пользовательский веб-дашборд для мониторинга системы на базе Angular и Spring Boot.**
htop-web packages its Angular frontend and Spring Boot WebFlux backend into a single Docker container, providing a web interface for viewing system metrics and process information.
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">
@@ -13,55 +13,55 @@ htop-web packages its Angular frontend and Spring Boot WebFlux backend into a si
<img alt="Docker" src="https://img.shields.io/badge/Docker-Compose-2496ED?logo=docker&logoColor=white">
</p>
## Demo
## Демо
https://htop-web.jambotron.com/
## Features
## Возможности
- **System dashboard** — inspect system information through a browser.
- **CPU and memory metrics** — view resource measurements exposed by the backend.
- **Process information** — inspect available system process details.
- **Linux system information** — collect additional operating-system metrics.
- **Reactive backend** — built with Spring WebFlux.
- **Single-container architecture** — Angular production assets are served by Spring Boot.
- **Docker Compose deployment** — build, start, inspect and stop the application with standard Docker commands.
- **Системный дашборд** — просмотр информации о системе через браузер.
- **Метрики CPU и памяти** — просмотр показателей использования ресурсов.
- **Информация о процессах** — просмотр деталей системных процессов.
- **Информация о Linux-системе** — дополнительные метрики операционной системы.
- **Реактивный бэкенд** — реализован на Spring WebFlux.
- **Архитектура одного контейнера** — статические файлы Angular обслуживаются Spring Boot.
- **Развёртывание через Docker Compose** — сборка, запуск, просмотр и остановка приложения стандартными командами Docker.
> **Monitoring scope:** metrics depend on the operating system, container runtime and granted permissions. Docker Desktop on Windows runs Linux containers in a virtualized environment; metrics from a container should not be assumed to represent the complete Windows host.
> **Область мониторинга:** метрики зависят от операционной системы, среды контейнера и предоставленных прав. Docker Desktop на Windows запускает Linux-контейнеры в виртуальной среде; метрики из контейнера не обязательно отражают полную картину Windows-хоста.
## Technology Stack
## Технологический стек
| Layer | Technology |
| Слой | Технология |
|---|---|
| Frontend | Angular 22, TypeScript, RxJS |
| Backend | Java 21, Spring Boot, Spring WebFlux |
| System inspection | OSHI |
| Build | Gradle, npm |
| Deployment | Docker, Docker Compose |
| Фронтенд | Angular 22, TypeScript, RxJS |
| Бэкенд | Java 21, Spring Boot, Spring WebFlux |
| Сбор метрик | OSHI |
| Сборка | Gradle, npm |
| Развёртывание | Docker, Docker Compose |
## Architecture
## Архитектура
```text
Browser
Браузер
|
v
+----------------------+
| htop-web container |
| контейнер htop-web |
| |
| Spring Boot |
| WebFlux |
| | |
| +-- REST API |
| +-- System data |
| +-- Process data |
| +-- Метрики |
| +-- Процессы |
| |
| Angular assets |
| Angular (статика) |
+----------------------+
```
The Angular frontend is built for production and packaged into the Spring Boot application's static resources. Both parts are deployed together as one application container.
Фронтенд на Angular собирается в production-режиме и упаковывается в статические ресурсы Spring Boot. Обе части развёртываются вместе как один контейнер.
## Simple Scenario of using
## Пример использования
```yaml
services:
@@ -101,33 +101,32 @@ networks:
docker compose up -d
```
## Быстрый старт
## Quick Start
### Требования
### Requirements
- Docker Engine or Docker Desktop.
- Docker Engine или Docker Desktop.
- Docker Compose.
No local Java or Node.js is required — the Dockerfile uses multi-stage build to compile everything inside Docker.
Локальная установка Java или Node.js не требуется — Dockerfile использует multi-stage сборку, которая компилирует всё внутри Docker.
### 1. Build and start the container
### 1. Сборка и запуск контейнера
From the repository root, run a single command:
Из корня репозитория выполните одну команду:
```bash
docker compose up -d --build
```
The `--build` flag triggers the multi-stage Docker build that compiles both the Angular frontend and the Spring Boot backend inside Docker.
Флаг `--build` запускает multi-stage сборку Docker, которая компилирует фронтенд на Angular и бэкенд на Spring Boot внутри Docker.
The default Compose configuration maps host port `8088` to container port `8080`.
По умолчанию конфигурация Compose маппит порт `8088` хоста на порт `8080` контейнера.
Open [http://localhost:8088](http://localhost:8088).
Откройте [http://localhost:8088](http://localhost:8088).
### Alternative: Local Gradle build (requires Java 21 and Node.js)
### Альтернатива: локальная сборка через Gradle (требуется Java 21 и Node.js)
If you need to build locally (for example, to run tests):
Если нужно собрать локально (например, для запуска тестов):
**Linux:**
@@ -145,22 +144,22 @@ cd backend
cd ..
```
The configured Gradle build builds the frontend and packages its production assets with the backend.
Настроенная сборка Gradle собирает фронтенд и упаковывает его production-активы вместе с бэкендом.
### 3. Inspect logs
### 3. Просмотр логов
```bash
docker compose ps
docker compose logs -f htop-web
```
### 4. Stop the application
### 4. Остановка приложения
```bash
docker compose down
```
## Project Structure
## Структура проекта
```text
htop-web/
@@ -184,24 +183,24 @@ htop-web/
└── README.md
```
## Documentation
## Документация
- [Installation](docs/INSTALLATION.md)
- [Configuration](docs/CONFIGURATION.md)
- [Architecture](docs/ARCHITECTURE.md)
- [Development](docs/DEVELOPMENT.md)
- [Changelog](CHANGELOG.md)
- [Contributing](CONTRIBUTING.md)
- [Установка](docs/INSTALLATION.md)
- [Конфигурация](docs/CONFIGURATION.md)
- [Архитектура](docs/ARCHITECTURE.md)
- [Разработка](docs/DEVELOPMENT.md)
- [Список изменений](CHANGELOG.md)
- [Участие в проекте](CONTRIBUTING.md)
## Security
## Безопасность
System monitoring data can reveal sensitive information about the environment. Before exposing htop-web beyond a trusted network:
Данные мониторинга системы могут раскрыть конфиденциальную информацию об окружении. Перед тем как сделать htop-web доступным за пределами доверенной сети:
- Put it behind appropriate authentication and access controls.
- Use HTTPS when accessed over an untrusted network.
- Grant the container only the permissions and host access it actually needs.
- Avoid publishing credentials, private keys or sensitive environment configuration.
- Разместите его за аутентификацией и контролем доступа.
- Используйте HTTPS при доступе через недоверенную сеть.
- Предоставляйте контейнеру только те права и доступ к хосту, которые действительно нужны.
- Избегайте публикации учётных данных, приватных ключей или конфиденциальной конфигурации окружения.
## License
## Лицензия
No license has been declared yet. Until a license is added, do not assume that the source code is available for unrestricted reuse or redistribution.
Лицензия ещё не указана. Пока лицензия не добавлена, не считайте исходный код доступным для неограниченного повторного использования или распространения.