|
| 1 | +--- |
| 2 | +title: Slack |
| 3 | +description: Send deployment notifications to Slack |
| 4 | +icon: Hash |
| 5 | +--- |
| 6 | + |
| 7 | +import { Step, Steps } from 'fumadocs-ui/components/steps'; |
| 8 | +import { TypeTable } from 'fumadocs-ui/components/type-table'; |
| 9 | + |
| 10 | +# Slack Provider |
| 11 | + |
| 12 | +Send Block Kit-formatted notifications to any Slack channel via incoming webhooks. |
| 13 | + |
| 14 | +## Features |
| 15 | + |
| 16 | +- Rich Block Kit formatting with sections, fields, and buttons |
| 17 | +- Clickable links to deployments, commits, and projects |
| 18 | +- Branch, commit SHA, and commit message display |
| 19 | +- Build error details for failed deployments |
| 20 | +- Automatic retry with backoff for rate limits |
| 21 | + |
| 22 | +## Setup |
| 23 | + |
| 24 | +<Steps> |
| 25 | +<Step> |
| 26 | + |
| 27 | +### Create a Slack App |
| 28 | + |
| 29 | +1. Go to [api.slack.com/apps](https://api.slack.com/apps) and click **Create New App** |
| 30 | +2. Choose **From scratch** and name it (e.g., `Versend`) |
| 31 | +3. Select the workspace where you want notifications |
| 32 | + |
| 33 | +</Step> |
| 34 | +<Step> |
| 35 | + |
| 36 | +### Enable Incoming Webhooks |
| 37 | + |
| 38 | +1. In your app settings, go to **Incoming Webhooks** |
| 39 | +2. Toggle **Activate Incoming Webhooks** to On |
| 40 | +3. Click **Add New Webhook to Workspace** |
| 41 | +4. Select the channel for notifications |
| 42 | +5. Copy the **Webhook URL** |
| 43 | + |
| 44 | +</Step> |
| 45 | +<Step> |
| 46 | + |
| 47 | +### Add Environment Variables |
| 48 | + |
| 49 | +Add this to your Vercel project: |
| 50 | + |
| 51 | +<TypeTable |
| 52 | + type={{ |
| 53 | + SLACK_WEBHOOK_URL: { |
| 54 | + description: 'The incoming webhook URL you just copied', |
| 55 | + type: 'string', |
| 56 | + required: true, |
| 57 | + }, |
| 58 | + }} |
| 59 | +/> |
| 60 | + |
| 61 | +</Step> |
| 62 | +<Step> |
| 63 | + |
| 64 | +### Redeploy |
| 65 | + |
| 66 | +Redeploy your Versend instance to apply the changes. |
| 67 | + |
| 68 | +</Step> |
| 69 | +</Steps> |
| 70 | + |
| 71 | +## Example Output |
| 72 | + |
| 73 | +A successful deployment notification looks like: |
| 74 | + |
| 75 | +``` |
| 76 | +✅ Deployment succeeded |
| 77 | +
|
| 78 | +**myapp** deployed to **production** |
| 79 | +
|
| 80 | +🌿 Branch 📝 Commit ⚙️ Environment |
| 81 | +`main` `abc1234` production |
| 82 | +
|
| 83 | +Commit Message: |
| 84 | +feat: add new feature |
| 85 | +
|
| 86 | +[View Deployment] |
| 87 | +``` |
| 88 | + |
| 89 | +The message includes clickable buttons and uses Slack's Block Kit formatting for a clean, structured layout. |
| 90 | + |
0 commit comments