How WebHook works | System Design

webbooks are a powerful tool that allow different systems to communicate with each other in real time in this video I'll explain how webworks work their applications and how they are used by different tech companies such as GitHub slack and stripe we'll also discuss why webworks are important in system design and how they're compared to web sockets and rest API so let's dive in and start when two computer systems need to communicate with each other there are different ways to do it one way is to have one person pull the other system which means it keeps asking the other system if there is any new information imagine if you wanted to know if your friend had sent you a text message but you had to keep checking your phone every minute to see if there was a new message that would be like polling it can be slow and inefficient because it keeps asking even if there is nothing new to report another way of computer systems to communicate is to have an open connection which means they stay connected all the time imagine if you had to hold your phone up to your ear all day just in case your friend decided to call you that would be like having an open connection it can be fast but it's not practical solution for all situations because it ties up resources and can't handle many connections at once you can check out my short videos on polling and streaming and web sockets to understand their applications web hooks on the other hand don't use polling and open connection instead one system tells the other system what URL it should send information to when there is new information available which is one of the main advantages of webbooks that is they can significantly reduce the load on servers by eliminating the need for clients to constantly Poll for updates another advantage of webworks is that they allow for even driven programming instead of requiring the client applications to check the server at regular intervals webhooks enable the server to notify the client application only when new events occur let's say you have a social media application that allows user to post updates and you want to notify users when there is a new update without webhooks you might have to continuously pull the server to check if there is any new update this could be inefficient and can consume resources on both the client and server side now with webhooks you can configure your social media application to send a notification to your client application Whenever there is a new update the client application can then process the notification and take appropriate action for example it could display a notification on the user's device or fetch the new update from the server here is how it works technically the client application registers a web hook with a social media application this webhook specifies a URL where the social media application should send notifications whenever there's a new update on social media application it sends a notification to the registered vehicle URL the client application receives the notification and processes it this could involve fetching the new updates from the server updating the user interface or performing some other action the client application then sends a response back to the social media application to confirm it has received and processed a notification now when a client registers a webhook URL with a server it's essentially telling the server send me updates to the URL whenever something relevant happens the server can then use the URL to send HTTP post request to the client whenever a relevant event occurs this events could be anything that the server needs to notify the client about such as a new message in chat app a new order in e-commerce app or a new comment in a social media post when the server sends an HTTP post request to the web URL it includes data about the event in the request body this data can be in any format that both the server and client understand such as Json or XML the client can then use this data to update its own State and display the new information to the user let's try to understand this using a JavaScript code snippet with an example of web application that uses a third party service for sending SMS messages we want our web application to be notified whenever a new SMS message is sent through the third party service we can achieve this by setting up a web URL with with the third party service and registering it in our client application here is an example of how the client application can listen to the webwork URL in this example we Define a web of URL constant with the URL that the third party service uses to send SMS updates we then Define a lesson for updates function that fetches the webhook URL using the fetch API if the response status is 200 it means that a new SMS message has been received we can then extract the SMS message data from the response body as a Json object and process it using the process SMS function if the response status is not 200 it means that there are no new SMS messages at the moment we can wait for a short delay in this case say 5 seconds before listening for updates Again by continuously listening for updates through the webhook URL our client application can be notified in real time whenever a new SMS message is sent through the third party service to clarify further the client is not polling a server URL or a rest endpoint but listening to its own URL that is the webhook URL which is typically on a web server or application server that is controlled by the client the webhook URL is essentially a callback URL that the server can use to notify the client about events or updates now compared to other communication protocols like HTTP and rest webhooks have a number of advantages while HTTP and rest require clients to actively Poll for updates webhooks enables servers to push updates to client as soon as they become available one of the main differences between webhooks and polling is that webhooks are even driven meaning that they are triggered by specific events or action while polling is time driven meaning that the client has to keep checking the server at regular intervals even if there may be no updates available webworks are also different from some other ways that programs talk to each other for example websockets allow programs to keep an open connection with each other all the time so they can talk to each other instantly but this uses a lot of resources and can be difficult to set up webworks are simpler and easier to use and they work well for situations where you don't need to talk to another program all the time webworks are used by many tech companies to power their application and services GitHub uses webhooks to send notifications to external Services when code is pushed to a repository or a new issue is created for example when a user creates a new Branch pushes changes to a branch or create support request GitHub sends a webhook to a specified URL to notify the user of the event stripe uses webhooks to notify users of even that occur in the stripe account for example when a payment is made a dispute is open or a subscription is created or updated stripe sends a web hook to a specified URL to notify the user of the event slack uses webhooks to integrate with other application and services for example users can create a custom web hook to send notifications to slack Channel when a specific event occurs in the application or service clearly webworks are powerful tool for real-time communication between systems by enabling servers to push updates to client as soon as they become available WebEx can help to reduce latency and improve the overall performance and efficiency of the system and with their even driven programming model webhooks provide a more responsive and efficient way for clients and servers to communicate compared to any traditional polling methods which is why a good understanding of webworks is important in system design particularly in modern microservices architectures they enable decoupling of systems making it easier to develop deploy and maintain applications foreign

Channel: ByteMonk

Views: 38,871

Keywords: software engineering, webhook, webhooks, client server, github, api, polling

Id: oQaJn6RdA3g

Length: 7min 42sec (462 seconds)

Published: Mon Mar 13 2023