MCPSERV.CLUB
Fluidd

Fluidd

Self-Hosted

Responsive Klipper web interface for 3D printers

Active(90)
1.6kstars
0views
Updated 6 days ago
Fluidd screenshot 1
1 / 2

Overview

Discover what makes Fluidd powerful

Fluidd is a modern, lightweight web interface designed to manage 3D printers running the Klipper firmware. From a developer’s standpoint, it acts as a thin, highly‑customizable front‑end that consumes Moonraker’s RESTful API to expose printer state, configuration, and control commands. The application is built entirely with client‑side JavaScript (Vue.js 3) and TypeScript, which enables rapid UI updates without server‑side rendering. This architecture keeps the back‑end simple: Moonraker (Python 3) handles all RPC calls, while Fluidd merely renders the data and forwards user actions. The result is a low‑overhead, responsive experience that scales from single‑printer setups on a Raspberry Pi to multi‑printer dashboards in enterprise environments.

Front‑end

Back‑end

Data storage

Containerization

Overview

Fluidd is a modern, lightweight web interface designed to manage 3D printers running the Klipper firmware. From a developer’s standpoint, it acts as a thin, highly‑customizable front‑end that consumes Moonraker’s RESTful API to expose printer state, configuration, and control commands. The application is built entirely with client‑side JavaScript (Vue.js 3) and TypeScript, which enables rapid UI updates without server‑side rendering. This architecture keeps the back‑end simple: Moonraker (Python 3) handles all RPC calls, while Fluidd merely renders the data and forwards user actions. The result is a low‑overhead, responsive experience that scales from single‑printer setups on a Raspberry Pi to multi‑printer dashboards in enterprise environments.

Architecture

  • Front‑end: Vue.js 3 + TypeScript, leveraging Pinia for state management. The UI is modular; each panel (e.g., temperature graph, macro list, webcam feed) is a reusable component that can be dragged and dropped into any layout. The application ships with built‑in CSS themes and supports custom styling via SASS variables.
  • Back‑end: Moonraker (Python 3.8+), which exposes a WebSocket and REST API for Klipper commands, configuration files, and file system operations. Fluidd connects to Moonraker over the same network, allowing full control without exposing SSH or serial ports.
  • Data storage: No dedicated database is required; configuration and state are persisted in Klipper’s printer.cfg and Moonraker’s JSON files. For advanced features such as print history or filament spool tracking, Fluidd can integrate with external databases (SQLite, PostgreSQL) via Moonraker’s plugin system.
  • Containerization: Official Docker images are provided (both privileged and unprivileged). The container runs a simple Nginx server that serves the static Vue build, with environment variables (PORT) to override the default listening port. This makes deployment trivial in Kubernetes or Docker‑Compose stacks.

Core Capabilities

  • Multi‑printer management: A single Fluidd instance can connect to multiple Moonraker instances, each representing a distinct printer. Printers are discoverable via network scanning or manual configuration.
  • Full Klipper config editor: In‑app editing of printer.cfg with syntax highlighting, code folding, and live validation. Changes are pushed back to Klipper over Moonraker’s config API.
  • Macro organization: Drag‑and‑drop macro panels, group macros by category, and execute them via a single click. The UI also supports passing parameters to macros through dynamic input fields.
  • Webcam integration: Supports MJPEG, RTSP, and HTTP‑based streams. The webcam panel can be embedded in any layout or used as a fullscreen overlay.
  • GPIO & smart plug control: Exposes API endpoints to toggle GPIO pins, TP-Link Smartplug, or Tasmota devices. This enables power cycling of heaters, fans, or external peripherals.
  • Localization & accessibility: i18n support with full language packs; the UI is designed to be keyboard‑friendly and screen‑reader compliant.

Deployment & Infrastructure

Fluidd’s minimal footprint (under 50 MB for the Docker image) makes it ideal for edge devices such as Raspberry Pi, Intel NUCs, or cloud VMs. Because it is stateless and relies solely on Moonraker for persistence, scaling horizontally is straightforward: add more instances behind a reverse proxy and point them to different Moonraker endpoints. For high‑availability, developers can run multiple Moonraker replicas with shared configuration storage (e.g., NFS or a versioned Git repo) and let Fluidd poll each instance.

Integration & Extensibility

  • Plugin system: Moonraker’s plugin architecture allows developers to expose new REST endpoints or WebSocket events, which Fluidd can consume without modifying the core codebase. This is how features like filament spool management or advanced bed‑mesh visualizations are added.
  • Webhooks: Moonraker can trigger HTTP callbacks on events (e.g., print start/finish), enabling integration with external services such as MQTT brokers, Slack, or custom dashboards.
  • Custom panels: Developers can create new Vue components and register them in the Fluidd configuration. The UI’s drag‑and‑drop layout engine will treat these components like native panels, allowing rapid feature prototyping.

Developer Experience

Fluidd’s documentation is comprehensive and developer‑centric, with sections covering API usage, plugin development, and Docker deployment. The community is active on Discord and GitHub Issues, where contributors discuss feature requests and bug fixes. The project’s open‑source license (MIT) removes barriers to modification, while the frequent release cadence ensures that new Klipper features are quickly reflected in Fluidd. The use of TypeScript and Vue’s single‑file components keeps the codebase approachable for front‑end engineers, while Python developers can extend Moonraker without touching the UI.

Use Cases

  • Rapid prototyping: Engineers can spin up a Fluidd instance in minutes, connect to any Klipper‑enabled printer, and start tweaking parameters or adding custom macros.
  • Fleet management: Facilities with dozens of printers can consolidate monitoring into a single dashboard, leveraging Fluidd’s multi‑printer support and unified UI.
  • Custom automation: By writing Moonraker plugins that expose new endpoints, developers can integrate printer state into CI/CD pipelines, trigger automated maintenance scripts, or

Open SourceReady to get started?

Join the community and start self-hosting Fluidd today

Weekly Views

Loading...
Support Us

Featured Project

$30/month

Get maximum visibility with featured placement and special badges

Repository Health

Loading health data...

Information

Category
other
License
GPL-3.0
Stars
1.6k
Technical Specs
Pricing
Open Source
Database
None
Docker
Official
Supported OS
LinuxDocker
Author
fluidd-core
fluidd-core
Last Updated
6 days ago