mirror of
https://github.com/ElppaDev/snStatus.git
synced 2026-01-29 09:35:36 +00:00
124 lines
4.6 KiB
Markdown
124 lines
4.6 KiB
Markdown
# snStatus - Synology NAS System Monitor
|
|
|
|
> 🖥️ **실시간 시스템 모니터링 & Docker 컨테이너 관리 웹 애플리케이션**
|
|
|
|
Synology NAS를 위한 현대적이고 직관적인 시스템 모니터링 대시보드입니다.<br>
|
|
PWA(Progressive Web App)를 지원하여 앱처럼 설치할 수 있으며, 시스템 리소스와 Docker 컨테이너를 언제 어디서나 손쉽게 관리할 수 있습니다.
|
|
|
|
**해당 프로젝트는 바이브 코딩을 활용하여 제작 되었습니다.**
|
|
|
|
|
|
|
|
|
|
|
|
---
|
|
|
|
## ✨ 주요 기능
|
|
|
|
### 📊 실시간 시스템 모니터링
|
|
- **리소스 대시보드** : CPU, 메모리, 디스크 사용량 및 네트워크 트래픽 실시간 시각화
|
|
- **인터랙티브 차트** : 다양한 기간(1h, 6h, 12h, 24h) 선택 및 상세 툴팁 제공
|
|
- **직관적인 UI** : 글래스모피즘(Glassmorphism) 디자인으로 세련된 정보 표시
|
|
|
|
### 🐳 Docker 컨테이너 관리
|
|
- **실시간 리소스 모니터링**
|
|
- **컨테이너 제어** : 시작, 중지, 재시작, 강제 종료 등 원격 제어 지원
|
|
- **웹 터미널** : 브라우저에서 컨테이너 내부 쉘(bash/sh) 직접 접속
|
|
- **실시간 로그** : 컨테이너 로그 스트리밍 확인
|
|
|
|
### 🔔 스마트 알림 시스템
|
|
- **임계치 알림** : CPU, 메모리, 디스크 사용률이 설정된 한계 초과 시 알림
|
|
- **Docker 이벤트** : 컨테이너 비정상 종료 시 즉시 알림
|
|
- **PWA 푸시 알림** : 앱을 닫아도 백그라운드에서 시스템 경고 수신
|
|
|
|
---
|
|
|
|
## 📦 설치 및 실행
|
|
|
|
### 사전 요구사항
|
|
- **Docker** & **Docker Compose**
|
|
- **HTTPS 환경 (PWA 설치를 위한 필수 조건)**
|
|
|
|
### 설치 방법
|
|
git clone을 수행하지 않고 직접 docker-compose.yaml을 작성하여 실행하여도 됩니다.<br>
|
|
만약 직접 작성하여 실행을 하실 경우 3 부터 시작하세요.
|
|
|
|
1. **프로젝트 클론**
|
|
```bash
|
|
git clone https://github.com/ElppaDev/snStatus.git
|
|
cd snStatus
|
|
```
|
|
|
|
2. **Docker Compose 직접 작성**
|
|
```yaml
|
|
services:
|
|
backend:
|
|
image: sa8001/snstatus-backend:v0.1.5
|
|
container_name: snstatus-backend
|
|
restart: always
|
|
environment:
|
|
- NODE_ENV=production
|
|
privileged: true
|
|
volumes:
|
|
- /:/host:ro
|
|
- /proc:/host/proc:ro
|
|
- /sys:/host/sys:ro
|
|
- /var/run/docker.sock:/var/run/docker.sock
|
|
- ./data:/app/data
|
|
ports:
|
|
- "8001:8001"
|
|
|
|
frontend:
|
|
image: sa8001/snstatus-frontend:v0.1.5
|
|
container_name: snstatus-frontend
|
|
restart: always
|
|
ports:
|
|
- "3005:80"
|
|
depends_on:
|
|
- backend
|
|
```
|
|
|
|
3. **Docker Compose 실행**
|
|
```bash
|
|
mkdir data
|
|
docker-compose up -d
|
|
```
|
|
|
|
4. **접속**
|
|
- 브라우저에서 `http://<NAS-IP>:3005` 접속
|
|
- PWA 앱 설치 및 푸시 알림을 사용하기 위해서는 HTTPS를 통하여 접속하여야 합니다.
|
|
|
|
|
|
---
|
|
|
|
### 미리보기
|
|
<details>
|
|
<summary>💻 PC 화면 미리보기</summary>
|
|
<p align="center">
|
|
<img src="https://github.com/user-attachments/assets/bae6ff03-59a8-4784-895b-fa8eb3349c9a" width="48%" />
|
|
<img src="https://github.com/user-attachments/assets/9ccc51c0-9286-4b21-864d-b57460fbadda" width="48%" />
|
|
</p>
|
|
<p align="center">
|
|
<img src="https://github.com/user-attachments/assets/a002e67b-513c-4286-9ef8-f75c16de3137" width="48%" />
|
|
<img src="https://github.com/user-attachments/assets/c2b09187-2002-4493-951f-92688bbb0f05" width="48%" />
|
|
</p>
|
|
<p align="center">
|
|
<img src="https://github.com/user-attachments/assets/1399ae07-9999-4241-a2b5-00dc39059d3b" width="48%" />
|
|
</p>
|
|
</details>
|
|
|
|
<details>
|
|
<summary>📱 모바일 화면 미리보기</summary>
|
|
<p align="center">
|
|
<img src="https://github.com/user-attachments/assets/62ee7d61-03c6-469e-9ee4-84c575e3fd2b" width="22%" />
|
|
<img src="https://github.com/user-attachments/assets/24149ce6-5387-4611-a275-c7fb87de07f3" width="22%" />
|
|
<img src="https://github.com/user-attachments/assets/acbb2584-5b48-4880-8182-860e09c8ed4b" width="22%" />
|
|
<img src="https://github.com/user-attachments/assets/5dfd98dd-02b4-4286-a656-a002cdfd4d36" width="22%" />
|
|
</p>
|
|
<p align="center">
|
|
<img src="https://github.com/user-attachments/assets/52a11ba5-d54b-40ed-9be6-fabdc6fa5557" width="22%" />
|
|
<img src="https://github.com/user-attachments/assets/ed5a7db1-36f9-42e6-b062-085e52dd3f90" width="22%" />
|
|
<img src="https://github.com/user-attachments/assets/85f48ac0-94fc-44d6-8582-fc91ac7e9a47" width="22%" />
|
|
</p>
|
|
</details>
|