I have a static JSON data array under const airData that I am successfully loading into my main App Component by exporting airData. I am also using Fetch to pull data from an API and successfully logging that JSON data to the console.

.then(result => console.log(result))

As a beginner in React, I am stuck on how to take the JSON data from the external API and print it just like I have the airData static JSON elements.

Again I am pretty new to React. I come from the PHP world and I have been stuck for a couple days on this and any direction is appreciated.

The code is as follows (tokens and such hidden for privacy):

var myHeaders = new Headers();
myHeaders.append("Authorization", "Bearer xxxxxxxxxxxxxxxx");

var urlencoded = new URLSearchParams();
urlencoded.append("macAddress", "xxxxxxxxxxx");
urlencoded.append("mode", "minute");

var requestOptions = {
  method: 'POST',
  headers: myHeaders,
  body: urlencoded,
  redirect: 'follow'
};

fetch("MY_URL", requestOptions)
  .then(response => response.text())
  .then(result => console.log(result))
  .catch(error => console.log('error', error));

//Static data
const airData = [
    {
        "PM25":"1",
        "Temperature":"78.8",
        "RelativeHumidity":"53.2",
        "AirPressure":"1005.1",
        "TVOC":"63",
        "CO2":"942",
        "CO":"0",
        "Ozone":"7.9",
        "NO2":"11.3",
        "serialNumber":"xxxxxxxxxx",
        "VirusIndex":3,
        "Timestamp":1644967651,
        "DateTime":"2022-02-15 18:27"
    }
]

export default airData;