ESP32 Journey- Data Visualization
Heyyoo everybody, kembali lagi bersama gue di ESP32 Journey, yah kayanya udah cukup lama ya gue ga nulis pengalaman ngoprek alat ini, pasti udah pada kangen kan yaa. Okeey tanpa basa basi markibed alias mari kita bedah tentang Data Visualization di ESP32.
Okee jadi alat-alat yang perlu kalian siapin itu simple kok, sama kaya journey sebelumnya yang masih berkutat di pengambilan data suhu ruangan. So, kalian bakal butuh ini nih:
-ESP32 development board
-DHT22 or DHT11 Temperature and Humidity Sensor
-Resistor 10k ohm
-Breadboard
-Kabel jumper
Oiya, sebelum itu kita perlu nyiapin juga extension di Arduino untuk bisa ngejalanin kode programnya. Jadii kalian juga perlu download “Filesystem Uploader Plugin” disini. Ohiya ini tuh supaya bisa upload file HTML ke ESP32 Board. Kemudian kalian juga butuh extension Asynchronous Web Server disini sama AsyncTCP disini.
Untuk skematik rangkaian ya sama kaya kemaren kurang lebih kaya gini nih.
Okey, untuk file HTML yang akan diupload ke ESP32 kalian bisa dapatkan disini. Oiya jangan lupa buat extract file tersebut terus simpen di direktori kode program yang kalian buat. Buat kode program saya kasih nih dibawah ini nih.
/*********
Rui Santos
Complete project details at https://randomnerdtutorials.com
*********/// Import required libraries#ifdef ESP32
#include <WiFi.h>
#include <ESPAsyncWebServer.h>
#include <SPIFFS.h>
#else
#include <Arduino.h>
#include <Hash.h>
#include <ESPAsyncTCP.h>
#include <ESPAsyncWebServer.h>
#include <FS.h>
#endif
#include <Wire.h>
#include <Adafruit_Sensor.h>
#include <DHT.h>// Replace with your network credentials
const char* ssid = "esp32tes";
const char* password = "apayahpasswordnya";#define DHTPIN 4 // Digital pin connected to the DHT sensor// Uncomment the type of sensor in use:
#define DHTTYPE DHT11 // DHT 11
//#define DHTTYPE DHT22 // DHT 22 (AM2302)
//#define DHTTYPE DHT21 // DHT 21 (AM2301)DHT dht(DHTPIN, DHTTYPE);// Create AsyncWebServer object on port 80
AsyncWebServer server(80);String readDHTTemperature() {
// Sensor readings may also be up to 2 seconds 'old' (its a very slow sensor)
// Read temperature as Celsius (the default)
float t = dht.readTemperature();
// Read temperature as Fahrenheit (isFahrenheit = true)
//float t = dht.readTemperature(true);
// Check if any reads failed and exit early (to try again).
if (isnan(t)) {
Serial.println("Failed to read from DHT sensor!");
return "--";
}
else {
Serial.println(t);
return String(t);
}
}String readDHTHumidity() {
// Sensor readings may also be up to 2 seconds 'old' (its a very slow sensor)
float h = dht.readHumidity();
if (isnan(h)) {
Serial.println("Failed to read from DHT sensor!");
return "--";
}
else {
Serial.println(h);
return String(h);
}
}// Replaces placeholder with DHT values
String processor(const String& var){
//Serial.println(var);
if(var == "TEMPERATURE"){
return readDHTTemperature();
}
else if(var == "HUMIDITY"){
return readDHTHumidity();
}
return String();
}void setup(){
// Serial port for debugging purposes
Serial.begin(115200);
dht.begin();
/*bool status;
// default settings
// (you can also pass in a Wire library object like &Wire2)
status = dht.begin();
if (!status) {
Serial.println("Could not find a valid DHT11 sensor, check wiring!");
while (1);
}*/// Initialize SPIFFS
if(!SPIFFS.begin()){
Serial.println("An Error has occurred while mounting SPIFFS");
return;
}// Connect to Wi-Fi
WiFi.begin(ssid, password);
while (WiFi.status() != WL_CONNECTED) {
delay(1000);
Serial.println("Connecting to WiFi..");
}// Print ESP32 Local IP Address
Serial.println(WiFi.localIP());// Route for root / web page
server.on("/", HTTP_GET, [](AsyncWebServerRequest *request){
request->send(SPIFFS, "/index.html");
});
server.on("/temperature", HTTP_GET, [](AsyncWebServerRequest *request){
request->send_P(200, "text/plain", readDHTTemperature().c_str());
});
server.on("/humidity", HTTP_GET, [](AsyncWebServerRequest *request){
request->send_P(200, "text/plain", readDHTHumidity().c_str());
});// Start server
server.begin();
}
void loop(){
}
Dan proses buat ngejalanin programnya yakni pertama kalian upload dulu file HTML nya lewat fileuploader system tadi yang bisa kalian temuin di submenu dari tools. Setelah itu baru deh upload kode program ke ESP32. Dan jangan lupa buat nyesuain SSID dan Passwordnya sesuai koneksi yang kalian miliki. Setelah itu, esp32 akan memberi IP Address dari web server yang kalian buat. Dan taraaa kalian bisa melihat visualisasi dari data suhu ruangan kalian seperti ini nih.
Keren banget kann, kayanya sampai sini dulu deh cerita kita di journey kali ini. Stay Safe dan mari kita lawan Pandemi COVID-19 ini dengan #DiRumahAja.
