Đã đăng vào khoảng 6 giờ trước 6 phút đọc

[Open Source] #148 - Astroluma: Hệ thống Dashboard quản trị Home Lab hiện đại với kiến trúc MERN, Recoil và cơ chế Integration Manifest linh hoạt

Trong thế giới của những người đam mê Home Lab, việc quản lý hàng chục dịch vụ (Plex, Home Assistant, Proxmox, Docker) từ một giao diện tập trung là nhu cầu thiết yếu. Astroluma xuất hiện như một "trung tâm điều hành" (Command Center) thế hệ mới, không chỉ cung cấp các lối tắt truy cập mà còn tích hợp sâu vào hệ thống phần cứng, cho phép giám sát thiết bị mạng, quản lý mã TOTP và stream camera trực tiếp với độ trễ thấp.

Dưới góc độ kỹ thuật, Astroluma là một minh chứng xuất sắc về việc ứng dụng kiến trúc Client-Server tách biệt, kỹ thuật quản lý trạng thái qua Recoil và khả năng mở rộng thông qua mô hình Integration Manifest.

Github: https://github.com/astroluma/astroluma

🛠️ 1. Nền tảng công nghệ: Modern MERN Stack và Real-time I/O

Astroluma tận dụng sức mạnh của hệ sinh thái JavaScript hiện đại để tạo ra một ứng dụng Dashbord phản hồi tức thì:

Frontend Core (React 18 & Vite): Tận dụng tốc độ build của Vite và các tính năng mới nhất của React 18 để tối ưu hóa trải nghiệm người dùng.
State Management (Recoil): Thay vì dùng Redux cồng kềnh, dự án sử dụng Recoil – một thư viện quản lý state tập trung cực nhẹ, cho phép các widget cập nhật dữ liệu độc lập mà không gây hiện tượng re-render toàn bộ trang.
Backend Engine (Node.js & Express): Xây dựng hệ thống RESTful API mạnh mẽ, chịu trách nhiệm điều phối các yêu cầu từ dashboard đến các dịch vụ bên thứ ba.
Persistent Storage (MongoDB & Mongoose): Lưu trữ cấu hình Dashboard linh hoạt dưới dạng NoSQL, cho phép người dùng tùy biến không giới hạn cấu trúc widget và layout.
Real-time Communication (WebSocket): Duy trì kết nối bền vững để cập nhật trạng thái thiết bị mạng và truyền tải luồng video camera trong thời gian thực.

🏗️ 2. Trụ cột kiến trúc: Modular Integration và Atomic UI

Kiến trúc của Astroluma đề cao tính "Plug-and-Play" (Cắm và chạy) và sự nhất quán:

Integration Manifest Model: Đây là điểm sáng kỹ thuật. Các ứng dụng như Sonarr, Radarr hay Portainer được tích hợp thông qua các file manifest.json. Kiến trúc này cho phép cộng đồng thêm mới các integration chỉ bằng cách khai báo Schema mà không cần can thiệp vào mã nguồn lõi của Dashboard.
Dynamic Layout với dnd-kit: Cho phép người dùng tùy biến hoàn toàn vị trí và kích thước của các widget thông qua thao tác kéo thả (Drag and Drop) phức tạp, được tính toán và lưu trữ tọa độ tức thì về backend.
Theming System (tw-colors): Tích hợp hệ thống theme đa dạng (15+ màu sắc) thông qua Tailwind CSS, hỗ trợ chuyển đổi Light/Dark mode ở mức độ từng icon và thành phần giao diện nhỏ nhất.

🔄 3. Workflow: Từ yêu cầu Giám sát đến Phản hồi Giao diện (Sequence Diagram)

Sơ đồ mô tả quy trình Astroluma cập nhật dữ liệu từ một server Proxmox và hiển thị lên Dashboard:

⚡ 4. Các kỹ thuật "Pro-level" trong mã nguồn

Low-latency Video Streaming (mpegts.js): Tích hợp thư viện giải mã video trực tiếp trên trình duyệt. Kỹ thuật này cho phép phát các luồng camera IP (RTSP/RTMP) mà không cần server trung gian chuyển mã (transcoding), giúp giảm tối đa độ trễ và tải cho CPU.
Network Autodiscovery (ARP Scan): Sử dụng chế độ mạng host trong Docker để thực hiện các lệnh quét arp-scan cấp thấp, tự động phát hiện tất cả các thiết bị đang kết nối trong mạng LAN gia đình.
Built-in TOTP & AES Encryption: Dashboard tích hợp sẵn trình quản lý mã 2FA. Các khóa bí mật (Secret Keys) được mã hóa bằng thuật toán AES-256 trước khi lưu vào database, biến Astroluma thành một công cụ bảo mật đáng tin cậy.
Wake-on-LAN (WOL) Orchestration: Kỹ thuật gửi "Magic Packet" qua giao diện web để khởi động máy tính từ xa. Logic này yêu cầu xử lý socket ở tầng thấp trong Node.js để tương tác trực tiếp với card mạng của máy chủ.

⚖️ 5. So sánh chiến lược

Tiêu chí	Astroluma	Homepage	Dashy
Quản lý State	Recoil (Tập trung, nhanh)	React State đơn giản	Vuex
Cách cấu hình	Web UI (MongoDB)	YAML files	Web UI / YAML
Tích hợp phần cứng	Mạnh (ARP Scan, WOL, TOTP)	Trung bình	Cơ bản
Stream Video	Có (mpegts.js)	Qua iframe	Qua widget
Kiến trúc	Client-Server (MERN)	Static Site Generator	Client-side heavy

✅ Kết luận: Tại sao Astroluma là hình mẫu cho Dashboard Home Lab?

Astroluma không chỉ là một trang chứa các link liên kết; nó là một hệ điều hành Dashboard thu nhỏ. Việc kết hợp giữa khả năng giám sát mạng tầng thấp và giao diện người dùng hiện đại dựa trên Recoil đã tạo ra một công cụ vừa mạnh mẽ cho các "vọc sĩ" phần cứng, vừa thân thiện với người dùng cuối.

Đối với các kỹ sư Fullstack, nghiên cứu Astroluma giúp bạn hiểu sâu về:

Cách xây dựng hệ thống Integration dựa trên Manifest.
Kỹ thuật xử lý Video Streaming và Socket trong môi trường Docker.
Tư duy thiết kế State Management hiện đại cho các ứng dụng có nhiều widget cập nhật liên tục.