# Post Data DHT 11  dan ditampilkan pada Display OLED

## Pendahuluan

Pada project ini, Anda akan menggunakan **Shield Workshop Antares** pada modul **Development Board Lynx-32.** Pada **Shield Workshop Antares** ini terdapat sensor suhu, kelembapan (DHT11), relay, LED dan push button. Anda akan melakukan monitoring suhu dan kelembapan sesuai periode interval yang ditentukan. Hasil data yang dikirim sensor dapat Anda pantau melalui console Antares dan ditampilkan pada OLED.

<figure><img src="https://content.gitbook.com/content/rRkxjRLeqOm0pNhLfsus/blobs/Nm9sPWOanifVL2klLnwZ/Post%20Data%20DHT%2011%20dan%20ditampilkan%20pada%20Display%20OLED.png" alt=""><figcaption><p>Gambar Ilustrasi Project</p></figcaption></figure>

## Prasyarat

Material yang dibutuhkan mengikuti **Prasyarat Umum** pada laman sebelumnya. Jika Anda belum menyiapkan kebutuhan pada laman tersebut, maka Anda dapat mengunjungi laman berikut.

{% content-ref url="../../prasyarat-umum-esp32-wi-fi" %}
[prasyarat-umum-esp32-wi-fi](https://docs.antares.id/contoh-kode-dan-library/esp32-wi-fi/prasyarat-umum-esp32-wi-fi)
{% endcontent-ref %}

Adapun tambahan material yang spesifik untuk project ini adalah sebagai berikut.

1. Shield Workshop Antares
2. Modul OLED SSD1306 0,96inch 128x64 pixel berbasis I2C

<figure><img src="https://content.gitbook.com/content/rRkxjRLeqOm0pNhLfsus/blobs/dPHMiJGA2nwVANq6UXGu/1_modul%20oled.jpeg" alt="" width="345"><figcaption><p>Gambar Modul OLED SSD1036 0.96inch</p></figcaption></figure>

3. Library Antares ESP HTTP. Pada dokumentasi ini menggunakan library **Antares ESP HTTP versi 1.6.0.**

{% hint style="info" %}
Jika anda belum menginstall **Antares ESP HTTP 1.6.0** dapat mengikuti langkah berikut.

[antares-wi-fi-http](https://docs.antares.id/pendahuluan/instalasi-library-arduino/antares-wi-fi-http "mention")
{% endhint %}

4. Library DHT11. Pada dokumentasi ini menggunakan **DHT11 Sensor Library versi 1.4.4.**

{% hint style="info" %}
Jika Anda belum menginstall library **DHT11 Sensor Library versi 1.4.4.** dapat mengikuti langkah pada link berikut.

[dht11-sensor-library](https://docs.antares.id/pendahuluan/instalasi-library-arduino/dht11-sensor-library "mention")
{% endhint %}

5. Library OLED SSD1306. Pada dokumentasi ini menggunakan **Adafruit SSD1306 by Adafruit versi 2.5.7.**

{% hint style="info" %}
Jika Anda belum menginstall library **Adafruit SSD1306 by Adafruit versi 2.5.7.** dapat mengikuti langkah pada link berikut.

[adafruit-ssd1306](https://docs.antares.id/pendahuluan/instalasi-library-arduino/adafruit-ssd1306 "mention")
{% endhint %}

## Langkah Kerja

### 1. Jalankan Aplikasi Arduino IDE

### 2. Membuka Contoh Program

{% hint style="info" %}
Kode program dapat Anda buka pada Arduino IDE melalui **File > Examples > Antares ESP HTTP > Lynx32-Simple-Project > POST\_DATA\_DHT11\_OLED.**
{% endhint %}

Berikut adalah kode program contoh **POST\_DATA\_DHT11\_OLED**.

```arduino
// Library initialization
#include <AntaresESPHTTP.h>   // Load AntaresESP32HTTP library for connecting to the Antares platform
#include "DHT.h"               // Load DHT sensor library for reading temperature and humidity
#include <Adafruit_SSD1306.h>  // Load OLED display library

#define DHTPIN 14            // Define DHTPIN variable, pointing to pin 14
#define DHTTYPE DHT11        // Set DHT type to DHT11
#define SCREEN_WIDTH 128     // Define OLED screen width
#define SCREEN_HEIGHT 64     // Define OLED screen height

#define OLED_RESET -1        // Define OLED reset pin, set to -1 as it's not used
#define SCREEN_ADDRESS 0x3C  // Define OLED I2C address

#define ACCESSKEY "YOUR-ACCESS-KEY"       // Replace with your Antares account access key
#define WIFISSID "YOUR-WIFI-SSID"         // Replace with your Wi-Fi SSID
#define PASSWORD "YOUR-WIFI-PASSWORD"     // Replace with your Wi-Fi password

#define projectName "YOUR-APPLICATION-NAME"   // Replace with the Antares application name that was created
#define deviceName "YOUR-DEVICE-NAME"     // Replace with the Antares device name that was created

const unsigned long interval = 10000;    // 10 s interval to send message
unsigned long previousMillis = 0;  // will store last time message sent

AntaresESPHTTP antares(ACCESSKEY);   // Create an antares object for connecting to Antares
DHT dht(DHTPIN, DHTTYPE);             // Create a dht object for the DHT sensor
Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, OLED_RESET);  // Create a display object for the OLED screen

void setup() {
  Serial.begin(115200);     // Initialize serial communication with baudrate 115200
  antares.setDebug(true);   // Turn on debug mode. Set to "false" if you don't want messages to appear in the serial monitor

  // Reset WiFi cache before connecting
  WiFi.disconnect();

  antares.wifiConnection(WIFISSID, PASSWORD);  // Attempt to connect to Wi-Fi with the specified SSID and password
  dht.begin();             // Initialize the DHT sensor object

  if (!display.begin(SSD1306_SWITCHCAPVCC, SCREEN_ADDRESS)) {
    Serial.println(F("SSD1306 allocation failed"));   // Check if the OLED is successfully initialized
    for (;;);
  }
  display.clearDisplay();   // Clear the OLED display
  display.setTextColor(SSD1306_WHITE);   // Set text color to white
  display.setTextSize(1);   // Set text size to 1
  display.setCursor(0, 0);   // Set cursor position to (0, 0)
  display.println(F("Temperature & Humidity"));   // Display "Temperature & Humidity" text on the OLED
  display.display();         // Show the text on the OLED
  delay(2000);               // Delay for 2 seconds
}

void loop() {
  
  // Check interval overflow
  if (millis() - previousMillis > interval) {
  previousMillis = millis();
  
  float hum = dht.readHumidity();      // Read humidity value from the DHT sensor
  float temp = dht.readTemperature();  // Read temperature value from the DHT sensor
  if (isnan(hum) || isnan(temp)) {     // Check if the sensor reading is invalid
    Serial.println("Failed to read DHT sensor!");   // If the reading is invalid, print an error message
    return;   // Exit the loop function and wait for the next cycle
  }
  display.clearDisplay();   // Clear the OLED display
  display.setTextSize(1);   // Set text size to 1
  display.setCursor(0, 0);   // Set cursor position to (0, 0)
  display.print(F("Temperature: "));   // Display "Temperature: " text on the OLED
  display.print(temp);         // Display temperature value on the OLED
  display.println(F(" C"));    // Display " C" (for Celsius) on the OLED
  display.print(F("Humidity: "));   // Display "Humidity: " text on the OLED
  display.print(hum);          // Display humidity value on the OLED
  display.println(F(" %"));    // Display " %" (for percentage) on the OLED
  display.display();          // Show the text on the OLED

  Serial.println("Temperature: " + (String)temp + " *C");  // Print temperature value to the serial monitor with "*C" format
  Serial.println("Humidity: " + (String)hum + " %");       // Print humidity value to the serial monitor with "%" format
 
  // Add variable data to the storage buffer in Antares
  antares.add("temperature", temp);
  antares.add("humidity", hum);

  // Send data from the storage buffer to Antares
  antares.send(projectName, deviceName);

  }
}

```

### 3. Set HTTP Parameter pada Kode Program

Ubah parameter Protokol HTTP pada variabel berikut **\*ACCESSKEY, \*WIFISSID, \*PASSWORD, \*projectName,** dan **\*deviceName.** Sesuaikan dengan parameter di console Antares.&#x20;

```arduino
#define ACCESSKEY "YOUR-ACCESS-KEY"       // Replace with your Antares account access key
#define WIFISSID "YOUR-WIFI-SSID"         // Replace with your Wi-Fi SSID
#define PASSWORD "YOUR-WIFI-PASSWORD"     // Replace with your Wi-Fi password

#define projectName "YOUR-APPLICATION-NAME"   // Replace with the Antares application name that was created
#define deviceName "YOUR-DEVICE-NAME"     // Replace with the Antares device name that was created
```

{% hint style="info" %}
Parameter **\*Access key** didapat dari laman akun Antares Anda.
{% endhint %}

<figure><img src="https://3995702122-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrRkxjRLeqOm0pNhLfsus%2Fuploads%2FOwjl0QLzoSAsGheYULv8%2Faccess%20key.png?alt=media&#x26;token=064f2e4c-ff48-43a2-a34a-bbf49cf0276c" alt=""><figcaption><p>Letak Access Key di Laman Akun Antares</p></figcaption></figure>

{% hint style="info" %}
Parameter **WIFISSID** didapat dari nama **Wi-Fi/Hotspot** yang nantinya akan digunakan oleh **Development Board Lynx-32**. Contohnya pada gambar di bawah ini.
{% endhint %}

<figure><img src="https://content.gitbook.com/content/rRkxjRLeqOm0pNhLfsus/blobs/oBU3IfE6VsGNV9FdbXlW/2_wifi.png" alt=""><figcaption><p>WIFISSID</p></figcaption></figure>

{% hint style="info" %}
Parameter **\*PASSWORD** didapat dari **password Wi-Fi** yang sedang anda gunakan.
{% endhint %}

{% hint style="info" %}
Parameter **\*projectName** dan **\*deviceName** didapat dari **Application Name** dan **Device Name** yang sudah dibuat dalam akun Antares.
{% endhint %}

<figure><img src="https://3995702122-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrRkxjRLeqOm0pNhLfsus%2Fuploads%2F3G3Pek1wflcHqrdfG5lp%2Flynx%2032%20app.png?alt=media&#x26;token=b580c2bc-544b-457f-99ca-d7ceea76fdad" alt=""><figcaption><p>Tampilan Application Name</p></figcaption></figure>

<figure><img src="https://3995702122-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrRkxjRLeqOm0pNhLfsus%2Fuploads%2FOH0ltufXnZb7GqIFJlro%2Fantares%20shield%20dev.png?alt=media&#x26;token=6fff53e5-8e27-4639-9ef9-c617ac535262" alt=""><figcaption><p>Tampilan Device Name</p></figcaption></figure>

### 4. Compile dan Upload Program

Hubungkan **Lynx-32** dengan komputer Anda dan pastikan **Communication Port** terbaca.

{% hint style="info" %}
Pada sistem operasi Windows pengecekan dapat dilakukan melalui **Device Manager.** Jika **Lynx-32** Anda terbaca maka tampil **USB-Serial CH340** dengan port menyesuaikan ketersediaan port (pada kasus ini terbaca **COM4**).
{% endhint %}

<figure><img src="https://content.gitbook.com/content/rRkxjRLeqOm0pNhLfsus/blobs/CSqEzdAtkqKVQsBta99y/5_devman.PNG" alt=""><figcaption><p>Tampilan Device Manager</p></figcaption></figure>

Atur board **ESP32** dengan klik **Tools > Board > esp32** pada Arduino IDE, kemudian pastikan yang digunakan adalah **ESP32 Dev Module.** Pilih port sesuai communication port yang terbaca (dalam kasus ini COM4). Hasilnya akan terlihat seperti gambar berikut.

<figure><img src="https://content.gitbook.com/content/rRkxjRLeqOm0pNhLfsus/blobs/wkvLlH1GPWLmipAk3fmp/6_port.png" alt="" width="464"><figcaption><p>Tampilan Spesifikasi Board dan Port yang Digunakan</p></figcaption></figure>

Setelah semua setup selesai, lakukan upload program dengan menekan icon panah seperti gambar berikut. Tunggu hingga selesai proses compile dan upload

<figure><img src="https://content.gitbook.com/content/rRkxjRLeqOm0pNhLfsus/blobs/desGKdJ6xtNR0sunSQOY/7_upload.PNG" alt=""><figcaption><p>Ikon Compile untuk Centang dan Ikon Upload untuk Tanda Panah</p></figcaption></figure>

{% hint style="info" %}
**Icon Centang** pada Arduino IDE hanyalah proses verify. Biasanya digunakan untuk **Compile** program untuk mengetahui apakah terdapat error atau tidak.

**Icon Panah** pada Arduino IDE adalah proses verify and upload. Biasanya digunakan untuk **Compile** program sekaligus **Flash program** kedalam target board.
{% endhint %}

Jika upload program berhasil maka akan terlihat seperti gambar berikut.

<figure><img src="https://content.gitbook.com/content/rRkxjRLeqOm0pNhLfsus/blobs/tEfz8C1Z76U1ZhPXAfZB/8_done.PNG" alt=""><figcaption></figcaption></figure>

Setelah selesai upload program, Anda dapat melihat **serial monitor** untuk melakukan debug program. Icon **serial monitor** terlihat pada gambar berikut.

<figure><img src="https://content.gitbook.com/content/rRkxjRLeqOm0pNhLfsus/blobs/3hKcTHMV41yZiIExKxUZ/9_serialicon.png" alt=""><figcaption><p>Ikon Serial Monitor</p></figcaption></figure>

Atur **serial baud rate** menjadi 115200 dan pilih BothNL & CR. Hasilnya akan terlihat seperti gambar berikut.

<figure><img src="https://content.gitbook.com/content/rRkxjRLeqOm0pNhLfsus/blobs/oYmJ5EjALFI0isDMM1Bb/10_serialmon.png" alt=""><figcaption><p>Tampilan Serial Monitor</p></figcaption></figure>

{% hint style="danger" %}
Pastikan **serial baud rate** sesuai dengan nilai yang terdefinisi di kode program. Jika **serial baud rate** tidak sama, antara **kode program** dan **serial monitor** maka karakter ASCII tidak akan terbaca dengan baik.
{% endhint %}

### 5. Periksa Data di Antares

Setelah upload program berhasil, selanjutnya buka halaman device antares kemudian lihat apakah data sudah berhasil dikirim.

<figure><img src="https://content.gitbook.com/content/rRkxjRLeqOm0pNhLfsus/blobs/Umi4rPOIOMiLg80wmnEn/lynx%20antares.png" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3995702122-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrRkxjRLeqOm0pNhLfsus%2Fuploads%2F4rgEJhBfjq1XhgrIq6Pt%2F147.png?alt=media&#x26;token=9a345976-e3df-4e62-885c-a0ab9219ae71" alt=""><figcaption><p>Tampilan Antares Console</p></figcaption></figure>

{% hint style="info" %}
Data yang dikirimkan dari **Development Board Lynx-32** dengan protokol HTTP berupa variabel temperature dan humidity.
{% endhint %}

Berikut data yang ditampilkan OLED.

<figure><img src="https://content.gitbook.com/content/rRkxjRLeqOm0pNhLfsus/blobs/BFZOrR1uWY4RyqYhL64D/12_hasil.png" alt=""><figcaption><p>Tampilan OLED</p></figcaption></figure>
