> ## Documentation Index
> Fetch the complete documentation index at: https://docs.getruba.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Choose Where Events Are Delivered

> Receive notifications asynchronously when events happen instead of needing to poll for updates

export const RubaSocials = () => {
  if (typeof document === "undefined") {
    return null;
  }
  const inject = () => {
    const footer = document.getElementById("footer");
    if (!footer || document.getElementById("ruba-socials")) {
      return false;
    }
    const isDark = document.querySelector("html.dark") || document.querySelector('html[class*="dark"]');
    const lineColor = isDark ? "#383838" : "#e8e8ed";
    const iconColor = isDark ? "#8e8e93" : "#86868b";
    const markColor = isDark ? "#ffffff" : "#08080c";
    const hoverColor = "#0071e3";
    const div = document.createElement("div");
    div.id = "ruba-socials";
    div.style.cssText = `display:flex;align-items:center;gap:20px;padding-top:20px;margin-top:20px;border-top:1px solid ${lineColor};width:100%`;
    const logo = `<a href="https://getruba.com" style="display:inline-flex;height:24px;align-items:center;gap:8px;text-decoration:none;color:${markColor};line-height:1;"><svg width="24" height="24" viewBox="0 0 120 120" aria-hidden="true" style="display:block;flex:none;"><g transform="translate(2.5 0)"><path d="M19 25h59L65.43 47H19a4 4 0 0 1-4-4V29a4 4 0 0 1 4-4Z" fill="${markColor}"/><path d="M19 73h31.57L38 95H19a4 4 0 0 1-4-4V77a4 4 0 0 1 4-4Z" fill="${markColor}"/><path d="M85 25h25L70 95H45Z" fill="#007AFF"/></g></svg><span style="display:inline-flex;height:24px;align-items:center;font-weight:600;font-size:15px;color:${markColor};letter-spacing:-0.01em;line-height:1;">Ruba</span></a>`;
    const spacer = `<div style="flex:1"></div>`;
    const ig = `<a href="https://instagram.com/getruba" target="_blank" rel="noopener" aria-label="Instagram" style="display:flex;align-items:center;color:${iconColor};transition:color 0.15s ease;" onmouseover="this.style.color='${hoverColor}'" onmouseout="this.style.color='${iconColor}'"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/></svg></a>`;
    const li = `<a href="https://linkedin.com/company/getruba" target="_blank" rel="noopener" aria-label="LinkedIn" style="display:flex;align-items:center;color:${iconColor};transition:color 0.15s ease;" onmouseover="this.style.color='${hoverColor}'" onmouseout="this.style.color='${iconColor}'"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"/><rect x="2" y="9" width="4" height="12"/><circle cx="4" cy="4" r="2"/></svg></a>`;
    const x = `<a href="https://x.com/getruba" target="_blank" rel="noopener" aria-label="X" style="display:flex;align-items:center;color:${iconColor};transition:color 0.15s ease;" onmouseover="this.style.color='${hoverColor}'" onmouseout="this.style.color='${iconColor}'"><svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg></a>`;
    const github = `<a href="https://github.com/rubadot" target="_blank" rel="noopener" aria-label="GitHub" style="display:flex;align-items:center;color:${iconColor};transition:color 0.15s ease;" onmouseover="this.style.color='${hoverColor}'" onmouseout="this.style.color='${iconColor}'"><svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor"><path d="M12 .7a11.5 11.5 0 0 0-3.64 22.4c.58.1.79-.25.79-.56v-2.24c-3.22.7-3.9-1.37-3.9-1.37-.53-1.34-1.29-1.7-1.29-1.7-1.05-.72.08-.71.08-.71 1.16.08 1.78 1.2 1.78 1.2 1.04 1.77 2.72 1.26 3.38.96.1-.75.4-1.26.74-1.55-2.57-.3-5.27-1.29-5.27-5.69 0-1.26.45-2.29 1.19-3.09-.12-.29-.52-1.47.11-3.05 0 0 .97-.31 3.16 1.18A10.96 10.96 0 0 1 12 6.09c.98 0 1.94.13 2.86.39 2.2-1.49 3.16-1.18 3.16-1.18.63 1.58.23 2.76.11 3.05.74.8 1.19 1.83 1.19 3.09 0 4.42-2.7 5.39-5.28 5.68.42.36.79 1.06.79 2.14v3.28c0 .31.21.67.8.56A11.5 11.5 0 0 0 12 .7Z"/></svg></a>`;
    div.innerHTML = logo + spacer + ig + li + x + github;
    footer.appendChild(div);
    return true;
  };
  if (!document.documentElement.dataset.rubaSocialsObserver) {
    document.documentElement.dataset.rubaSocialsObserver = "true";
    const observer = new MutationObserver(() => {
      if (!document.getElementById("ruba-socials")) {
        inject();
      }
    });
    observer.observe(document.body, {
      childList: true,
      subtree: true
    });
  }
  setTimeout(() => {
    if (!inject()) {
      const interval = setInterval(() => {
        if (inject()) {
          clearInterval(interval);
        }
      }, 500);
      setTimeout(() => clearInterval(interval), 10000);
    }
  }, 300);
  return null;
};

<link rel="stylesheet" href="/style.css" />

<RubaSocials />

Our webhook implementation follows the [Standard Webhooks](https://www.standardwebhooks.com/) specification
and our SDKs ship:

* Built-in webhook signature validation for security
* Fully typed webhook payloads

Beyond that, our webhooks ship built-in support for **Slack** & **Discord**
formatting, making it trivial to set up in-chat notifications for your team.

## Make the first connection

<Info>
  **Use our sandbox environment during development**

  So you can easily try purchases, subscriptions, cancellations, and refunds to
  automatically fire webhook events without spending a dime.
</Info>

<Steps>
  <Step title="Add a new endpoint">
    Head to your organization settings and click the `Add Endpoint` button to create a new webhook.

    <img className="block dark:hidden" src="https://mintcdn.com/ruba/JDRjNJtBhntQypch/assets/integrate/webhooks/create.light.png?fit=max&auto=format&n=JDRjNJtBhntQypch&q=85&s=f309b848d8f7c9c8c901243a2d0a1efa" width="1532" height="389" data-path="assets/integrate/webhooks/create.light.png" />

    <img className="hidden dark:block" src="https://mintcdn.com/ruba/JDRjNJtBhntQypch/assets/integrate/webhooks/create.dark.png?fit=max&auto=format&n=JDRjNJtBhntQypch&q=85&s=e3be5e909a7ed5f8cbfd57fe63555ce7" width="1494" height="388" data-path="assets/integrate/webhooks/create.dark.png" />
  </Step>

  <Step title="Enter your endpoint URL">
    Type the URL where the webhook events should be delivered.

    <img className="block dark:hidden" src="https://mintcdn.com/ruba/pmKQW7SekAkxQqgn/assets/integrate/webhooks/url.light.png?fit=max&auto=format&n=pmKQW7SekAkxQqgn&q=85&s=ab6716bb4948a6f6fdc61d2a08943c9b" width="1075" height="402" data-path="assets/integrate/webhooks/url.light.png" />

    <img className="hidden dark:block" src="https://mintcdn.com/ruba/pmKQW7SekAkxQqgn/assets/integrate/webhooks/url.dark.png?fit=max&auto=format&n=pmKQW7SekAkxQqgn&q=85&s=6416aa23883fad6c094783105657f401" width="1068" height="398" data-path="assets/integrate/webhooks/url.dark.png" />
  </Step>

  <Step title="Pick a delivery format">
    For standard, custom integrations, leave this parameter on **Raw**. This sends a payload in JSON format.

    If you want to send notifications to a Discord or Slack channel, pick the matching format here. Ruba then reshapes the payload so properly formatted messages land in your channel.

    <img className="block dark:hidden" src="https://mintcdn.com/ruba/pmKQW7SekAkxQqgn/assets/integrate/webhooks/format.light.png?fit=max&auto=format&n=pmKQW7SekAkxQqgn&q=85&s=07c1b2993acb64896bbb014b1cab75e3" width="1034" height="402" data-path="assets/integrate/webhooks/format.light.png" />

    <img className="hidden dark:block" src="https://mintcdn.com/ruba/pmKQW7SekAkxQqgn/assets/integrate/webhooks/format.dark.png?fit=max&auto=format&n=pmKQW7SekAkxQqgn&q=85&s=13480a76a9743f8ee536c59ae6b010dd" width="1050" height="418" data-path="assets/integrate/webhooks/format.dark.png" />

    If you paste a Discord or Slack Webhook URL, the format is picked automatically.
  </Step>

  <Step title="Set a secret">
    We cryptographically sign the requests using this secret, letting you easily
    verify them with our SDKs to confirm they are genuine webhook payloads
    from Ruba.

    You can supply your own or generate a random one.

    <img className="block dark:hidden" src="https://mintcdn.com/ruba/pmKQW7SekAkxQqgn/assets/integrate/webhooks/secret.light.png?fit=max&auto=format&n=pmKQW7SekAkxQqgn&q=85&s=fd3061e1b9293ff243c142968f52d167" width="1074" height="331" data-path="assets/integrate/webhooks/secret.light.png" />

    <img className="hidden dark:block" src="https://mintcdn.com/ruba/pmKQW7SekAkxQqgn/assets/integrate/webhooks/secret.dark.png?fit=max&auto=format&n=pmKQW7SekAkxQqgn&q=85&s=8c2d22d77d1a072cee013b9e66f0e8c0" width="1072" height="332" data-path="assets/integrate/webhooks/secret.dark.png" />
  </Step>

  <Step title="Subscribe to events">
    Finally, tick all the events you want to be notified about and you're done 🎉
  </Step>
</Steps>

[Now, it's time to wire up our endpoint to receive events
→](/integrate/webhooks/delivery)
