# Get Data displayed on OLED

In this project, you will display data from the **Antares IoT Platform** on an OLED using the **Lynx-32 Development Board** module. In this **Antares Shield Workshop**, there are temperature, humidity (DHT11), relay, LED, and push button sensors. You will send a message in the form of data displayed on the OLED display. The process of sending this data uses **POSTMAN Software** to send data to the **Antares IoT Platform**.

## Prerequisites

The additional materials specific to this project are as follows.

{% content-ref url="../../general-prerequisites-esp32-wi-fi" %}
[general-prerequisites-esp32-wi-fi](https://docs.antares.id/en/code-and-library-examples/esp32-wi-fi/general-prerequisites-esp32-wi-fi)
{% endcontent-ref %}

The additional materials specific to this project are as follows.

1. Shield Workshop Antares
2. I2C-based 0.96inch 128x64 pixel SSD1036 OLED module

<figure><img src="https://content.gitbook.com/content/7cujmJ5QHdJaAjH815aZ/blobs/dxkCbaNtx2dlWZUnsPA5/OLED.jpeg" alt="" width="345"><figcaption><p>SSD1036 0.96inch OLED Module Picture</p></figcaption></figure>

3. Antares ESP HTTP Library. This documentation uses the **Antares ESP HTTP library version 1.4.0.**

{% hint style="info" %}
If you have not installed **Antares ESP HTTP 1.4.0**, please follow these steps.

[antares-wi-fi-http](https://docs.antares.id/en/getting-started/arduino-library-installation/antares-wi-fi-http "mention")
{% endhint %}

4. DHT11 Library. This documentation uses **DHT11 Sensor Library version 1.4.4.**

{% hint style="info" %}
If you have not installed the **DHT11 Sensor Library version 1.4.4.** you can follow the steps in the following link.

[dht11-sensor-library](https://docs.antares.id/en/getting-started/arduino-library-installation/dht11-sensor-library "mention")
{% endhint %}

5. SSD1306 OLED Library. This documentation uses **Adafruit SSD1306 by Adafruit version 2.5.7.**

{% hint style="info" %}
If you have not installed the **Adafruit SSD1306 by Adafruit library version 2.5.7.** you can follow the steps in the following link.

[adafruit-ssd1306](https://docs.antares.id/en/getting-started/arduino-library-installation/adafruit-ssd1306 "mention")
{% endhint %}

6. Postman Software

{% hint style="info" %}
If you have not installed **POSTMAN Software**, you can follow the steps in the following link.

[postman-installation](https://docs.antares.id/en/getting-started/software-installation/postman-installation "mention")
{% endhint %}

## Follow These Steps

### 1. Launch the Arduino IDE application

### 2. Opening Sample Programme

{% hint style="info" %}
You can open the programme code in the Arduino IDE via **File > Examples > Antares ESP HTTP > Lynx32-Simple-Project > GET\_DATA\_OLED.**
{% endhint %}

The following is the **GET\_DATA\_OLED** example programme code.

```arduino
#include <AntaresESPHTTP.h>
#include <Adafruit_SSD1306.h> // Include the OLED library

#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);

#define SCREEN_WIDTH 128
#define SCREEN_HEIGHT 64
#define OLED_RESET -1 // Change this if your OLED module has a different reset pin

Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, OLED_RESET); // Create an OLED display object

void setup() {
  Serial.begin(115200);
  antares.setDebug(true);
  antares.wifiConnection(WIFISSID, PASSWORD);

  // Initialize the OLED display
  if (!display.begin(SSD1306_SWITCHCAPVCC, 0x3C)) {
    Serial.println(F("SSD1306 allocation failed"));
    for (;;)
      ;
  }

  // Clear the buffer and display the initial message
  display.clearDisplay();
  display.setTextSize(1);
  display.setTextColor(SSD1306_WHITE);
  display.setCursor(0, 0);
  display.println("Hallo Test");
  display.display();
  delay(2000); // Display the message for 2 seconds
}

void loop() {
   if (millis() - previousMillis > interval) {
    previousMillis = millis();
    
  // Get the latest data from your Antares device
  antares.get(projectName, deviceName);

  // Check if we're actually getting data
  if(antares.getSuccess()) {
  String test = antares.getString("Test");
  
  // Update the OLED display
  Serial.println("Received : " + test);
  display.clearDisplay();
  display.setTextSize(1);
  display.setTextColor(SSD1306_WHITE);
  display.setCursor(0, 0);
  display.println("Received:" + test);
  display.display();
  }
  
  }
}

```

### 3. Set Wi-Fi Credential and Antares Credential in Program Code

Change the HTTP Protocol parameters in the following variables **\*ACCESSKEY, \*WIFISSID, \*PASSWORD, \*projectName**, and **\*deviceName**. Adjust to the parameters in the Antares console.

```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" %}
The **\*Access key** parameter is obtained from your Antares account page.
{% endhint %}

<figure><img src="https://3873791589-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F7cujmJ5QHdJaAjH815aZ%2Fuploads%2FEKQ5bACMicBSXyZs30ue%2Fimage.png?alt=media&#x26;token=eb1b0e26-385c-43ca-a343-c704b6c2c2a0" alt=""><figcaption><p>Access Key Location on Antares Account Page</p></figcaption></figure>

{% hint style="info" %}
The **WIFISSID** parameter is obtained from the name of the **Wifi / Hotspot** that is currently being used by you. for example in the image below.
{% endhint %}

<figure><img src="https://content.gitbook.com/content/7cujmJ5QHdJaAjH815aZ/blobs/bIlKGKW229zwoNlnYMYB/3_wifi.png" alt=""><figcaption><p>WIFISSID</p></figcaption></figure>

{% hint style="info" %}
The **\*PASSWORD** parameter is obtained from the **WiFi password** you are currently using.
{% endhint %}

{% hint style="info" %}
The parameters **\*projectName** and **\*deviceName** are obtained from the **Application Name** and **Device Name** that have been created in the Antares account.
{% endhint %}

<figure><img src="https://content.gitbook.com/content/7cujmJ5QHdJaAjH815aZ/blobs/1Zmcpg4nM3Izep1LTkTA/LYNX%2032%20APP.png" alt=""><figcaption><p>Application Name Display</p></figcaption></figure>

<figure><img src="https://content.gitbook.com/content/7cujmJ5QHdJaAjH815aZ/blobs/UxuGDSRjVBdE9maMqmji/ANTARES%20SHIELD%20DEVICE.png" alt=""><figcaption><p> Device Name Display</p></figcaption></figure>

### 4. Compile and Upload Program

Connect the **Lynx-32** with your computer and make sure the **Communication Port** is read.

{% hint style="info" %}
On Windows operating systems the check can be done via **Device Manager**. If your **Lynx-32** is read then the **USB-Serial CH340** appears with the port adjusting the port availability (in this case it reads **COM4**).
{% endhint %}

<figure><img src="https://content.gitbook.com/content/7cujmJ5QHdJaAjH815aZ/blobs/CWu5eRMDMqMP3oqsPm02/5_devman.PNG" alt=""><figcaption><p> Device Manager Disp;ay</p></figcaption></figure>

Set up the **ESP32** board by clicking **Tools > Board > esp32** in the Arduino IDE, then make sure the **ESP32 Dev Module** is used. Select the port according to the communication port that is read (in this case COM4). The result will look like the following image.

<figure><img src="https://content.gitbook.com/content/7cujmJ5QHdJaAjH815aZ/blobs/nyqevPXm3piB0e44qA3Z/6_port.png" alt="" width="464"><figcaption><p>Display of Board Specifications and Ports Used</p></figcaption></figure>

After all the setup is complete, upload the programme by pressing the arrow icon as shown below. Wait for the compile and upload process to finish

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

{% hint style="info" %}
**The Tick icon** on the Arduino IDE is just the verify process. Usually used to **compile** the programme to find out whether there are errors or not.&#x20;

**The Arrow** icon on the Arduino IDE is the verify and upload process. Usually used to **Compile** the programme as well as **Flash the programme** to the target board.
{% endhint %}

If the programme upload is successful, it will look like the following image.

<figure><img src="https://content.gitbook.com/content/7cujmJ5QHdJaAjH815aZ/blobs/YdcJoVvAnawS5hwHl9kR/8_done.PNG" alt=""><figcaption><p>Arduino IDE page image after successful upload.</p></figcaption></figure>

After uploading the programme, you can view the **serial monitor** to debug the programme. The **serial monitor** icon is shown in the following image.

<figure><img src="https://content.gitbook.com/content/7cujmJ5QHdJaAjH815aZ/blobs/C4QivGz46rR7vf2shpbe/9_serialikon.png" alt=""><figcaption><p> Serial Monitor Icon</p></figcaption></figure>

Set the **serial baud rate** to 115200 and select BothNL & CR. The result will look like the following image.

<figure><img src="https://content.gitbook.com/content/7cujmJ5QHdJaAjH815aZ/blobs/O5FnhfkPpqGitNMTY5RW/10_serialmon.png" alt=""><figcaption><p>Serial Monitor Display</p></figcaption></figure>

{% hint style="danger" %}
Make sure the **serial baud rate** matches the value defined in the programme code. If the serial baud rate is not the same between t**he programme code** and **the serial monitor**, the ASCII characters will not be read properly.
{% endhint %}

### 5. POSTMAN Software Setup

In this step you need POSTMAN software, you can input the **end-point, request header** and **request** body first by following the following format.

**End Point**&#x20;

<table data-header-hidden><thead><tr><th width="134.5"></th><th></th></tr></thead><tbody><tr><td><strong>Method</strong></td><td>POST</td></tr><tr><td><strong>URL</strong></td><td>https://platform.antares.id:8443/~/antares-cse/antares-id/<mark style="color:red;">your-application-name/your-device-name</mark></td></tr></tbody></table>

{% hint style="info" %}
Customise <mark style="color:red;">your-application-name</mark> and <mark style="color:red;">your-device-name</mark> to the names registered to your Antares account.
{% endhint %}

**Request Header**

<table data-header-hidden><thead><tr><th width="134.5"></th><th></th></tr></thead><tbody><tr><td><strong>Key</strong></td><td><strong>Value</strong></td></tr><tr><td>X-M2M-Origin</td><td><mark style="color:red;">your-access-key</mark></td></tr><tr><td>Content-Type</td><td>application/json;ty=4</td></tr><tr><td>Accept</td><td>application/json</td></tr></tbody></table>

{% hint style="info" %}
Customise <mark style="color:red;">your-access-key</mark> with your Antares account access key.
{% endhint %}

The result will be as shown below.

<figure><img src="https://content.gitbook.com/content/7cujmJ5QHdJaAjH815aZ/blobs/7p87ee4RDHN5micRaC2h/POSTMAN%201.png" alt=""><figcaption><p>Image of end-point and header settings in POSTMAN software.</p></figcaption></figure>

Next, you need to input the request body by following the following format.

**Request Body**

```json
{
  "m2m:cin": {
    "con": "{\"key1\":\"integer-value\", \"key2\":\"string-value\", \"keyN\":\"valueN\"}"
  }
}
```

In the POSTMAN software, select the **Body** tab then select **raw** and enter the payload according to the request body you want to use as shown below.

<figure><img src="https://content.gitbook.com/content/7cujmJ5QHdJaAjH815aZ/blobs/gCm9rHiAXIzQI32ZKM3I/POSTMAN2.png" alt=""><figcaption><p>Image of the contents of the payload request body in POSTMAN software.</p></figcaption></figure>

{% hint style="info" %}
Customise the contents of the "con" field according to the "key" and "value" you want to send.
{% endhint %}

### 6. Sending POSTMAN Messages to the Antares Server

After the POSTMAN software setup is complete, it's time to send the POST command. The "Test" field is filled with the string "Hallo" as the message to be sent via HTTP protocol to the Antares server.

```json
{
  "m2m:cin": {
    "con": "{\"Test\":\"Hallo\"}"
  }
}
```

If you have finished filling in the "Test" field, then press the **Send** button on the POSTMAN software. Looks like the following picture.

<figure><img src="https://content.gitbook.com/content/7cujmJ5QHdJaAjH815aZ/blobs/3pNQFLNfu8VhBuVIdyTa/POSTMAN3.png" alt=""><figcaption><p>Image of API hit response in POSTMAN software.</p></figcaption></figure>

### 7. Check Data in Antares

After uploading the programme successfully, then open the device antares page and see if the data has been successfully sent.

<figure><img src="https://3873791589-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F7cujmJ5QHdJaAjH815aZ%2Fuploads%2FBGO3TMGe0eDtiTDFFslF%2Fimage.png?alt=media&#x26;token=304dff01-b0f6-4e46-aaed-2dcda8249b33" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3873791589-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F7cujmJ5QHdJaAjH815aZ%2Fuploads%2FMlEuNcb7I1BJcYHXsEFN%2Fimage.png?alt=media&#x26;token=ec75598a-3b23-443a-9b30-fc45d0ff0331" alt=""><figcaption><p>Image of the Antares Console Page When Data is Successfully Received</p></figcaption></figure>

{% hint style="info" %}
Data received by **ESP8266** with HTTP protocol in the form of Test variable.
{% endhint %}

### 8. Viewing Get Messages

Get data from the **Antares IoT Platform** and display it on the OLED display after connecting to Wi-Fi is shown in the figure below:

<figure><img src="https://content.gitbook.com/content/7cujmJ5QHdJaAjH815aZ/blobs/nwZItdWZOU5iVQnBI3b3/hasil.jpg" alt=""><figcaption><p>OLED Display</p></figcaption></figure>