GitHub webhook handler

In this tutorial, you build a pattern that acts as a GitHub webhook endpoint. It receives push, pull request, and issue events, routes each to different logic using a Switch node, extracts the relevant data, and responds with a 200 OK. By the end, you have a deployed webhook handler that processes real GitHub events.

What you will build

A single pattern with the following flow:

1. On Webhook — receives the incoming GitHub event
2. Get Property — extracts the X-GitHub-Event header to determine the event type
3. Switch — routes execution to the correct branch based on the event type
4. Get Property / Format — extracts and formats event-specific data
5. Log — writes a summary message to the console
6. Respond To Webhook — sends a 200 OK back to GitHub

When a push event arrives, the console displays something like:

Push to octocat/Hello-World: Updated README.md

Before you begin

Make sure you have:

• An active DRAGOPS account
• A GitHub repository where you can configure webhooks (or a tool like curl to simulate events)
• Familiarity with creating patterns, wiring nodes, and deploying (see Your first pattern)

Step 1: Create the pattern

1. Open the DRAGOPS dashboard.
2. Select New Pattern.
3. Enter the name "GitHub Webhook Handler" and select Create.

Step 2: Add the webhook trigger

1. Remove the default On Start node by selecting it and pressing Delete or Backspace.
2. Right-click on the canvas to open the node search menu.
3. Search for "On Webhook" and add it to the canvas.

The On Webhook node provides output pins for Body, Headers, Query, and Method. GitHub sends the event payload in the body and identifies the event type in the X-GitHub-Event header.

Step 3: Extract the event type from headers

The event type is not in the body — GitHub sends it as a request header. You need to read it from the headers object.

1. Right-click on the canvas and search for "Get Property". Add the node to the canvas.
2. Select the node to open the Inspector Panel on the left side. Set the Key to x-github-event.
3. Wire On Webhook's Headers output pin to Get Property's Object input pin.
4. Wire the execution flow from On Webhook to Get Property.

This node extracts the value of the x-github-event header (for example, push, pull_request, or issues).

Step 4: Route with a Switch node

A Switch node compares a value against multiple cases and runs the matching branch. This is cleaner than chaining multiple Branch nodes.

1. Right-click on the canvas and search for "Switch".
2. Add the Switch node to the canvas, to the right of Get Property.
3. Select the Switch node and configure three cases in the Inspector Panel:
   • Case 1: push
   • Case 2: pull_request
   • Case 3: issues
4. Wire Get Property's Value output pin to Switch's Value input pin.
5. Wire the execution flow from Get Property to Switch.

The Switch node now has four execution output pins: one for each case and a Default output for unrecognized event types.

Step 5: Handle push events

When a push event arrives, extract the repository name and the latest commit message.

1. Add a Get Property node. Set the Key to repository. Wire On Webhook's Body output pin to its Object input pin.
2. Add another Get Property node. Set the Key to full_name. Wire the previous Get Property's Value output pin to its Object input pin.
3. Add a Get Property node. Set the Key to head_commit. Wire On Webhook's Body output pin to its Object input pin.
4. Add another Get Property node. Set the Key to message. Wire the previous Get Property's Value output pin to its Object input pin.
5. Add a Format node. Set the Template to Push to {0}: {1}.
6. Wire the repository full_name value to Format's first input.
7. Wire the commit message value to Format's second input.
8. Add a Log node. Wire Format's Result output pin to Log's Message input pin.
9. Wire the execution flow: Switch's push output pin to the first Get Property, then chain execution through to Log.

Step 6: Handle pull request events

When a pull request event arrives, extract the PR title and the author.

1. Add a Get Property node. Set the Key to pull_request. Wire On Webhook's Body output pin to its Object input pin.
2. Add a Get Property node. Set the Key to title. Wire the previous Get Property's Value output pin to its Object input pin.
3. Add another Get Property node. Set the Key to user. Wire the pull_request Get Property's Value output pin to its Object input pin.
4. Add another Get Property node. Set the Key to login. Wire the previous Get Property's Value output pin to its Object input pin.
5. Add a Format node. Set the Template to Pull request by {0}: {1}.
6. Wire the login value to Format's first input.
7. Wire the title value to Format's second input.
8. Add a Log node. Wire Format's Result output pin to Log's Message input pin.
9. Wire the execution flow: Switch's pull_request output pin through the chain to Log.

Step 7: Handle issue events

When an issue event arrives, extract the issue title and the action (opened, closed, etc.).

1. Add a Get Property node. Set the Key to action. Wire On Webhook's Body output pin to its Object input pin.
2. Add a Get Property node. Set the Key to issue. Wire On Webhook's Body output pin to its Object input pin.
3. Add another Get Property node. Set the Key to title. Wire the previous Get Property's Value output pin to its Object input pin.
4. Add a Format node. Set the Template to Issue {0}: {1}.
5. Wire the action value to Format's first input.
6. Wire the title value to Format's second input.
7. Add a Log node. Wire Format's Result output pin to Log's Message input pin.
8. Wire the execution flow: Switch's issues output pin through the chain to Log.

Step 8: Handle unrecognized events

Add a fallback for events you did not explicitly handle.

1. Add a Format node. Set the Template to Received unhandled event type: {0}.
2. Wire the event type Get Property's Value output pin (from Step 3) to Format's first input.
3. Add a Log node. Wire Format's Result to Log's Message input pin.
4. Wire the execution flow: Switch's Default output pin to the Format node, then to Log.

Step 9: Respond to GitHub

GitHub expects a timely HTTP response. Without one, it marks the delivery as failed and may retry. Add a Respond To Webhook node at the end of every branch.

1. Right-click on the canvas and search for "Respond To Webhook". Add a node for each execution branch (push, pull_request, issues, and default).
2. Set the Status Code to 200 on each.
3. Add a String literal with the value ok and wire it to each Respond To Webhook's Body input pin.
4. Wire the execution flow from the final Log node in each branch to the corresponding Respond To Webhook node.

Alternatively, you can converge all branches into a single Respond To Webhook node by wiring each branch's final Log execution output pin to the same Respond To Webhook node.

Step 10: Test in the editor

Test each event type with sample data to verify the routing works.

Test a push event

1. Select Run in the toolbar.
2. Enter the following test data:

{
  "body": {
    "head_commit": {
      "message": "Updated README.md"
    },
    "repository": {
      "full_name": "octocat/Hello-World"
    }
  },
  "headers": {
    "x-github-event": "push"
  },
  "query": {},
  "method": "POST"
}

3. Select Run. The console should display: Push to octocat/Hello-World: Updated README.md.

Test a pull request event

1. Select Run again with this data:

{
  "body": {
    "pull_request": {
      "title": "Add dark mode support",
      "user": {
        "login": "octocat"
      }
    }
  },
  "headers": {
    "x-github-event": "pull_request"
  },
  "query": {},
  "method": "POST"
}

2. The console should display: Pull request by octocat: Add dark mode support.

Test an issue event

1. Select Run with this data:

{
  "body": {
    "action": "opened",
    "issue": {
      "title": "Bug: Login page not loading"
    }
  },
  "headers": {
    "x-github-event": "issues"
  },
  "query": {},
  "method": "POST"
}

2. The console should display: Issue opened: Bug: Login page not loading.

Step 11: Deploy and connect to GitHub

1. Select Deploy in the toolbar.
2. Copy the webhook URL from the Triggers panel.
3. In your GitHub repository, go to Settings > Webhooks > Add webhook.
4. Paste the webhook URL into the Payload URL field.
5. Set Content type to application/json.
6. Under Which events would you like to trigger this webhook?, select Let me select individual events and check Pushes, Pull requests, and Issues.
7. Select Add webhook.

GitHub sends a ping event to verify the URL is reachable. Since the pattern handles this through the default Switch branch, you should see a log entry: Received unhandled event type: ping.

Step 12: Verify with a real event

Create a test issue or push a commit to the repository. Then open the Deployments page in the DRAGOPS dashboard, select the "GitHub Webhook Handler" deployment, and check the execution history. The latest execution should show the formatted summary message for the event you triggered.

What you learned

• How to read request headers using Get Property on the Headers output pin
• How to route execution to different branches with a Switch node
• How to extract nested data from JSON objects using chained Get Property nodes
• How to send an HTTP response back to the caller with Respond To Webhook
• How to connect a deployed pattern to a real GitHub webhook

What is next?