falcononrails / iotmonitor-ionic Goto Github PK

This is the front-end of an IoT Monitor built using Ionic/Angular and leveraging MQTT.

• Eclipse Paho for MQTT support.
• Highcharts for graph diplay.

• Authentication using JWT.
• Adding different brokers.
• Adding topics.
• Monitoring your live sensor data.

• Clone the repo & navigate to it git clone https://github.com/falcononrails/iotmonitor-ionic.git && cd iotmonitor-ionic
• Install all dependencies npm install
• Run the app ionic serve
• This front-end uses a Node JS hosted back-end. In order to specifiy your own backend, change the backend_url variable in the files authentification-service.service.ts and topic-manager.service.ts.

After signing up and signing in, a typical scenario is as follows:

• Create an account in CloudMQTT.
• Set up an instance.
• Add the server, username, password and port (it should support websockets) from your Cloud MQTT instance and save.
  
• You can now use the CloudMQTT Websockets UI to send data & click on the graph icon to display your live data.
• In order to display data from a sensor, subscribe to the same topic as in the app, connect your sensor to CloudMQTT, and bingo!