Build a prompt which allows customer notifications via text message using the Vonage SMS API
Speaker 0: Vonage is a cloud communication platform that lets you integrate messaging, voice, and video into your applications. And today on Quick Connect, we're going to set up a system that will allow us to send messages directly to users from an item page. So let's get started. On the Vonage side, you're going to need a couple of things. Firstly, you're going to need a Vonage API account.
And with that account, you will get an API key and an API secret, which we're going to need in a moment. You're also going to need a phone number from the Vonage programmable numbers product line. So you can go ahead, grab a new number straight here in the dashboard, and make sure that that number has the SMS feature enabled. Now that's everything we need over here, so take note of your API key, secret, and the phone number, and then head over to your director's project. Before we build out this connection to Vonage, I wanna just take a note that I've created this orders collection.
And in that orders collection, there is a phone field. That will be the user that that will be the phone number that receives the our text message. Let's go and create a new flow here, and we will call this send SMS. And we'll go ahead and set this based on a manual trigger. We'll do it on just the orders collection, and it will require a confirmation dialogue.
So this is like a pop up box that can collect more information before triggering the flow so we'll call this one message text text we'll make it a text box and hit save. So we'll get to see what that confirmation dialogue does. Let's go back to our order, and we see here in the sidebar, there's now a send SMS button. This is the confirmation dialogue. So let's write a message, hello, world, bedtime lucky world, and we'll run flow on current item.
Let's go back to the flow and make sure that's worked. We see over here, there's a one on the log, So let's drop that down, and we get to see here in the payload is, inside of the body of the payload, the text that we entered in the box and the ID of the order. So now we're gonna go ahead and do something with this. Now you'll notice we have the key for the order, but what we don't have is the actual phone number, the actual contents itself. And this is actually all that's passed when you do a manual, manual triggered flow.
So let's go ahead and grab the whole record to make sure we have the phone number. So let's call this get order get order, and we are going to set that to read data. So let's go ahead and set this to full access, get the orders collection. And what we'll do here is we will get a dynamic value from the trigger. So trigger trigger dot body dot keys, and we just want the first item there.
So let's hit save. Save again. And with every step, we're gonna make sure this this works. So let's go back to our order. Let's run the flow again, and we'll head back to the flow.
And we see now there's a second log. So in get order, we now have the full record, including the phone number. Take note again that this operation has a key of get underscore order. Next, we're gonna go and actually send a text message. So let's call this one send message.
Send message. And we're going to do this by requesting a URL. Now I've taken a look at the Vonage API documentation ahead of time, so I can shortcut us a little bit here, which is that we, in order to send an SMS message, need to send a post request to this URL, res.nextmo.com/sms /json. Now there are a set of query parameters we require in order to make this successful. Firstly, we need to specify who's going to receive the text message.
So we have that and get underscore order because that's this operation here dot phone. Next, we need to say who are we sending this from. And so I've actually just copied and pasted my Vonage phone number that I showed you at the beginning. So to and from. Great.
Next is the actual message contents itself. So trigger dot body dot text. So that's what we inserted in the box. And then finally, we need to provide our API key and API secret here, which I'm just copying and pasting. API key and API secret.
So let's hit save now, save again, and let's go and retrigger this. Oh, hello to your phone. Run flow on current item. And, hopefully, now if I go over there you go. So this is just, this is just the messages app on on macOS piping the text message right here.
So that is a little example of how you can connect, Vonage and Directus in order to send SMS messages on demand. Now there are loads of ways you can achieve this. Here, we've used directors flows, and we've kind of hard coded some values inside of this request here. And you can also build custom operations in order to kind of abstract this away and make it a little bit easier so you don't have to provide all of these query parameters every time. And, of course, this doesn't have to be indirect as automate and flows.
It can be over in our insights dashboards, or it can be in a hook and so many other ways. But this is a little starting point to see how you can send SMS, messages, text messages using Vonage and Directus together. Hope you've enjoyed this episode of Quick Connect, and I'll see you in the next episode.