Configuring the MQTT Dashboard app

Once you have downloaded the MQTT Dashboard app, open it. The app will prompt us to connect it to an MQTT broker. Tap on the Add first broker button.

A new page will open with the configuration for the MQTT broker. Switch on Broker protection as Adafruit requires authentication to connect and then fill the rest of the fields as given below:

Name: anyName
Server: io.adafruit.com
Port: 1883
Username: yourAdafruitUsername
Password: yourAdafruitKey

You can find your Adafruit username and key by clicking the My Key button in Adafruit IO.

Once all the fields have been filled properly tap the save button at the bottom. You should now see an empty page, now you can add tiles that will act as a way to interact with our Arduino.

Tap on the + button at the bottom of the page, this will prompt you to choose a type of tile, select Standard. A new prompt will show the different types of tiles you can choose from. First, select Progress. Now we can configure this tile.

Start by giving it the name Lux Value, then set the publish and subscribe topics to username/feeds/light, where username is your Adafruit IO username. Finally, set the map between values to 0 & 150. You can also set a colour and an icon to make the tile look good.

Now create another tile of type toggle. Name the tile Lamp and then set the Subscribe and Publish topics as username/feeds/lamp . Finally, set the on value to 1 and the off value to 0 .You can also set different colours and icons for the on and off states.

You have now successfully configured the MQTT Dashboard app. Now all that's left is to upload the sketch to the Arduino and we are done.