One Click IoT dashboard and OTA application using Bytebeam (Part 1)

In part 1 of this guide, we will get an understanding of following

1. How to create an IoT dashboard using Bytebeam?
2. How to do device management using Bytebeam?

So let's get started

Struggle of creating and managing IoT infrastructure

I have been working in IoT hardware and devices for a while now. It's been a year since I started exploring IoT cloud options. And to create the best IoT architecture, I had to go through various cloud platforms, various microservices, and MQTT brokers. To knit together and manage IoT applications at scale with various microservices is itself a struggle. Earlier I was using AWS microservices, grafana, InfluxDB, and other services to create my IoT application. Managing, scaling, and porting these services was a struggle to me.

From the long time i was in search for a integrated solution where i can get OTA, IoT dashboard, notification services, actions and IoT device management service. My search end up in ByteBeam. It provides all of the above services without actually managing anything

What ByteBeam offers

In this story, we will create a simple IoT temperature and humidity application using ESP32 and Bytebeam cloud console. But before that let's talk about the features and offerings of ByteBeam cloud. Bytebeam provides us with a uni IoT cloud for all our IoT needs like

• Device Registry
• Over The Air Updates
• Configuration Management
• Device to the mobile communication
• Data Visualization
• Role-based Access controls

So lets grab our things and start with ByteBeam IoT

Hardware Requirements

• Sensiron SHT31 Temperature and humidity sensor
• ESP32 dev module

Hardware Connection

Connect SHT31 and ESP32 dev modules as follows

• SHT31 SDA → ESP32 GPIO21
• SHT31 SCL → ESP32 GPIO22
• SHT31 Vin → ESP32 3v3
• SHT31 GND → ESP32 GND

Guide to integrating Bytebeam with ESP IDF

This guide will show you how to integrate Bytebeam with the ESP IoT Development Framework (IDF).

This guide assumes that you are familiar with the ESP IoT Development Framework (IDF). If you are not, the best place to get started will be the ESP Getting started guide.

Setting up Bytebeam ESP SDK

• Firstly clone the ByteBeam ESP SDK
• Now follow Setting up Bytebeam SDK to set up the SDK to your development framework
• This guide gives you a broader understanding of Bytebeam ESP SDK.

Getting SHT values

• Browse through SHT Example inside ByteBeam ESPSDK in examples directory
• I2c configuration are defined in “sht31.h”. we have defined SDA as GPIO21 and SCL as GPIO22. you can alter these according to your connection.

static i2c_port_t i2c_port = I2C_NUM_0;
#define I2C_SDA 21
#define I2C_SCL 22
#define I2C_CLK_FREQ 100000

• in app_main.c initialize the SHT31 I2C communication with ESP32

if (sht31_init())
    printf("Initialized SHT31");
else
    printf("Could not initialize SHT3x sensor\n");

• now get the temperature and humidity measurements from SHT31

if (sht31_read_temp_humi(&temperature, &humidity))
    printf("SHT3x Sensor: %.2f °C, %.2f %%\n",temperature,    humidity);

Guide to configure Bytebeam cloud using Bytebeam cloud console

Before continuing further, check out the this guide to get more understanding on ByteBeam console

• Go to ByteBeam.io and create your account to access bytebeam cloud console
• Now create a new project and give it a name. I have given it the name “esp32temphumid”

• Now it will give a prompt to you to select project, select newely creted project

• Now click on create device to provision a new device to bytebeam console

• As you hit submit in the prompt. A new JSON file will be downloaded which contains the authentication certificate, broker, device_id, and project id. You need to save this file in the ESP file system as mentioned here. The JSON will look like this

{
  "project_id": "****",
  "broker": "******",
  "port": 8883,
  "device_id": "**",
  "authentication": {
       "ca_certificate":*"*********",
       "device_certificate": "**********",
       "device_private_key": "***********"
       }
}

• You can find your newly created device in console.

• Now next we need to configure the stream where we will define out data keys and their data type for that go to “Admin” on the top right corner and select “Streams”. You will find table Table Name, Column Name, and Column Type in Streams. Add your data keys in Column Name and its respective data type in Column Type. Like we have temperature and humidity keys with Float32 as their respective data types and device_shadow as your Table Name.

• Go to Device Management again, here you can find the last triggered data. value of humidity and temperature

• Now let’s create a dashboard to visualize our data. Click on Dashboards in bytebeam console. And then click on Create Dashboard.
• You will get a prompt to select Acess Control for admin and viewer, time range, refresh interval, etc. alter these settings and then hit submit

• Now on the next screen. Click on Select. and then on the next screen click on the Panel icon. you will get different visualization like line charts, gauges, tacking, time-series table, etc. Select Line Chart for now.

• Give a name to your panel in the Title. select table (device_shadow in our case) from the Table drop-down. select a column (temperature and humidity in our case) from the Column dropdown. and select max from the third drop-down. now your graph will look like this

• Hit submit to proceed further.
• Like this, you can create multiple visualizations for your dashboard.

Conclusion

So finally i found the right solution to serve all my client's needs. It can be a device registry, device management, real-time dashboard, OTA updates. And the important part is this all can be done without any prior knowledge of cloud. In Part 2 we will be exploring remote OTA option provided by ByteBeam.