This is a small demo made with Vanilla JS ❤️ to showcase how to use event-triggered Netlify Functions.
This site is deployed on Netlify and when a deploy fails, the function fetches a random GIF and posts it on a Slack channel.
If you'd like to try this demo locally, there's a few steps to follow:
- Follow the Giphy API docs to get an API key.
- Check the Slack API docs to create an app and get a user ID, channel ID and secret token.
- Clone the repo.
- In the
deploy-failed.js
file, replace the environment variables with your own:- Either replace directly the
process.env.SOME_KEY
instances with the keys you generated (but don't forget to not commit your file), or: - Create a
.env
file, place all your secrets in there and addrequire('dotenv').path("path/to/your/.env/file")
at the top of the function file (and .gitignore it if you decide to commit).
- Either replace directly the
- Run
netlify dev
in your terminal - Open
http://localhost:8888
- As this function is usually triggered by a build event, you'll need to write some custom code to trigger it locally, for example:
window.onload = () => {
return fetch("/.netlify/functions/deploy-failed");
};
And if you followed all the above steps, you should get a new GIF on Slack! 🎉
The fastest way to try this demo would be to deploy it on Netlify and add the following environment variables in the site's settings: GIPHY_API_KEY
, SLACK_API_SECRET
, SLACK_CHANNEL_ID
, SLACK_USER_ID
.
Trigger a deploy, cancel it, get a GIF on Slack!