DEV Community

Cover image for Build a bot for second helpings over the holidays πŸ¦ƒπŸ€–
Kimberlee Johnson
Kimberlee Johnson

Posted on • Edited on

Build a bot for second helpings over the holidays πŸ¦ƒπŸ€–

I'm not going home for the holidays for the first time in half a decade. Nonetheless, the past few weeks have still involved a lot of familiar agonizing from friends, colleagues, and internet strangers, things like:

  • "What do I say when someone asks me why I'm still single...again?"
  • "How do I handle my uncle when he's being offensive?"
  • "No, but really, how will I make it through the holidays?"

For many of us, it'll be a "Hard Candy Christmas" indeed.

After one of my recent daily doses of Dolly's holiday classic, I remembered that my friend Chloe Condon built a chatbot that answers questions specifically about wine. I decided to program one to respond to holiday-related SOS SMS, for when those chestnuts are really roasting on that open fire.

This post will walk you through how to use Azure tools to build an AI-powered chatbot, and how to connect that bot to Twilio. Before we get started, you'll want to set up an Azure and a Twilio account, if you don't already have them.

When you have those things, we're ready to gobble wobble.

Pug in a Turkey costume

Create a Knowledge Base and QnA Service

Head over to the QnA Maker portal, and Sign in with your Azure credentials. Click Create a knowledge base in the top-left navigation, and open it in a new tab. The Knowledge Base will hold our library of questions and answers.

Create a Knowledge Base in the navbar

Once you're there, open another new tab via the Create a QnA service button. If our Knowledge Base hosts our questions, then the QnA service is what hosts our Knowledge Base, determining a whole bunch of details like its region and billing and performance.

You'll want to give the QnA Service the following details:

πŸ¦ƒ A unique name for the Service.
πŸ¦ƒ Your Azure Subscription, which in this case is most likely Free Trial.
πŸ¦ƒ F0 is the tier you want -- F for Free!
πŸ¦ƒ Create a Resource Group called LearnRG.
πŸ¦ƒ Pick your closest region for this Service, which for me means West US.
πŸ¦ƒ F is the tier again here.
πŸ¦ƒ Repeat the same location you used above.
πŸ¦ƒ Your app name should have auto-populated and have a green checkmark next to it.
πŸ¦ƒ Your website location should match the region you picked for this Service.

πŸ›‘ Disable App Insights.
πŸ‘ Click Create!

Take a break, grab a snack, and make sure you've put on your Thanksgiving pants so you're ready when your QnA Service is deployed in a few.

Gif from friends with Joey in stretchy pants

Connect your Knowledge Base to your QnA Service

Head back to the QnA Maker, and refresh the page. Scroll down to Step 2, where you'll now be able to populate all the information about the QnA Service you just deployed.

Name your KB anything you like. I'm going with 'HolidayHelper'.

Now we're at the fun part: putting the K(nowledge) in our KB. Instead of briefing the bot on the nuances of family dynamics over the holidays, we can just upload a .pdf .tsv, .doc, .docx, or even .xlsx with questions and answers.

If you want to use mine, you can find those here, or you can write one tailored to your holiday season's own unique quirks.

Family photo with leg lamp

Once you've got your questions ready, scroll to Step 4 and upload them through the Add file button. Next, you can pick any personality style you like for your chatbot. Caring is really meeting my needs right now, but pick what suits your fancy. These personalities add some auto-generated questions and answers to your Knowledge Base.

With that, click Create your KB.

Chevy Chase lighting Christmas lights

Now, you should be on the Edit page. You may have to do a bit of cleanup, removing typos and making sure your question and answer pairs look the way you want. Once all looks good, click Save and Train to record any changes, then Test in the upper right corner to see how your bot is doing. Ask it a couple questions, and see if the answers pop up in the chat window as you expect.

If all looks good, you're ready to click Publish.

In a few minutes, you should see a note praising your success and letting you know what your Knowledge Base's endpoints are. Now, you're ready to integrate with your bot.

Integrate your Knowledge Base with your bot

On the Success page, click Create Bot. This opens the Azure portal, where you'll fill out some info about your bot:

πŸ¦ƒ Give your bot a name.
πŸ¦ƒ Use the same subscription as before (probably Free Trial).
πŸ¦ƒ Select the Resource Group you created before (probably LearnRG).
πŸ¦ƒ Same location as the last time!
πŸ¦ƒ F0 pricing tier.
πŸ¦ƒ App name should auto-populate.
πŸ¦ƒ I'm going with Node as my SDK language, but it shouldn't matter.
πŸ¦ƒ Leave the remaining fields as they are (except for Application Insights, I'm turning that off).

Now, click Create! Grab some more stuffing; your bot should be ready in a few minutes.

When you see the notification that your bot is live, click it, and then click Go to resource. On the lefthand menu, under Bot Management, select Test in Web Chat. Ask your bot the same questions as before, and make sure it's responding with the same answers. If anything looks off, you can head back to your Knowledge Base and edit it.

But, if all looks good, let's start having some fun with Twilio.

Set up Twilio to text your bot

If you haven't used Twilio yet, it provides a suite of APIs that make it possible to communicate within apps. You can use it for anything and everything: fake boyfriend apps, Mean Girls Day or ADHD med reminders, and even learning to program with TwilioQuest.

Turboman gif

Sign up here for an account if you don't have one. Once you have your account or are in your dashboard, create a new project. We're going to find a few things while we're here:

  • A Twilio phone number
  • Our Twilio Account Sid (like a username for our app)
  • Our Twilio Auth Token (like our app's password)

In the leftmost menu of the dashboard, click the Circle with "...", and head to Phone Numbers under Super Network. Click the red "+" circle to search and add a new number, making sure to select one that can at least handle SMS (the other capabilities and location don't really matter).

Now that we have our phone number we need to create our TwiML app so we can wire up our phone number for texting with our bot.

Select that same circle icon, then click Programmable SMS. From that dashboard click Tools, then TwiML App. Click the red "+" circle to add a new TwiML App. Give it a name, and add the Messaging Request URL: https://sms.botframework.com/api/sms (and, yes, it's an HTTP POST Request). Hit Save.

Navigate back to your new Phone Number. In its Settings, head to Messaging, Set the Configure With setting to TwiML App, and the TwiML App to whatever you named your app. Hit Save.

Alt Text

With that, we're ready to head back to our Azure Portal and wire up Twilio. From the portal, select Channels under Bot Management, and find the Twilio icon under More channels. Here, enter your Phone Number, then your Account Sid and Account Auth, which you can find in the Twilio Console for your project. Click Save, and test it out with a text.

Will Ferrell Buddy the Elf congrats

Congrats on building a bot! The QnA Maker is such an approachable, beginner-friendly tool for setting up a handy bot for any situation, whether you need to field questions on your website, seek out a virtual sommelier, or remind yourself how to handle the holidays.

If you have any questions or need a little extra help making it through this tutorial or the holiday season, I'm just a tweet away, or, you can text this bot at (202) 733-6081 πŸ˜˜πŸ¦ƒπŸ€–

Top comments (0)