Working With Webhooks in Development

I often find myself needing to integrate with an API or external service when building apps or new features. Often enough, I need to be able to fetch information in (almost) real time. Services like MailChimp and PayPal offer webhooks, which is basically a fancy way of describing and external POST request to your server (Click here if you aren’t familiar with HTTP verbs). Anyone who’s worked with webhooks in a development environment knows it’s quite a pain to work with them if you don't have hosting set up, because you can’t just pass in your localhost address to these services. Localhost pretty much just translates to 127.0.0.1, which is (generally) every computers home IP; telling an API to POST to localhost:3000/your_hook_path literally just tells it to post to itself (and usually APIs won’t let you enter localhost as a URL). You can see how this puts you in an awkward position during development and testing.

Ngrok: The Best Thing Since Sliced Bread

Ngrok is a really great tool to solve this problem, and I personally love the tool as a whole (it works with more than just webhooks). Basically, ngrok sets up a URL that routes any incoming requests to a port of your choice, which makes it really useful when working with webhooks. Setting up ngrok is super fast, too. Just download it here, cd into the directory where you installed it, and run ./ngrok http 3000, replacing the 3000 with whatever port you want to expose. If all goes well (and it probably will) ngrok will generate a HTTP and HTTPS URL that forwards to your localhost. All you have to do now is provide the API webhook with the generated URL, and voila! You’ve got a working webhook listener in your development environment. It’s important to note that ngrok will generate a new set of URLs every time you restart the client, so you will need to swap out the URL in the APIs webhook. I also love using ngrok for demoing work while I’m developing. That way, anyone can see the current status of the app/website I’m working on without me having to set up hosting, and I can avoid deploying until it’s actually necessary. It’s also great for testing your website across multiple devices/browsers, because you can connect from pretty much anything.

Everyone Loves Ngrok!

Don’t just take my word for it, here are some tweets from people who love ngrok:

“so ngrok.com is basically the greatest thing ever.“
— @philadams

“#ngrok is a dream for testing localhost with remote APIs!“
— @davejlong

“#ngrok has got to be the easiest local tunnel solution I’ve ever used.“
— @thecodeboss

… and there’s actually quite a bit more love.