sabrina
sabrina is a dashboard server built using express, whose React DOM is dynamically controlled by client POST
requests.
⚠️ This project is currently experimental, so you must use at your own risk. It is in no way fit for a production environment.
🔥 Features
⛏️ It's extensible!
- You can configure sabrina to support the visualisation of any React Components.
- Rendered layouts are described using propeteer, so we can specify whatever props you want on rendered components.
⚡ It's asynchronous!
- Using websockets, sabrina will publish all dashboard updates to all client browsers at once.
🔋 It's batteries included!
- sabrina comes pre-packaged with react-mosaic, so you get awesome window management for free.
- It's bundled using parcel, so you know it's fast.
🚀 Getting Started
Using npm
:
npm i sabrina
Using yarn
:
yarn add sabrina
Breaking Changes
0.1.0-alpha.6
Server configuration options are now specified using an options
object, as opposed to a sequence of primitives.
+ sabrina({ /* ui dependencies */ }, {+ port: 3000,+ socket: 40510,+ });- sabrina({ /* ui dependencies */ }, 3000, 40510);
📌 Usage
In this example, we'll use react-chartjs-2 to render a <Doughnut />
. We'll start by importing the server and configuring it to support this kind of component.
;; ;
When we run our application, it'll by default get published to http://localhost:3000:
$ ./node_modules/.bin/babel-node ./index.js⚡ Available at http://localhost:3000
Finally, we can start populating our dashboard by making some POST
requests to the /pane
route, which is used to add new tiled window content to the dashboard. Below, we use axios
:
; ;
And this will publish our new chart data to all connected clients. Simple!