@maustec/react-edge-o-matic

react-edge-o-matic

React component provider for connecting to Edge-o-Matic devices!

Install

npm install --save react-edge-o-matic

Usage

This exposes device state via the new React Context API. See the example/ directory for a project that can connect to the device and print state.

Two providers are exported, DeviceProvider handles device connection, config and commands. ReadingsProvider streams reading data from the device.

More docs forthcoming.

import React, { useState } from 'react'
import DeviceProvider from 'react-edge-o-matic'
import { DeviceContext } from 'react-edge-o-matic'

const renderDeviceState = (state) => {
  return (
    <div className={'card'}>
      <pre>
        <code>{ JSON.stringify(state, undefined, 2) }</code>
      </pre>
    </div>
  )
}

const App = () => {
  return <DeviceProvider>
    <DeviceContext.Consumer>
      { renderDeviceState }
    </DeviceContext.Consumer>
  </DeviceProvider>
}

export default App

License

MIT © MausTec