This step is really important and allows you to see it in action when you begin the further development work below. It’s easy to add to a Trello Board and we’ll walk you through this below.

1. Open a Trello Board and Click on ‘Power-Ups’ in the sidebar

Click on Power-Ups item in the Board Sidebar on one of your Boards.

Make sure you are an administrator of the Trello Board

2. Add your Power-Up from the Browser

Click on the ‘Custom’ item in the sidebar to filter the results to your Power-Ups.

Then, add your Power-Up from the list of custom Power-Ups:

3. Test out your Power-Up’s features

Now you should be able to interact with your Power-Up on your Board and test out the different capabilities.

The browser should automatically refresh any React components on code-level changes, provided you are running in development mode.

For example, the following is shown if you enabled card-back-section and card-buttons:

Troubleshooting

If you have trouble with the Power-Up not loading correctly in Trello, make sure you have the Developer Tools open in your web browser (e.g. Chrome: Right-Click on Website → Inspect → Console), as this may help you identify any problems.

Next Steps

Congratulations! Your Power-Up is up and running on a Trello Board.

It’s now time for the fun bit where you customize the Power-Up and transform it into the product you want for Trello users. Are you ready to begin enhancing its features?