Automating CI/CD with Webhooks: Netlify Deploys Using A Slack Bot
Tags: webhooks, devops, tutorial, showdev
Published: 2021-04-16 05:51:55

---
title: Automating CI/CD with Webhooks: Netlify Deploys Using A Slack Bot
published: true
description: 
tags: webhooks,devops,tutorial,showdev
cover_image: https://paper-attachments.dropbox.com/s_440FE2F2FC1166837D91A8D379AAF0BFB7C890B2B924CCD16A7050994D6149D6_1618514572590_Slack+automate+Netlify+Build.png
canonical_url: https://hookdeck.com/platforms/automating-netlify-deploys-using-a-slack-bot
---
I believe that everything that can be automated should be automated. That is why I decided to harness the power of webhooks and build a Slack bot, instead of going to my Netlify dashboard to trigger a deploy when I make a change to the code for my website. The Slack bot automates the triggering of new Netlify builds, which saves time and reduces the friction that comes with manually triggering Netlify deploys. In this post, I will help you along as you learn how to build out this service and automate your deploys.

After reading this post, you will learn how to :

- Build a Slack bot & configure Slack webhooks
- Configure Netlify Build Hooks

**Building The Slack Bot**
The Slack bot is crucial to this service. Once a user on our workspace mentions the bot, the goal is for it to trigger a Netlify deploy. To get started creating this feature, head over to the Slack API dashboard and create a new Slack app by clicking the “Create A Custom App” button at the top of the page. Next, write the name of the app in the Popup menu, select the workspace the bot will be associated with, and save. After creating the Slack app, it’s time to hook into Slack webhooks to receive notifications when your bot gets mentioned in a Slack channel! 

Before you can subscribe to a specific event, you need to provide Slack with a URL. This link is where Slack will send notifications when the event subscribed to is triggered. Slack also requires confirmation that you have control over the URL, and asks you to echo the challenge request parameter they send.

Below is an implementation of the logic of the web server that Slack will send webhook notifications to, written in NodeJS.
```JavaScript
    const express = require("express");
    const bodyParser = require("body-parser");
    const app = express();
    
    app.use(bodyParser.json());
    app.use(bodyParser.urlencoded({ extended: true }));
    
    app.post("/", async (req, res) => {
        const challenge = req.body.challenge
        res.send(challenge).status(200)
    });
    
    app.listen(3000, () => console.log(`App is running on port 3000`));
```
This server can then be deployed using a local tunneling tool like [Ngrok](https://dev.to/hookdeck/setting-up-ngrok-for-local-webhook-testing-3779) or Hookdeck CLI. After deploying the above server, you can continue to set up the Slack bot. In the home page of the Slack app we created above, navigate to the event subscriptions page and toggle the “Enable Events” button. Input the URL of the server created above as the value for the request URL field. Select the `app_mention` from the dropdown menu under the "Subscribe to Bot Events” tab. 

The last step in setting up Slack is installing the Slack bot we just configured to our Slack workspace. Click the “Install App” menu on the left hand side of the dashboard, and go ahead and authorize the bot to access your workspace.

## Configuring Netlify
In the previous section, we set up the Slack bot to send notifications to our URL any time it is mentioned in the workspace. In this section, you will learn how to set up Netlify’s webhook offering, called “build hooks*.**”* In the Netlify dashboard, navigate to **Site settings > Build & deploy > Continuous deployment > Build hooks**. Select “Add Build Hook,” a suitable name for the hook, as well as the Github branch that should be triggered by the hook. After creating the build hook, you will be provided with a URL that will trigger the build once it receives a request.

## Putting It All Together
Our app is coming together nicely. In a couple more steps, you will be done configuring this service. It must be configured so that immediately after a webhook notification is received from Slack, a request is made to Netlify and the build is triggered. To do that, you will need to modify the code for the server we created above.
```JavaScript

    const TriggerDeploy = () => {
        const options = {
          method: "POST",
          url:
           "https://api.netlify.com/build_hooks/xxxxxxxxxxxx3b15ad",
          headers: {
           "Content-type": "application/json",
          }
        }
        request(options, function (error, response) {
          if (error) throw new Error(error);
          console.log(response.statusCode);
        });
    }
    
    const hasWord = (str, word) => str.split(/\s+/).includes(word);
      
    app.post("/", async (req, res) => {
        const body = req.body.event.text
        res.status(200)
        const shouldTrigger = hasWord(body, "deploy")
    
        if (shouldTrigger){
           TriggerDeploy()
        }
    });
```
The snippet above contains three parts:


1. The `TriggerDeploy` function — this function simply makes a post request to the Netlify build hook URL.
2. The `hasWord` function, which checks whether a word is contained in a sentence and returns a Boolean value.
3. The request handler. Within the request handler function, we extract the notification text sent by Slack from the request body, invoke the hasWord function, and conditionally invoke the TriggerDeploy function (if the word “Deploy” is present in the notification sent by Slack).

At this point, you can go ahead and try this service out. Mention the Slack bot in your workspace, and say deploy! You will notice that a new build on your Netlify dashboard will be triggered, as seen below.

![](https://paper-attachments.dropbox.com/s_EE5CD0068E0AAC562E3016B25F084CC524BC0DDA8F465AA334ADC9C1CD39873C_1618011691771_Screenshot+2021-04-10+at+00.38.42.jpeg)


## Getting Ready For Production
Before you deploy to production, it is important to tidy up your service. You will need to [deploy](https://dev.to/hookdeck/deploying-a-server-to-heroku-1e4b) [y](https://dev.to/hookdeck/deploying-a-server-to-heroku-1e4b)[our web server to a proper hosting service like](https://dev.to/hookdeck/deploying-a-server-to-heroku-1e4b) [H](https://dev.to/hookdeck/deploying-a-server-to-heroku-1e4b)[eroku](https://dev.to/hookdeck/deploying-a-server-to-heroku-1e4b). After this, set up Hookdeck to handle the ingestion and error handling of the webhook connections. This ensures that you will not miss any webhook notifications. (To learn how to set up a webhook connection in Hookdeck, [check out this guide](https://dev.to/hookdeck/creating-a-webhook-connection-on-hookdeck-25e0) we wrote). Finally, update the request URL field with the new URL Hookdeck has provided. 

## In Conclusion
In this tutorial, we have learned how to harness the power of webhooks to automate what could otherwise be a very boring task: manually triggering Netlify deploys. We also learned about Slack bots and webhooks, and gained some confidence in our skills along the way. Thanks for joining me!

Interested to learn more? Follow Hookdeck where I'll be sharing tutorials and guide about webhooks! 
[Try Hookdeck For Free](https://hookdeck.com/?utm_source=devto&utm_medium=forum&utm_campaign=devto). Receive, monitor and manage all your webhooks from a single place. We handle the complexity so you can focus on building your product.