<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>Forem: Eric</title>
    <description>The latest articles on Forem by Eric (@ebttran).</description>
    <link>https://forem.com/ebttran</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F366088%2Ffe488a7b-0b93-4fe1-a48a-7b32b8c543ba.jpeg</url>
      <title>Forem: Eric</title>
      <link>https://forem.com/ebttran</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/ebttran"/>
    <language>en</language>
    <item>
      <title>Fanning out webhooks by using Hookdeck</title>
      <dc:creator>Eric</dc:creator>
      <pubDate>Wed, 05 May 2021 18:08:55 +0000</pubDate>
      <link>https://forem.com/hookdeck/how-to-fan-out-webhooks-with-hookdeck-3jim</link>
      <guid>https://forem.com/hookdeck/how-to-fan-out-webhooks-with-hookdeck-3jim</guid>
      <description>&lt;p&gt;In this guide, we will look at how Hookdeck's webhook delivery behavior acts as a &lt;a href="https://patterns.arcitura.com/big-data-patterns/design_patterns/fan_out_ingress" rel="noopener noreferrer"&gt;data transfer engine when considering fan-out ingress&lt;/a&gt;. We will go through a simple step-by-step example that illustrates how to set up fan-out on Hookdeck using the UI, as well as how to to use the &lt;a href="https://hookdeck.com/docs/connection-filters" rel="noopener noreferrer"&gt;event filtering feature&lt;/a&gt; to customize our fan-out. &lt;/p&gt;

&lt;h2&gt;
  
  
  How Hookdeck delivers data
&lt;/h2&gt;

&lt;p&gt;After ingesting webhooks sent to a Source (a Hookdeck unique URL), Hookdeck copies each event and delivers it to all the associated destinations (connections). &lt;/p&gt;

&lt;p&gt;We recommend using a Source per webhook publisher. This implies you will be subscribing to multiple topics using the same URL, thus receiving different type events.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8u4ucggwll8l3422kvqm.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8u4ucggwll8l3422kvqm.png" alt="Hookdeck fan out scheme" width="800" height="225"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;There are two main benefits to this behavior:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;The obvious benefit is it allows Hookdeck to act as a data transfer engine for fanning out webhooks.&lt;/li&gt;
&lt;li&gt;Hookdeck allows developers to benefit from a single persistent URL per Source, reducing the overhead when managing webhook endpoints.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;A drawback to this behavior is that we are fanning EVERY received event to all its destinations, which might not be the desired outcome (see more in the example). To solve this issue, we are going to leverage the event filtering feature. We can write a json that will act as an event filter that allows Hookdeck to know what event is expected per destination. This customizes the fan-out behavior, as well as allows you to be extremely specific regarding which event you want to be delivered to your Services. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fo9bjvpvqlq3fzpboo9jx.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fo9bjvpvqlq3fzpboo9jx.png" alt="Hookdeck webhook fan out with event filter" width="800" height="225"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Example
&lt;/h2&gt;

&lt;p&gt;Let's jump into an example to see how this translates into a real scenario. Let's say you have 3 services that listen to Shopify "order create" and "order update" topics. &lt;a href="https://hookdeck.com/platforms/shopify-webhooks-features-and-best-practices-guide#setting-up-and-configuring-a-webhook" rel="noopener noreferrer"&gt;Read how set up Shopify webhooks&lt;/a&gt;. &lt;/p&gt;

&lt;p&gt;Your services are:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Notification: a service to notify you for every order. &lt;/li&gt;
&lt;li&gt;WMS: a service that triggers action in your Warehouse Management Solution based on the webhook.&lt;/li&gt;
&lt;li&gt;Gift Card: a service that only triggers an action when there's a gift card in the order.&lt;/li&gt;
&lt;/ol&gt;

&lt;h3&gt;
  
  
  What does this look like in Hookdeck?
&lt;/h3&gt;

&lt;p&gt;Here we have Shopify as a Source and 3 connections without any filter set up. &lt;a href="https://dev.to/hookdeck/creating-a-webhook-connection-on-hookdeck-25e0"&gt;Learn how to create a connection&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fz53hxvwu6gmyyjvr2r20.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fz53hxvwu6gmyyjvr2r20.png" alt="3 webhook connections in Hookdeck" width="695" height="566"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;With this current setup, every time Hookdeck receives a webhook from an "order create" and an "order update," it will be copied and delivered to all 3 services. However, our Gift Card service only wants to listen to orders with gift cards in the request. This means that for every order without a gift card, we want the event to be delivered to the Notification and WMS services, but when there's a gift card in the request, we want the event to be fanned out to all three Services.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F0faakkiaeck1ay9t6u4s.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F0faakkiaeck1ay9t6u4s.png" alt="Scheme of webhook delivery with Hookdeck event filters for Shopify example" width="800" height="225"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  Setting up the event filter
&lt;/h3&gt;

&lt;p&gt;Let's set up the event filter for the Gift Card connection on Hookdeck to implement the scenario discussed above.&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Click the event filter icon in the gift-card connection&lt;/li&gt;
&lt;li&gt;Insert the JSON for the filter (see below)&lt;/li&gt;
&lt;li&gt;Click Save
&lt;/li&gt;
&lt;/ol&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight json"&gt;&lt;code&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="w"&gt;
&lt;/span&gt;&lt;span class="nl"&gt;"line_items"&lt;/span&gt;&lt;span class="p"&gt;:[&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;&lt;span class="w"&gt;
    &lt;/span&gt;&lt;span class="nl"&gt;"gift_card"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="kc"&gt;true&lt;/span&gt;&lt;span class="w"&gt;
  &lt;/span&gt;&lt;span class="p"&gt;}]&lt;/span&gt;&lt;span class="w"&gt;
&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="w"&gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fiyssdwhyrab1ebbcj90q.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fiyssdwhyrab1ebbcj90q.png" alt="Image of event filter for Shopify webhook gift card" width="800" height="360"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Great! Now Hookdeck will only deliver webhooks with a &lt;code&gt;"giftcard": true&lt;/code&gt; to our Gift Card Service. &lt;/p&gt;

&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;In this guide, we learned about Hoodkeck's webhook delivery behavior and how it allows you to fan out your webhooks to multiple destinations, as well as how to customize this behavior by leveraging the event filtering feature.&lt;/p&gt;

</description>
      <category>webhooks</category>
      <category>architecture</category>
      <category>systems</category>
    </item>
  </channel>
</rss>
