Realtime Monitoring of Arduino sensor reading offline on webpage || 2024

Realtime Monitoring of Arduino sensor reading offline on webpage || 2022
The link to Arduino Library:-
DHT Sensor Library: github.com/ada...
Adafruit Unified Sensor Lib: github.com/ada...
The link to the previous video:-
• Node-RED Installation ...
🌐 Explore the fascinating world of real-time monitoring as we demonstrate how to display Arduino sensor readings offline on a webpage using Node-RED! In this comprehensive tutorial, we'll guide you through the process of setting up a Node-RED flow to receive data from your Arduino sensors and display it dynamically on a webpage. Discover how to establish a local server and create a user-friendly interface to visualize and monitor sensor data. Whether you're tracking temperature, humidity, or any other sensor readings, this tutorial will equip you with the knowledge to build a real-time monitoring system. Join us on this exciting journey as we harness the power of Node-RED to create interactive webpages that showcase Arduino sensor data in real-time in 2024!
Keywords: Real-time monitoring, Arduino sensor readings, offline webpage, Node-RED, data visualization, local server, dynamic web interface, sensor data monitoring, Arduino projects, IoT, Internet of Things, Arduino tutorial, Node-RED flow, data tracking, sensor-based monitoring, interactive webpages, real-time data display, data visualization tools, Arduino sensors, web development, data logging, Arduino projects in 2024, data analytics, IoT applications, sensor data visualization, data monitoring system.

[@makersgroup]

The Arduino Code is as follows:-
#include
#include
#include
#define DHTPIN 2 // conect to digital pin 2
#define DHTTYPE DHT11 // DHT 11
//#define DHTTYPE DHT22 // DHT 22 (AM2302)
//#define DHTTYPE DHT21 // DHT 21 (AM2301)
int Humidity=0;
int Temprature=0;
int Light=0;
DHT_Unified dht(DHTPIN, DHTTYPE);
uint32_t delayMS;
void setup() {
Serial.begin(9600);
dht.begin();
Serial.println(F("DHTxx Unified Sensor Example"));
sensor_t sensor;
dht.temperature().getSensor(&sensor);
dht.humidity().getSensor(&sensor);
delayMS = sensor.min_delay / 1000;
}
void loop() {
delay(delayMS);
sensors_event_t event;
dht.temperature().getEvent(&event);
Temprature=event.temperature;
dht.humidity().getEvent(&event);
Humidity=event.relative_humidity;
Light=analogRead(A0);
Serial.print("{\"Hum\":");
Serial.print(Humidity);
Serial.print(",\"Temp\":");
Serial.print(Temprature);
Serial.print(",\"Li\":");
Serial.print(Light);
Serial.println("}");
delay(2000);
}

[@makersgroup]

The Node-Red JSON code is as follows:-
[
{
"id": "777e21d8fb7005c6",
"type": "json",
"z": "88da2bec208da9fc",
"name": "",
"property": "payload",
"action": "",
"pretty": false,
"x": 190,
"y": 140,
"wires": [
[
"9f828d0c941740ff"
]
]
},
{
"id": "9f828d0c941740ff",
"type": "function",
"z": "88da2bec208da9fc",
"name": "",
"func": "var value=JSON.parse(JSON.stringify(msg.payload));
value=msg;
return msg;",
"outputs": 1,
"noerr": 0,
"initialize": "",
"finalize": "",
"libs": [],
"x": 320,
"y": 220,
"wires": [
[
"fe6fc76d0b7ed705",
"3aea9c82799acd44",
"edf7c2341a1b106b"
]
]
},
{
"id": "fe6fc76d0b7ed705",
"type": "function",
"z": "88da2bec208da9fc",
"name": "",
"func": "msg.payload=msg.payload.Li;
return msg;",
"outputs": 1,
"noerr": 0,
"initialize": "",
"finalize": "",
"libs": [],
"x": 500,
"y": 140,
"wires": [
[
"1ada5da722d25cc3"
]
]
},
{
"id": "edf7c2341a1b106b",
"type": "function",
"z": "88da2bec208da9fc",
"name": "",
"func": "msg.payload=msg.payload.Hum;
return msg;",
"outputs": 1,
"noerr": 0,
"initialize": "",
"finalize": "",
"libs": [],
"x": 500,
"y": 300,
"wires": [
[
"a8b9a012f0bcd88a"
]
]
},
{
"id": "3aea9c82799acd44",
"type": "function",
"z": "88da2bec208da9fc",
"name": "",
"func": "msg.payload=msg.payload.Temp;
return msg;",
"outputs": 1,
"noerr": 0,
"initialize": "",
"finalize": "",
"libs": [],
"x": 500,
"y": 220,
"wires": [
[
"94261317f1debd03"
]
]
},
{
"id": "94261317f1debd03",
"type": "ui_chart",
"z": "88da2bec208da9fc",
"name": "",
"group": "218fb04944bee58f",
"order": 8,
"width": 15,
"height": 4,
"label": "Temprature",
"chartType": "line",
"legend": "false",
"xformat": "HH:mm:ss",
"interpolate": "linear",
"nodata": "",
"dot": false,
"ymin": "",
"ymax": "",
"removeOlder": 1,
"removeOlderPoints": "",
"removeOlderUnit": "3600",
"cutout": 0,
"useOneColor": false,
"useUTC": false,
"colors": [
"#1f77b4",
"#aec7e8",
"#ff7f0e",
"#2ca02c",
"#98df8a",
"#d62728",
"#ff9896",
"#9467bd",
"#c5b0d5"
],
"outputs": 1,
"useDifferentColor": false,
"className": "",
"x": 690,
"y": 220,
"wires": [
[]
]
},
{
"id": "a8b9a012f0bcd88a",
"type": "ui_gauge",
"z": "88da2bec208da9fc",
"name": "",
"group": "218fb04944bee58f",
"order": 1,
"width": 8,
"height": 4,
"gtype": "wave",
"title": "Humidity",
"label": "units",
"format": "{{value}}",
"min": 0,
"max": "100",
"colors": [
"#00b500",
"#e6e600",
"#ca3838"
],
"seg1": "",
"seg2": "",
"className": "",
"x": 700,
"y": 300,
"wires": []
},
{
"id": "1ada5da722d25cc3",
"type": "ui_gauge",
"z": "88da2bec208da9fc",
"name": "",
"group": "218fb04944bee58f",
"order": 3,
"width": 9,
"height": 4,
"gtype": "gage",
"title": "Light intensity",
"label": "units",
"format": "{{value}}",
"min": 0,
"max": "1023",
"colors": [
"#00b500",
"#e6e600",
"#ca3838"
],
"seg1": "",
"seg2": "",
"className": "",
"x": 700,
"y": 140,
"wires": []
},
{
"id": "46a301b8aa20f403",
"type": "serial in",
"z": "88da2bec208da9fc",
"name": "",
"serial": "632ce51bae434d89",
"x": 90,
"y": 240,
"wires": [
[
"777e21d8fb7005c6"
]
]
},
{
"id": "218fb04944bee58f",
"type": "ui_group",
"name": "Arduino Uno Station",
"tab": "b10389acabce7f3b",
"order": 1,
"disp": true,
"width": "20",
"collapse": false,
"className": ""
},
{
"id": "632ce51bae434d89",
"type": "serial-port",
"serialport": "COM6",
"serialbaud": "9600",
"databits": "8",
"parity": "none",
"stopbits": "1",
"waitfor": "",
"dtr": "none",
"rts": "none",
"cts": "none",
"dsr": "none",
"newline": "\
",
"bin": "false",
"out": "char",
"addchar": "",
"responsetimeout": "10000"
},
{
"id": "b10389acabce7f3b",
"type": "ui_tab",
"name": "Node-Red Weather Station",
"icon": "dashboard",
"disabled": false,
"hidden": false
}
]

[@danielaws]

the com doesnt conect

[@yellowsupra219]

Cool

[@makersgroup]

Thank you for your comment!

[@lofies9330]

i am getting error in jason code at 44 line

[@makersgroup]

What exactly it says? You can also try building the project from scratch by using the video as a guidance

[@lofies9330]

The problem has resolved
@@makersgroup

[@lofies9330]

"
func": "msg.payload=msg.payload.Li
;
return this is where I got error