At Ridmik, we use Discord as our official medium of communication and we absolutely love it. (If you're a React-Native developer, the fact that Discord's app are made using React-Native, may motivate you to keep pushing yourself further). We have an #activity channel in Discord where all of our Github commits, Trello activities are posted automatically.

There are just 2 steps to make it work with Discord and Trello:

  1. Create a Web Hook in Discord. This gives us a URL
  2. Set this URL in Trello board's Web Hook. So whenever there's new change in any of the cards in your Trello board, Trello will do a POST request to the URL you have just set with the information about the changes.

Pretty simple, right? Not quite. There are just 2 challenges:

  1. Trello does not have a UI where you can set the hook URL directly. You have to get an API Key and a Token and do few POST requests.
  2. Discord does not support Trello's POST request data format out of the box. You'll have to use something like AWS API Gateway to convert the Trello's request data to something that Discord recognizes.

So, basically our steps are more than 2:

  1. Create a Web Hook in Discord, get the hook URL
  2. Login to AWS and create an API Gateway proxy
  3. Get API Key and Token from Trello
  4. Get the alpha-numeric IDs of your trello boards. This id is different than what you see in the URLs
  5. Create the hook in Trello

Let's go through each of these in detail:

Step 1. Create a Web Hook in Discord, get the hook URL

  • Right click on your Discord server > Go to Server Settings > Webhooks. You'll see something like the following
  • Click on Create Webhook. Give it a name, anyname. Select the channel. Upload an icon, this will show up in the channel along with the activities. So make sure it looks nice. Finally copy the Webhook url and save it in a text file.

Step 2. Login to AWS and create an API Gateway proxy

Login to your AWS Console and go to API Gateway in your preferred region. Select REST, New API, and enter API name, choose Regional endpoint type.

After you click Create API, you'll be taken to the following page:

Select Models from the left side bar. Give the model a name and set application/json as content type. Paste the following code in the Model Schema box:


{
  "$schema": "http://json-schema.org/draft-04/schema#",
  "title": "TrelloBoardCard",
  "type": "object",
  "properties": {
    "action": { 
        "type": "object",
        "properties": {
            "data": {
                "type": "object",
                "properties": {
                    "board": {
                        "type": "object",
                        "properties": {
                            "name": { "type": "string" }
                        }
                    },
                    "card": {
                        "type": "object",
                        "properties": {
                            "name": {"type": "string"}
                        }
                    }
                }
            }
        }
        
    }
  }
}

Now go back to the Resources menu.

Click on Actions > Create Resource

Setp 3. Get API Key and Token from Trello

Go to https://trello.com/app-key and get your Developer API Key and Token.