Product
Docs
Resources
Log InSign Up
All Posts
Courier Live Header
COURIER LIVE

Courier Live: Controlling IoT using the Webhook Provider

Aydrian Howard

September 09, 2020

Riley Napier from our engineering team returned for our September 2nd Courier Live. Together we used the Courier Webhook Provider to send a notification using an unconventional channel, a BlinkStick Square.

Check out the video below to watch us:

  • Demo an application using a BlinkStick Square

  • Configure and add the Webhook Provider to an existing notification

  • Create an endpoint to accept and handle the Webhook Post from Courier

  • Send a test notification using the new Notification Designer Send tab

Be sure to Like the video and Subscribe to our YouTube channel.

Configuring the Webhook Provider

Courier allows for static and dynamic configuration of the Webhook Provider. By default, Courier sends a payload via POST or GET request to a specified url. For this project, we opted to use the dynamic configuration. This allowed us to specify destination configuration on a per recipient basis by supplying it in the webhook object in the recipient profile.

1 2 3 4 5 6 7 // Profile {   "webhook": {     "url": "https://blinkstick-server.herokuapp.com/api/courier",     "Method": "POST"  // optional: defaults to POST   } }

You can learn more about Dynamic Destination configuration in the Courier Docs.

Accepting the POST

The url supplied to the destination configuration needs to accept a POST and return a status code of 200. If Courier doesn't receive a 200 response, it will attempt to retry the POST. For our project, we used a Next.js application deployed to Heroku. To create our route, we added a courier.js file to the /pages/api directory.

1 2 3 4 5 6 7 8 9 // /pages/api/courier.js export default (req, res) => {   if (req.method === "POST") {     req.context.io.emit("alert", req.body);     res.status(200).send("ok");   } else {     res.satus(405).send();   } };

This results in a route that will accept a request and emit an alert event using Socket.io if the request method is a post. You can find the full blinkstick-server code on GitHub.

Handling the alert

Now that the webhook has been accepted and an event has been emitted, the client needs to handle it. Our client is a simple Node.js application running locally on the machine connected to the BlinkStink Square. We use the Socket.io Client to connect to the server running in Heroku. We can handle the alert event by adding the following listener.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 const io = require("socket.io-client"); const blinkstick = require("blinkstick"); const player = require("play-sound")(); const device = blinkstick.findFirst(); const socket = io("https://blinkstick-server.herokuapp.com/"); socket.on("alert", (data) => {   console.log(data);   device.morph("red", function () {     device.morph("orange", function () {       device.morph("yellow", function () {         device.morph("green", function () {           device.morph("blue", function () {             device.morph("purple", function () {               device.morph("#000000");             });           });         });       });     });   });   player.play("./media/youve-got-mail.mp3", (err) => {     if (err) console.log(`Could not play sound: ${err}`);   }); });

The listener uses the BlinkStick Node.js module to make the Square transition through all the colors of the rainbow. And then for added fun, we used the play-sound package to play a sound through the connect computer's speakers. You can find the full blinkstick-client code on GitHub.

Webhook IoT Success GIF

Now this is just a simple exercise of how Courier can trigger an IoT device. There's so much more that can be done. You could use the data being passed in the webhook payload. You could have this running on a Raspberry Pi. The only limit is your imagination (and maybe your pocketbook). Definitely sign up for a free Courier Account and let us know what you create. 

Is there something you’d like to see us do using Courier? Let us know and it might be the subject of our next Courier Live. We stream a new Courier Live every Wednesday at noon Pacific. Follow us on Twitch to be notified when we go live.

-Aydrian

More from Courier Live

April 2021 Courier Live Release Notes Thumbnail
COURIER LIVENEWS & UPDATES

Courier April Product Release Updates: In-app Inbox, Preferences, and Automations

In this update, Aydrian and Nate (Head of Customer Success) as cohosts cover what is new with the in-app notifications API, our new preferences component, and our automations API, which is now GA.

Aydrian Howard

Aydrian Howard

May 20, 2021

Courier Live Thumbnail
COURIER LIVE

Courier Live: Content, Notifications, and IoT

On February 2nd and 3rd, Shy Ruparel joined Aydrian for another Courier and Contentful crossover stream. This time, they decided to play around with an IoT E-ink display and use it to show the latest posts from Contentful and send notifications using Courier.

Aydrian Howard

Aydrian Howard

February 10, 2021

Build your first notification in minutes

Send up to 10,000 notifications every month, for free.

Email & push notification

Build your first notification in minutes

Send up to 10,000 notifications every month, for free.

Email & push notification

Product

Pricing

Providers

Developers

Documentation

API

Libraries

Status

© 2022 Courier. All rights reserved.