How to Connect GitHub Webhook Integration

GitHub is the world’s largest code hosting platform, with 40 million users and over 190 million repositories. Moreover, you might also have come across the term Webhooks.

GitHub is a favorite among developers, and when integrated with Webhooks, it makes merging code changes across environments easy.

This article will give you a comprehensive overview of GitHub Webhooks. You will explore the key features of GitHub and understand the working of GitHub Webhook.

Prerequisites

• A GitHub account with Admin rights.

Introduction to GitHub

GitHub is a web-based graphical interface that enables access control and offers a variety of integrations, including wikis and basic Task Management tools.

Introduction to GitHub Webhooks

A Webhook, also known as a Web Callback or HTTP push API is a mechanism for an application to provide real-time data to other apps.

Method to Set Up GitHub Webhook Using GitHub UI

1. Method 1: Set Up GitHub Webhook Using GitHub UI
2. Method 2: Set Up GitHub Webhook Using GitHub API

Method 1: Set Up GitHub Webhook Using GitHub UI

• Step 1: Log in GitHub account Log in to your GitHub account and go to your desired repository.
• Step 2: Then click on “Settings” that is present on the right side of the GitHub bar. Next, click on the “Webhooks” option as shown below. Click on “Add Webhook”.
• Step 3: Now on the next page you will see some of the options that you need to fill

The fields required in the above screenshot are listed below in detail.

1. Payload URL: The payload URL is the server’s URL where the Webhook POST requests will be received.
2. Content-Type: Different content formats can be used to deliver webhooks, as listed below:
   • application/json: The JSON payload will be delivered as the body of the POST request.
   • application/x-www-form-urlencoded: The JSON payload will be sent as a form parameter named payload.
3. Secret: Setting a Webhook Secret ensures that only GitHub POST requests are routed to the payload URL. When you set a Secret, the Webhook POST request will include the X-Hub-Signature and X-Hub-Signature-256 headers.
4. SSL Verification: You will have the ability to configure the SSL verification settings if your “Payload URL” is a secure site (HTTPS). GitHub will not show this option if your “Payload URL” is not secure (HTTP). When providing Webhook payloads, GitHub checks your website’s SSL certificate by default. SSL verification ensures that hook payloads reach your URL endpoint in a secure manner.
5. Active: Webhook deliveries are set to “Active” by default. By deselecting “Active,” you can turn off the distribution of Webhook payloads.
6. Events: Webhooks are built around events. These Webhooks are triggered whenever a specific action on the repository is performed, which your server’s payload URL intercepts and responds to.

• Step 4: In case you want to set up your events, select the option “Let me select individual events”. Now you can choose your events as shown below.

• Step 5: After choosing the desired events, click on the “Add Webhook” button.

Method 2: Set Up GitHub Webhook Using GitHub API

It can be used to update an external issue tracker, initiate CI builds, update a backup mirror, or even deploy to your production server via the GitHub API. Follow the steps below

• Step 1: Create a new API token. 
• Step 2: Next, in your GitHub account, go to the “Personal Access Token Settings”. 
• Step 3: To create a new token, select “Generate New Token”. For this, only permissions relating to hooks are required as shown in the screenshot below.

• Step 4: Now, after configuring all the token details, click on “Finish”. Store the generated token safely as it will be used further.
• Step 5: You must now build a GitHub Webhook. You can now build a new Webhook using cURL in any Organization or Repository to which you have access y entering the following commands.

For Organization

curl -X POST 
  https://api.github.com/orgs/<ORGANIZATION_NAME>/hooks 
  -H 'authorization: token <YOUR_API_TOKEN>' 
  -H 'cache-control: no-cache' 
  -d '{ 
  "config": { 
    "url": "https://logs-github-receiver.sematext.com/github/<LOGS_TOKEN>" 
    # for EU "url": "https://logs-github-receiver.eu.sematext.com/github/<LOGS_TOKEN>" 
  }, 
  "events": [ 
    "issues", 
    "issue_comment", 
    "pull_request", 
    "pull_request_review", 
    "pull_request_review_comment", 
    "commit_comment", 
    "push", 
    "release", 
    "create", 
    "delete" 
  ] 
}'

For Repository

curl -X POST 
  https://api.github.com/repos/<GITHUB_USERNAME>/<REPOSITORY_NAME>/hooks 
  -H 'authorization: token <YOUR_API_TOKEN>' 
  -H 'cache-control: no-cache' 
  -d '{ 
  "config": { 
    "url": "https://logs-github-receiver.sematext.com/github/<LOGS_TOKEN>" 
    # for EU "url": "https://logs-github-receiver.eu.sematext.com/github/<LOGS_TOKEN>" 
  }, 
  "events": [ 
    "issues", 
    "issue_comment", 
    "pull_request", 
    "pull_request_review", 
    "pull_request_review_comment", 
    "commit_comment", 
    "push", 
    "release", 
    "create", 
    "delete" 
  ] 
}'

Key Benefits of GitHub Webhook

GitHub makes practically every event in their system public. It’s one of the things that makes Github so awesome. You tell it which events you want to be notified about and which URL you want to be notified about, and GitHub makes a POST request with that data whenever the event occurs.

• Using GitHub Webhook you can learn about your organization’s team’s pulse, patterns, metrics, progress, and trends in order to detect possibilities for improvement in the daily workflow.
• Developers can use GitHub Webhook to automate a certain action when a commit is made to the source code, making the development process go faster.
• It assists developers in detecting issues and resolving them nearly immediately, allowing the application to be deployed safely.

Conclusion

1. In this article, you gained a basic understanding of the GitHub Webhook and explored various features of GitHub.
2. In addition, you understood 2 easy methods to create a GitHub Webhook. The first uses GitHub’s User Interface and the second uses GitHub’s API. At the end of this article, you understood the benefits of GitHub Webhook.

Moreover, combining GitHub with Hevo Data will help you boost your business’s productivity. Hevo Data’s data warehousing platform includes GitHub compatibility in addition to access to other Webhooks and data sources.