Build A Weather By SMS Service With Twilio and NodeJS
Bots are rising and today we’ll build a service that sends weather forecasts of any city by SMS. Twilio provides a set of messaging, voice, video and authentication API’s. We are going to use their Programmable SMS API to build a weather by text service.
If you’re in the US you can test our demo now by sending an SMS to this Twilio number +1 628 600 1473, with the name of a city (e.g. “New York”). You can also get a full week forecast by typing “forecast” after the name of the city (e.g. “New York forecast”).
Our service will work in the following steps :
- A user sends an SMS to a number provided by Twilio that will pass a city name into our Stamplay backend.
- A Stamplay Flow will catch the SMS using the Twilio integration and pass it to a custom Code Block.
- Our custom Code Block will fetch weather data for a city, then assemble a response message from the data, and output the message.
- Another Stamplay Flow will execute once the Code Block execution is complete, and using the output to respond to the intial SMS number with the weather data for that day.
You Will Need
1. Getting Started
First we need to initialize a Code Block within Stamplay. Code Blocks are custom RESTful endpoints within our Stamplay application.
Create a new one by selecting Code Blocks on the left hand side and entering a name for our Code Block. Let’s call it weather.
Our new Code Block should look like the picture below.
For now we will Save it as is and edit it later.
2. On New SMS, Retrieve Weather Data
Go to Flows and let’s create a new Flow that On new SMS, run a code block as you can see in the following images:
Go to Twilio and navigate to your Console Dashboard to get your API credentials, your AccountSID and AuthToken. You can find them here.
Head back to your Stamplay Flow and enter your Twilio account credentials to connect to the Twilio API.
In the next step, select a Phone Number from the dropdown you wish to trigger this Flow when the number selected receives an SMS.
When you created a Twilio account, a Twilio number should have been created for you. You can see your numbers here. If you do not have one, then add one.
Below the dropdown where we selected the Twilio number, copy the input field containing the callback url, and head over to your Twilio phone numbers page.
Select the number you used to trigger the Flow in Stamplay.
Then in the add the callback url into the Webhook input:
Now back in Stamplay, we need to finish our Flow setup.
Select Add Action.
Select Code Block from the dropdown, and check the box labeled “Run Code”.
We will pass in the phone number that sent the original text as the to property on the JSON object as we will use this number after the Code Block executes to send a message back. The body property is the city name and if present the forecast option which we will explain later once we get to our Code Block.
Next, name your Flow and head over to Code Block to start editing ‘weather’.
Get Giuliano Iacobelli’s stories in your inbox
Join Medium for free to get updates from this writer.
3. Get weather data via Code Block
Inside our Code Block we first require any npm packages we are going to use.
Next we need to add our API key from http://openweathermap.org/, where we will be pulling our data from.
The type variable inside our Code Block is used to check whether the forecast option has been passed in. What this means is that apart from a city name if our user passed in forecast at the end, we will send them a 5 day forecast instead of just the current weather for the city.
When we assemble our query string for our API request, we will pass in the city name as the q param, our API Key as the APPID parameter, and the unit type we want our information displayed; I have chosen imperial, but metric is available as well.
The if block determines which request to run. Inside the intial if, if the type equals weather we will fetch data for the current weather in a city.
To see all available data on the JSON response for our current weather data request, you can see all the options here.
Otherwise, if the type is forecast we run the else block. Our request retrieves a 5 day forecast which we will loop through and concatenate a readable message to send back to our user. You’ll notice we are iterating by 8. This is because within the forecast, they will return forecasts for every 3 hours of a day giving us 8 blocks in a day. To be concise, we’ve elected to only send the first 3 block of each day.
Once we’ve formatted our response, we output the weekly data as the body property, and to property.
These two properties, whichever block is run will be used in the next Flow triggered by the completion of this Code Block.
Go to Flows and let’s create a new Flow that On Code Block executed, Twilio send message as you can see in the following images
Select Add Action.
Select Twilio from the dropdown, and check the box labeled “Send message”.
Set the Message to send as the body property from our Code Block output, and the To field as the to property from our Code Block output.
Select the Twilio number that you want to send the message with.
Assign the Flow a name and Save. And now we can test our service!
4. Testing Our Weather By Text Service
To test our service, we simply need to text our Twilio number from a verified number in Twilio.
To verify a number visit, https://www.twilio.com/user/account/phone-numbers/verified to add one.
Once verified send a city name to your Twilio number and you should receive a response text within several seconds.
Current Weather
5 Day Forecast
There we have it, we now can get the current weather, and forecast via text!
With Twilio we were able to very quickly, and easily integrate SMS capabilities and hook into our Stamplay Flow system to provide value to our users.
Among other APIs Twilio provides, you can use Stamplay and Twilio together to create robust dynamic application quickly!
Try another Twilio API, build another app with Stamplay and Twilio!
