Tomorrow.io's Resilience Platform is Here. Learn More.

X

Can I Fetch Weather Forecasts Using APIs?

Get real-time forecasting data by adding a weather forecast to your weather API. Learn how to integrate a weather forecast API into JavaScript.

Filip Dimkovski
By Filip Dimkovski
Janet Barben Bio
Edited by Janet Barben

Updated February 4, 2024.

The integration of weather APIs has revolutionized how we plan, respond, and adapt to weather conditions. So, can we use weather APIs to fetch weather forecasts? The short answer is yes.

Modern services allow real-time access to weather forecast APIs, offering an array of data that was once accessible only to meteorologists. In this article, we will explore the utility of weather APIs for fetching weather forecasts, focusing on their features, integration, and the data they provide.



What Does a Weather Forecast API Offer

Weather Forecast APIs, such as those provided by Tomorrow.io, offer a comprehensive range of meteorological data, including cloud base, cloud ceiling, humidity, visibility, and much more. They can also provide advanced forecasts, including hyper-local weather conditions, severe weather alerts, and even long-term climate patterns.

The wealth of the data available through these APIs means that users can obtain forecasts tailored to specific locations and times, making the data highly relevant and actionable. Now, let's look at how to integrate a weather forecast API in JavaScript.

Integrating a Weather Forecast API In JavaScript

Integrating a weather forecast API into a JavaScript application involves several key steps. You must first create a file with the `.js` file extension, such as `weather-forecast.js`, for example. Then, using JavaScript, you can make a request to the API endpoint with the code below:

const options = {method: 'GET', headers: {accept: 'application/json'}};

fetch('https://api.tomorrow.io/v4/weather/forecast?
location=new%20york&apikey=YOUR_API_KEY')
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error('Error:', error));

Of course, remember to replace the YOUR_API_KEY field with your API key. You can find your API key in the API Management Section after creating an account with Tomorrow.io

Analyzing the Output

Let's take a quick look at a shortened version of the output:

{
  "timelines": {
    "minutely": [
      {
        "time": "2024-01-16T18:22:00Z",
        "values": {
          "cloudBase": 0.22,
          "cloudCeiling": 0.22,
          "cloudCover": 100,
          "dewPoint": -1.19,
          "freezingRainIntensity": 0.77,
          "humidity": 87,
          "precipitationProbability": 50,
          "pressureSurfaceLevel": 1005.26,
          "rainIntensity": 0,
          "sleetIntensity": 0,
          "snowIntensity": 0,
          "temperature": 0.81,
          "temperatureApparent": -2.85,
          "uvHealthConcern": 0,
          "uvIndex": 0,
          "visibility": 14.36,
          "weatherCode": 6200,
          "windDirection": 16.19,
          "windGust": 5.63,
          "windSpeed": 3.38
        }
      },
      {
        "time": "2024-01-16T18:23:00Z",
        "values": {
          "cloudBase": 0.22,
          "cloudCeiling": 0.22,
          "cloudCover": 100,
          "dewPoint": -1.27,
          "freezingRainIntensity": 0.77,
          "humidity": 86.86,
          "precipitationProbability": 50,
          "pressureSurfaceLevel": 1005.24,
          "rainIntensity": 0,
          "sleetIntensity": 0,
          "snowIntensity": 0,
          "temperature": 0.75,
          "temperatureApparent": -2.95,
          "uvHealthConcern": 0,
          "uvIndex": 0,
          "visibility": 14.3,
          "weatherCode": 6200,
          "windDirection": 16.19,
          "windGust": 5.67,
          "windSpeed": 3.41
        }
      },

As we can see, this shortened output contains detailed minute data, showcasing weather data for timestamped entries.

However, please remember that JavaScript often shows an `[Object]` output instead of the actual content of complex nested objects. To view these objects and their values, you need to access them specifically or convert them to a format that can be easily displayed. Here's another version of the code above you can try:

const options = {method: 'GET', headers: {accept: 'application/json'}};
fetch('https://api.tomorrow.io/v4/weather/forecast?location=new%20york&apikey=YOUR_API_KEY', options)
  .then(response => response.json())
  .then(response => 
    {
        response.timelines.minutely.forEach((minute) => {
            console.log(minute.values)
        })
    })
  .catch(err => console.error(err));

Summary

All in all, the use of modern APIs to fetch weather forecasts represents a significant advancement in how we access and utilize weather data. With the ability to integrate real-time weather data into apps, developers, and businesses can make more informed decisions tailored to the specific needs of their users and operations.