# Create an Internet of Things Dashboard with Adafruit IO ## Introduction ![](https://cdn-learn.adafruit.com/assets/assets/000/024/531/medium800/sensors_x1469-00.jpg.pagespeed.ic.3ZY0bH-wcq.jpg?1429541053) Building Internet of Things projects with Arduino can be quite complicated: first, you need to find the right hardware & libraries for your project. Then, you need to find the right online service to send your data to. Finally, if you want to have some live graphical visualisation, you need to find or build an online dashboard for your project. In this guide, we are going to build an Internet of Things dashboard using the Adafruit IO service. We will see that using Adafruit IO makes the process so much easier, as it will allow us to easily send data to the cloud from an Arduino board, and also easily building an Internet of Things dashboard just by dragging & dropping some elements. As an example, we will connect several sensors to an Arduino Uno board, which will use the CC3000 WiFi chip to connect to the web. Then, we will send the measurement data to Adafruit IO & visualise it there in real-time, from anywhere in the world. Let's dive in! # Create an Internet of Things Dashboard with Adafruit IO ## Hardware Configuration The first step in this guide is to assemble our hardware. This is the list of components you will need for this guide: - Arduino Uno R3 - Adafruit CC3000 WiFi breakout board - DHT11 (or DHT22) temperature sensor + 4.7k Ohm resistor - Photocell + 10k Ohm resistor - Breadboard - Jumper cables To help you out, this is the schematic of the project: ![](https://cdn-learn.adafruit.com/assets/assets/000/025/199/medium800/sensors_Screen_Shot_2015-05-03_at_19.26.55.png?1430674422) First, connect the Arduino Uno +5V pin to the red rail on the breadboard, and the ground pin to the blue rail. Then, place the DHT sensor and the CC3000 breakout board on the breadboard. After that, connect pin number 1 of the DHT11 sensor (see the schematic) to the red rail on the breadboard, and pin number 4 to the blue rail. Also, connect pin number 2 of the sensor to pin number 7 of the Arduino board. To complete the connections of the DHT11 sensor, connect the 4.7k Ohm between pin number 1 and 2 of the sensor. For the photocell, first place the cell in series with the 10k Ohm resistor on the breadboard. Then, connect the other end of the photocell to the red rail on the breadboard, and the other end of the resistor to the ground. Finally, connect the common pin to the Arduino Uno analog pin A0. Now, the WiFi module. First, connect the IRQ pin of the CC3000 board to pin number 3 of the Arduino board, VBAT to pin 5, and CS to pin 10. Then, you need to connect the SPI pins to the Arduino board: MOSI, MISO, and CLK go to pins 11,12, and 13, respectively. Finally, take care of the power supply: Vin goes to the Arduino 5V (red power rail), and GND to GND (blue power rail). This is the final result: ![](https://cdn-learn.adafruit.com/assets/assets/000/024/500/medium800/sensors_hardware.jpg?1429274131) # Create an Internet of Things Dashboard with Adafruit IO ## Create Your Adafruit.io Dashboard Now that our hardware is ready, we are going to create our Adafruit IO dashboard. The first step is to go over to: [https://io.adafruit.com/dashboards](https://io.adafruit.com/dashboards) From there, create a new dashboard, and give it a name: ![](https://cdn-learn.adafruit.com/assets/assets/000/024/494/medium800/sensors_Screen_Shot_2015-04-17_at_12.37.44.png?1429272574) Then, it's time to add some elements. You will see that you have the choice between many different elements: ![](https://cdn-learn.adafruit.com/assets/assets/000/024/495/medium800/sensors_Screen_Shot_2015-04-17_at_12.38.11.png?1429272591) As we only have sensors sending numeric values in this project, I choose "Gauge" elements only: ![](https://cdn-learn.adafruit.com/assets/assets/000/024/496/medium800/sensors_Screen_Shot_2015-04-17_at_12.38.05.png?1429272617) When creating a new element, the dashboard will ask you which data feed you want to use. I created a new data feed per element of the dashboard, for example for humidity: ![](https://cdn-learn.adafruit.com/assets/assets/000/024/497/medium800/sensors_Screen_Shot_2015-04-17_at_12.38.40.png?1429272676) This is the final result, with three gauge elements in the dashboard: ![](https://cdn-learn.adafruit.com/assets/assets/000/024/498/medium800/sensors_Screen_Shot_2015-04-17_at_12.40.06.png?1429272692) # Create an Internet of Things Dashboard with Adafruit IO ## Build the Arduino Sketch Now that the dashboard is ready to receive & display some data, it's time to write our Arduino sketch, so the board can actually send data to the dashboard. You will first need to get your AIO key, which is a unique key that identify your account on Adafruit IO. You can for example get it from your dashboard: ![](https://cdn-learn.adafruit.com/assets/assets/000/024/499/medium800/sensors_aio_key_blur.jpg?1429272939) Danger: Let's now build your Arduino sketch. You will need three libraries for this project: - [CC3000 library](https://github.com/adafruit/Adafruit_CC3000_Library) - [PubSub library](https://github.com/knolleary/pubsubclient) (deprecated) - [Adafruit MQTT library](https://github.com/adafruit/Adafruit_MQTT_Library/tree/master/examples) - [DHT library](https://github.com/adafruit/DHT-sensor-library) To install a library, simply place the downloaded library folder inside your Arduino 'libraries' folder. As the code is quite long, I will only cover the important parts here. Of course, you can find all the code inside the GitHub repository of the project. The sketch starts by including the required libraries: ``` #include <Adafruit_CC3000.h> #include <ccspi.h> #include <SPI.h> #include <PubSubClient.h> #include "DHT.h" ``` After that, we define the pin & type of the DHT sensor, and also create an instance of this sensor: ``` #define DHTPIN 7 // what pin we're connected to #define DHTTYPE DHT11 // DHT 11 DHT dht(DHTPIN, DHTTYPE); ``` Then, that's where you will need to enter your WiFi network name and password: ``` #define WLAN_SSID "your_wifi_network" #define WLAN_PASS "your_wifi_password" #define WLAN_SECURITY WLAN_SEC_WPA2 ``` You also need to enter your user name and AIO key: ``` #define ADAFRUIT_USERNAME "your_adafruit_username" #define AIO_KEY "your_aio_key" ``` After that, you will need to enter the different paths for your data feeds, that you created while building the dashboard. You might need to modify this part if you are using different names in the dashboard: ``` #define TEMPERATURE_PUBLISH_PATH "api/feeds/temperature/data/send.json" #define HUMIDITY_PUBLISH_PATH "api/feeds/humidity/data/send.json" #define LIGHT_PUBLISH_PATH "api/feeds/light/data/send.json" ``` We also need to create instances of the CC3000 client, and also of the PubSubClient that we will use to communicate with Adafruit IO: ``` Adafruit_CC3000_Client client = Adafruit_CC3000_Client(); PubSubClient mqttclient("io.adafruit.com", 1883, callback, client); ``` In the loop() function of the sketch, we first start by measuring data from the light level sensor & from the DHT11 sensor: ``` // Measure ambient light float light_level_reading = analogRead(LIGHT_SENSOR_PIN); int light_level = (int)(light_level_reading/1024.*100.); // Measure temperature & humidity int h = dht.readHumidity(); int t = dht.readTemperature(); ``` Then, we send the data to the respective data feeds, using the mqttclient.publish() function. We also wait a bit during each publish, so the client has the time to receive the data: ``` mqttclient.publish(TEMPERATURE_PUBLISH_PATH, (char *) String(t).c_str()); delay(2000); mqttclient.publish(HUMIDITY_PUBLISH_PATH, (char *) String(h).c_str()); delay(2000); mqttclient.publish(LIGHT_PUBLISH_PATH, (char *) String(light_level).c_str()); delay(2000); ``` Finally, we keep the connection with Adafruit IO alive using the mqttclient.loop() function: ``` mqttclient.loop(); ``` Note that you can find all the code for this project inside the corresponding GitHub repository: [https://github.com/openhomeautomation/adafruit-io-dashboard](https://github.com/openhomeautomation/adafruit-io-dashboard) # Create an Internet of Things Dashboard with Adafruit IO ## Visualise Data on Adafruit.io It's now time to finally test the project! The first step is to modify the Arduino sketch with your own settings, and then upload it to the board. Then, go over to the dashboard. After a few seconds, you should see that the data appears inside the dashboard: ![](https://cdn-learn.adafruit.com/assets/assets/000/024/493/medium800/sensors_Screen_Shot_2015-04-17_at_13.06.30.png?1429272456) You can test your dashboard by putting your hand on top of the light level sensor: after a while the light level should go down in the dashboard. # Create an Internet of Things Dashboard with Adafruit IO ## How to Go Further Congratulations, you just built an Internet of Things dashboard using Adafruit IO. You can visualize live data measurements inside your dashboard, from anywhere in the world. There are many ways you can go further with this project. Using the flexibility of the Arduino platform, you can for example add more sensors to the project, and display them as well inside your dashboard. Also, your data can perfectly come from different boards: you can for example have several projects like the one we built in this guide, and make them send data to the same dashboard. Therefore, you can monitor data about your whole home from a single place. ## Featured Products ### Adafruit METRO 328 Fully Assembled - Arduino IDE compatible [Adafruit METRO 328 Fully Assembled - Arduino IDE compatible](https://www.adafruit.com/product/50) We sure love the ATmega328 here at Adafruit, and we use them _a lot_ for our own projects. The processor has plenty of GPIO, Analog inputs, hardware UART SPI and I2C, timers and PWM galore - just enough for most simple projects. When we need to go small, we use a Out of Stock [Buy Now](https://www.adafruit.com/product/50) [Related Guides to the Product](https://learn.adafruit.com/products/50/guides) ### Adafruit HUZZAH CC3000 WiFi Breakout with Onboard Antenna [Adafruit HUZZAH CC3000 WiFi Breakout with Onboard Antenna](https://www.adafruit.com/product/1469) For years we've seen all sorts of microcontroller-friendly WiFi modules but none of them were really Adafruit-worthy. Either they were too slow, or too difficult to use, or required signing an NDA, or had limited functionality, or too expensive, or too large. So we shied away from carrying... No Longer Stocked [Buy Now](https://www.adafruit.com/product/1469) [Related Guides to the Product](https://learn.adafruit.com/products/1469/guides) ### DHT11 basic temperature-humidity sensor + extras [DHT11 basic temperature-humidity sensor + extras](https://www.adafruit.com/product/386) **Discontinued -** **you can grab the ** [DHT20 - AHT20 Pin Module - I2C Temperature and Humidity Sensor](https://www.adafruit.com/product/5183)  **instead! ** The DHT11 is a basic, ultra low-cost digital temperature and humidity sensor. It uses... No Longer Stocked [Buy Now](https://www.adafruit.com/product/386) [Related Guides to the Product](https://learn.adafruit.com/products/386/guides) ### DHT22 temperature-humidity sensor + extras [DHT22 temperature-humidity sensor + extras](https://www.adafruit.com/product/385) The DHT22 is a basic, low-cost digital temperature and humidity sensor. It uses a capacitive humidity sensor and a thermistor to measure the surrounding air and spits out a digital signal on the data pin (no analog input pins needed). It's fairly simple to use but requires careful timing... No Longer Stocked [Buy Now](https://www.adafruit.com/product/385) [Related Guides to the Product](https://learn.adafruit.com/products/385/guides) ### AM2302 (wired DHT22) temperature-humidity sensor [AM2302 (wired DHT22) temperature-humidity sensor](https://www.adafruit.com/product/393) Discontinued - [**you can grab** AM2301B - Wired Enclosed AHT20 - Temperature and Humidity Sensor  **instead!**](https://www.adafruit.com/product/5181) The AM2302 is a wired version of the [DHT22](http://www.adafruit.com/products/385), in a large plastic... No Longer Stocked [Buy Now](https://www.adafruit.com/product/393) [Related Guides to the Product](https://learn.adafruit.com/products/393/guides) ### Photo cell (CdS photoresistor) [Photo cell (CdS photoresistor)](https://www.adafruit.com/product/161) CdS cells are little light sensors. As the squiggly face is exposed to more light, the resistance goes down. When it's light, the resistance is about ~1KΩ, when dark it goes up to ~10KΩ. To use, connect one side of the photocell (either one, it's symmetric) to power... In Stock [Buy Now](https://www.adafruit.com/product/161) [Related Guides to the Product](https://learn.adafruit.com/products/161/guides) ### Half Sized Premium Breadboard - 400 Tie Points [Half Sized Premium Breadboard - 400 Tie Points](https://www.adafruit.com/product/64) This is a cute, half-size breadboard with 400 tie points, good for small projects. It's 3.25" x 2.2" / 8.3cm x 5.5cm with a standard double-strip in the middle and two power rails on both sides. You can pull the power rails off easily to make the breadboard as... Out of Stock [Buy Now](https://www.adafruit.com/product/64) [Related Guides to the Product](https://learn.adafruit.com/products/64/guides) ## Related Guides - [Bluefruit LE Connect for iOS and Android](https://learn.adafruit.com/bluefruit-le-connect.md) - [TTL Serial Camera](https://learn.adafruit.com/ttl-serial-camera.md) - [Adafruit Arduino Selection Guide](https://learn.adafruit.com/adafruit-arduino-selection-guide.md) - [Arduino Lesson 10. Making Sounds](https://learn.adafruit.com/adafruit-arduino-lesson-10-making-sounds.md) - [Adafruit Data Logger Shield](https://learn.adafruit.com/adafruit-data-logger-shield.md) - [Wireless Power Switch with Arduino & the CC3000 WiFi Chip](https://learn.adafruit.com/wireless-power-switch-with-arduino-and-the-cc3000-wifi-chip.md) - [Multi-tasking the Arduino - Part 2](https://learn.adafruit.com/multi-tasking-the-arduino-part-2.md) - [NeoPixel Painter](https://learn.adafruit.com/neopixel-painter.md) - [Arduino Lesson 9. Sensing Light](https://learn.adafruit.com/adafruit-arduino-lesson-9-sensing-light.md) - [2.2" TFT Display](https://learn.adafruit.com/2-2-tft-display.md) - [Geofencing with the FONA 808 & Adafruit IO](https://learn.adafruit.com/geofencing-with-the-fona-808-and-adafruit-io.md) - [IR Sensor](https://learn.adafruit.com/ir-sensor.md) - [Adafruit Optical Fingerprint Sensor](https://learn.adafruit.com/adafruit-optical-fingerprint-sensor.md) - [Metal Inlay Capacitive Touch Buttons](https://learn.adafruit.com/metal-inlay-capacitive-touch-buttons.md) - [Adafruit AirLift Shield - ESP32 WiFi Co-Processor](https://learn.adafruit.com/adafruit-airlift-shield-esp32-wifi-co-processor.md)