Want to send data from your electronics project to the Internet and display it on a webpage?

This guide will teach you to send data from a digital input, such as a momentary push-button, to Adafruit IO. Using Adafruit IO, you will build a visual Dashboard with a Gauge block to display (in real-time!) when the push button has been pressed or depressed.

Adafruit IO allows you to connect and interact with this project either by:

  1. Programming a microcontroller, microcomputer, or desktop computer (configurable, and powerful, but requires coding skills)


  2. Using our no-code "WipperSnapper" firmware (super fast! no coding! but only for some microcontroller boards)

Option 1. Build and Program this project with Arduino or CPython

This guide contains instructions and code for building this project using Arduino, the Adafruit IO Arduino client library, and an Arduino-compatible board. We also include instructions for building this project using a Raspberry Pi and code for CPython (a.k.a desktop-computer Python).

Option 2. No Code? No Problem! Build this guide using Adafruit IO and WipperSnapper!

With Adafruit IO, you can connect your devices without writing a single line of code using our custom WipperSnapper firmware. Load the WipperSnapper firmware onto your board, add credentials, and plug it into power. Your board will automatically register itself with your Adafruit IO account.

From there, you can add components to your board such as buttons, switches, potentiometers, sensors, and more! Components are dynamically added to hardware, so you can immediately start interacting, logging, and streaming the data your projects produce without writing code.

Pre-Requisite Reading: Adafruit IO Basics

This guide is part of a series of guides that cover the basics of using Adafruit IO. If you haven't read through the Adafruit IO feed and dashboard basics guides, you should do that before continuing with this guide so you have a basic understanding of the core functionality of Adafruit IO.

This guide was first published on Apr 25, 2015. It was last updated on Jul 13, 2024.

This page (Overview) was last updated on Mar 08, 2024.

Text editor powered by tinymce.