WebHook vs API: What’s the Difference?

Posted by Roger Jin on November 7, 2019


Instant real-time notifications have made life a lot easier and efficient. Your scheduled flight is delayed, an instant text message from the airline app is sent to you. You just got notified that you got paid via your ADP app. Without any effort on your part, real-time changes are within your control. That's the power of a webhook. Data changes trigger the API in the app (say from your headless CMS) to send you notifications. We have greater control over our decisions because webhooks and APIs facilitate syncing and relaying data between two applications.

Discover how ButterCMS works with any tech stack.

WebHook vs API: The Differences In Simple Terms

Uber API

An API can be used from a server to communicate with example.com. Through that communication, the API can List, Create, Edit or Delete items. The API needs to be given instructions, though.

Webhooks, on the other hand, are automated calls from example.com to a server. Those calls are triggered when a specific event happens on example.com. For example, if a new user signs up on example.com, the automated call may be configured to ask the server to send out a welcome email.

What is a WebHook?

Sometimes webhooks are referred to as a reverse API, but this isn’t entirely true. They don’t run backwards, but instead, there doesn’t need to be a request initiated on your end, data is sent whenever there’s new data available.

To implement webhooks all you have to do is register a URL with the company providing the service you’re requesting data from. That URL will accept data and can activate a workflow to turn the data into something useful. In most cases, you can even specify the situations in which your provider will deliver you the data.

Webhooks and APIs differ in how they make requests. For instance, APIs will place calls for data whether there’s been a data update response, or not. While webhooks receive calls through HTTP POSTs only when the external system you’re hooked to has a data update.

When to Use a WebHook?

Webhooks are commonly used to perform smaller requests and tasks, however, there are situations where a webhook is more appropriate than an entire API.

One common scenario is when your app or platform demands real-time updates, but you don’t want to waste your resources. In this instance, a webhook framework would be beneficial.

Another circumstance to use a webhook over an API would be when the API is very poor, or there isn’t an API to begin with. You could create a workaround solution to give you the data your app requires to function.

Discover how ButterCMS works with any tech stack.

However, there is a word of caution about webhooks. Since they aren’t used to regularly request data, and only do so when new data is available, there is a chance you could never learn about new updates if the system goes offline for some reason. You’ll also have less control over the total flow of data, as you have to accept the total data amount that’s available with the given update.

Real-Life WebHook Examples

Zapier API

Many apps and tools do rely on webhooks, but primarily for smaller data requests rather than using them to form the backbone of their service. Still, there are plenty of examples of webhooks being used effectively.

  1. The ButterCMS webhook fires anytime anyone publishes a new blog post or updates content in their CMS.
  2. Zapier is essentially one giant webhook. You link up certain apps together and whenever an event occurs in one it triggers an action in the other.
  3. Stripe has a webhook that will automatically send an email to a customer whenever a subscription payment fails to go through.

What is an API?

What is an API?

API stands for Application Programming Interface. An API is a way for applications and platforms to connect with other applications and platforms via a common communication method. For an API to work there’s a request for data, followed by a response to that request. The data is usually delivered in a format like JSON.

APIs tend to be the framework that a lot of existing software and tools rely upon. For example, an application that creates Twitter trend reports could rely upon an API to continually get the freshest data right from Twitter. Most large apps have multiple APIs they integrate with the expand their service offerings, as you’ll see below.

When to Use an API?

APIs work incredibly well when you know you’re going to have a constant change in data. There’s no point in using an API if the data you’re requiring is going to be relatively stagnate. For example, if you’re an eCommerce store that regularly has to update its shipping and tracking data, then you’re going to be making constant requests.

Every time you poll the API you’re going to have new data. If your data isn’t constantly updated, then there’s no guarantee there’s going to be data ready for you at the other end. When this happens you’re simply wasting resources. However, if you’re set on using an API you can impose a call limit, which will limit the number of calls you make in a set time period. Some apps even limit the number of calls you make from the get-go in order to reduce resource use on their end.

Real-Life API Examples

Slack API

Like we mentioned above, APIs are everywhere. According to the latest results from ProgrammableWeb there are currently over 17,000 existing APIs. Below you’ll find a few tools that employ the use of APIs for their tools to function:

  1. As an API-first CMS, ButterCMS has its own REST API has predictable, resource-oriented URLs, and uses HTTP response codes to indicate API errors — the capabilities of which are demonstrated by this React Universal Blog build.
  2. Uber also relies on the Google Maps API, Twilio API, Braintree API, and the SendGrid API to help power their app.
  3. Slack has an API that enables you to integrate their messaging features into your third party apps.

Generally, most applications end up using both APIs and webhooks together to create a system that can communicate the right types of data at the right times.


Receive tutorials, informative articles, and ButterCMS updates to keep your work running smoothly.
Roger Jin

Roger Jin is an engineer at ButterCMS. He loves talking and pairing with other developers. You can find him at roger@buttercms.com where he will definitely reply to you.

ButterCMS is the #1 rated Headless CMS

Related articles

Don’t miss a single post

Get our latest articles, stay updated!