Building a TechCrunch bot clone using Botpress (Part 2)
Okay. So this is the second part of our tutorial series. Here, we are going to set up our Facebook Messenger bot.
Open your text editor to the project we created in the previous tutorial. You’d see an index.js in the root of project. Just like every other Nodejs apps, index.js is the entry point for your app. Let’s say we want to set up webpack/babel to transpile our code into ES5, this is to be our entry point.
Okay, we still have a long way to go, so I’ll skip the tales. We are building a Facebook Messenger bot, hence we have to set up the necessary things we need. First, we install the botpress-messenger module. This module is developed and maintained by the Botpress team. You can install via the web interface, or via the command line directly. I personally prefer the latter.
First, go to your terminal and type: bp start
Open your browser, and go to: localhost:3000
Of course, Botpress loves you. :). Okay, what you are seeing is simply where the magic (okay, maybe not) happens. Here is where you control whatever you want to control in your bot. You can set broadcasts, see analytics, etc.
So simply click on Facebook Messenger
You can see that it is installing, as reflected on the terminal. After installing, Botpress is going to restart. Then you’d see the option for Messenger on the dashboard.
We have to fill the necessary info. When you check the root of your project, you’d see that a botpress-messenger.config.yml file has been created. This is where we fill the details of our Facebook Messenger app. You’d see what I am talking about as I go on.
So we need Our Facebook messenger app ID, access_token, etc. Lets get to that. First, go to Facebook. Then, create a new page. Note the Page ID please. After that, head to the Developers’ website. Create a new App. There you’d grab your ID and access token.
Above, you can see that we have created a new app. You select Messenger (the first option, after your app has been successfully created). This means we want to build our app on the messenger platform.
We want to get the access token for our app. Please make sure that the page you select is the page you just created. In my case, Techcrunch-clone
Go to the Dashboard. You’d see your APP ID and App secret. Copy and paste them into the config file. For obvious reasons, I won’t take a screenshot of these.
Now, for the hostname, we need to use a URL with https. Simply put, we cant develop using localhost alone. But dont worry, enter Ngrok!!
With ngrok, we can expose our local server and get a publicly available URL with https. Go to https://ngrok.com to see how to install it
Got to your terminal and whip up your ngrok server real quick!
Type: ngrok http 3000
Cool. Now, copy the URL. Paste into the botpress-messenger.config.yml file.
If all the steps have been thoroughly followed, start your bot now, using bp start
The next thing is you send a message to your Facebook page.
Click on the Get Started button.
Holy Sh*t! It is replying us! Congrats, you just built the most basic Facebook bot you can build straight out of the box on Botpress!
I know we are not digging deep into coding yet, but I am just trying my best to make sure that there is proper understanding before I move on to more complex things. I promise the next tutorial is going to be us coding. Cross me pirate mind! Be mark of words! ;) ;) :) :) :)
Until then, May the Bots be with you!