Prerequisites
Here is what you need to follow this tutorial and set up your messenger bot :
- Node.js
- npm (node package manager)
- Heroku Toolbelt
- Git
- A Facebook page
Install Node.js
One day, there was a guy named Ryan Dahl who had the brilliant idea of taking the V8 Javascript engine, it’s the one found in the Chrome browser, and using it outside the browser. He created the Node.js platform! It is an open source development platform for executing JavaScript code server-side. Node is useful for developing applications that require a persistent connection from the browser to the server and is often used for real-time applications such as chat, news feeds and web push notifications
Download node.js here: https://nodejs.org/en/download/
When your download and set up of Node.js are finished, make sure that Node.js is correctly installed on your machine by simply typing in your command prompt: node -v
If Node.js is installed you will see its version.
Install npm
npm is the package manager for the Node JavaScript platform. It puts modules in place so that node can find them, and manages dependency conflicts intelligently.
npm website: https://www.npmjs.com/
npm is distributed with Node.js which means that when you download Node.js, you automatically get npm installed on your computer. Make sure that npm is correctly installed on your machine by simply typing in your command prompt: npm -v
If npm is installed you will see its version
Install Heroku Toolbelt
Heroku is a cloud platform as a service (PaaS) supporting several programming languages. Heroku, one of the first cloud platforms, has been in development since June 2007, when it supported only the Ruby programming language, but now supports Java, Node.js, Scala, Clojure, Python, PHP, and Go.
Download Heroku Toolbelt here: https://nodejs.org/en/download/
Make sure that Heroku Toolbelt is correctly installed on your machine by simply typing in your command prompt: heroku -v
If Heroku is installed you will see its version.
Install Git
Git is a distributed version-control system for tracking changes in source code during software development. It is designed for coordinating work among programmers, but it can be used to track changes in any set of files. Its goals include speed, data integrity, and support for distributed, non-linear workflows.
Download Git here: https://git-scm.com/downloads
Make sure that Git is correctly installed on your machine by simply typing in your command prompt: git --version
If git is installed you will see its version.
Initialize your local environment
Now that we have all the necessary tools, let’s create our local environment. Start by opening a new command prompt.
- Go to the directory of your choice, in this example I go to my desktop:
cd C:\Users\myUserName\desktop
2. Create a new folder and give it the name of your bot
mkdir myMessengerBot
3. Go to your Facebook Messenger bot folder
cd myMessengerBot
4. Set up your heroku account with your Facebook Messenger bot folder
heroku login
5. Update npm
npm install npm --global
6. Initialize npm
When I leave the fields empty it is because you are not required to put something in them
npm initname: myMessengerBot
version: 1.0.0
description:
entry point: index.js
test command:
git repository:
keywords:
author: yourName
license: MIT
Now, if you have configured your folder with npm correctly, you will be able to see package.json in your myMessengerBot folder there.
7. Install Node.js modules
npm install express request $ body-parser —save
8. Download the Javascript code needed
FacebookBot-master.ziphttps://codeload.github.com/elmehdimobi/FacebookBot/zip/masterThanks to El Mehdi LAIDOUNI for the code.
And put it on your desktop. You now have these two folders on your desktop:
- myMessengerBot
- FacebookBot-master.zip
9. Now, unzip the FacebookBot-master.zip file.
10. Copy and paste these two files from the unzip fodler to your myMessenger bot folder:
- Procfile
- index.js
Now, we are here, your local environment myMessengerBot is ready
Configure your Facebook developer account
Now that our local environment is ready, let’s configure our developer facebook account.
- Go to the Facebook developers website
- Create a new app (click on “Add a new app”)
- Go to “Messenger” section and clikc on “Get started” button
- In the “Access token” section, select your Facebook page
- Copy your token
- Paste it in your index.js file at the right place:
var token = "entrez votre token ici"
Translation: “entrez votre token ici” = “enter your token here”
Configure your Heroku account
Now that our local environment is ready and our facebook developer account is ready too, let’s configure our heroku account.
- Go to myMessengerBot folder on your desktop and open a cmd
- Initialize git
git init
- Create your app (bot) on heroku by enter your app name
heroku create myMessengerBot
So you will get the callback URL of your application, which you can copy now in your clipboard, it looks like:
Callback URL:
- Now, if you go to Heroku dashboard, you will see your app
https://dashboard.heroku.com/apps
- Before continuing, make a first commit to heroku to initialize your application
git add .
git commit -am "your message"
git push heroku master
Link Heroku with Facebook
- Go back to your facebook developer dashboard
- Click on your app
- Go to the “Messenger” tab
- Click on “Settings”
- Go to “webhooks” section
- Click on “Edit events”
- Fill in the fields
Callback URL:Check the token: Bot_Messenger_App
Tick all
Setup completed!!
You now have the possibility to modify the index.js file as you wish.
Ressources
Messenger platform:
Heroku documentation: https://devcenter.heroku.com/categories/reference
2
2 claps
WRITTEN BY
Arthur Pace
Follow
