October 24

Use the AerisWeather JavaScript SDK’s NPM Module to Build a Travel Buddy

The AerisWeather Javascript SDK can solve weather-based problems all while steering clear of the troublesome tasks that go into styling a web page. This can be done using the SDK’s module which can be installed from the Yarn or NPM ecosystem. This tutorial will outline the steps required to use the JavaScript SDK’s NPM module and build a Travel Buddy along the way.

What is Travel Buddy?

Travel Buddy will help users understand what temperatures to expect during their next trip. By passing the location and date of travel, the application will query our API and provide some pertinent details that will prepare the user for mother nature. The expected output will look something like this:

Here’s what your Travel Buddy expects in Phoenix:

Average High: 71°F
Average Low: 48°F

Extreme High: 79°F
Extreme Low: 38°F

Initial Setup

Before getting started, there are some steps to take that will ensure a successful tutorial:

To setup the project and begin using the SDK, follow the steps below:

  1. Create new project locally and navigate to the root of your project 
  2. Initialize your project
  3. Install the AerisWeather JavaScript SDK
  4. Create a JavaScript file
  5. Open the file in your favorite IDE and include the library
  6. Set your client credentials using the constructor and assign that to a variable of your choice

Using the SDK

Now that we can access the SDK’s features with the variable, let’s build our request for weather data. You can add various parameters to your API query by chaining methods to the  method like so:

The first 2 methods include the endpoint and location where the variable comes from the user input. The argument being passed to the parameter is 15 days prior to the input date. Our  date is going to take a relative offset,  , which is relative to the value.  The method will take an integer to override the default number of periods (or days in this case) that will be returned. Listing out a applies to the number of stations returned which allows the application to iterate over multiple stations. Lastly, the method will reduce the output to only include the values needed. So far each of these methods represent a section of the API query via parameters, endpoint, or action. This translates into a query that would look like this:

Next, the method is used which will do precisely that, get the data. The response is conveniently stored in a Promise object which allows us to wait for the response before we evaluate the data further.

Application Logic

Once the data is ready for processing the result will be used to determine which station to use. This criteria is based on number of days returned in the summary which should be 30:

You’ll notice we are returning a Promise here as we will need to give the application time to iterate over the stations before we can move forward. Once the station has been selected, we can get ready to log the necessary weather data. In the next section we are formatting the location name, returning temperature data, and logging our results:

The  will return an object that contains an array of the highs and lows as well as a methods to help evaluate these metrics. These methods will identify averages as well as the min and max values:

Our date was also converted into last year minus 15 days which was accomplished with the following snippet:

The last bit of code will handle the arguments passed the script (location and date). Additionally, we have logic to ensure both of these values were sent and warning the user in case they were not included:

Putting all those pieces together will look something like this:

Using the Application

Once all the code is in place you will be able to run the application from the root of the project with a simple command . The destination variable needs to be in quotes in case your location has a space in the name as the script is ready to handle that. Additionally, the date will need to be the format mentioned above as this is a format the API expects.

Now that you’re well equipped with the tools and steps needed to use the NPM module, install the package today and build the next best weather app!

Not an AerisWeather customer? Sign up for a free trial of the Weather Data API and AMP, the Aeris Mapping Platform.

Share this post:

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.