Add a "physical" Smart Button To Your Next Project
Tags: beginners, tutorial, showdev, iot
Published: 2019-07-19 15:12:01

Recently I had an idea that I wanted to explore: what if I could build a real button and make it trigger ANYTHING using simply an URL (webhook)?  In this very quick post, I will walk you through how I managed to build this project in one evening:

{% twitter 1148047746416480256 %}
([see tweet](https://twitter.com/manekinekko/status/1148047746416480256))

See it in action: 

{% youtube RmcINVszbMs %}

Let's start...

# The hardware

### A physical button

To begin with, I needed an actual physical button (this seems obvious right?). Luckily, I had already ordered on Amazon an ["emergency button"](https://amzn.to/2JPhxI3) a couple of weeks ago. I stumbled upon this cool button and decided to buy in case someday I needed to build something with it. It seems I was right! 

Of course, you can have any other button, just make sure it has a latching switch (it's more realistic this way!) but feel free to take any other kind of switches.

### The chipboard (the brain)

I am a big fan of the [Onion Omega](https://onion.io/) boards. I actually do have a lot of them (you know, just in case). And I use them in each one of my IoT projects, such as my "voice-controlled standing desk" hack.

{% link https://dev.to/wassimchegham/hey-google-set-my-desk-to-standingmode-ai6 %}

For this setup, things are going to be way easier, since we only have 2 wires to connect (solder, coming from the button's switch and going into the Omega2+ pins.

![](https://thepracticaldev.s3.amazonaws.com/i/xqgd99lo491scgxr7j4b.jpg)

Here is the Fritzing diagram:

![](https://thepracticaldev.s3.amazonaws.com/i/6mksbiysn51kkff43qg3.png)

> If you want to know more about the Onion Omega2+ board, here is a great [getting started tutorial](https://docs.onion.io/omega2-docs/first-time-setup.html).

### The Wifi antenna

One thing (which is not mandatory) is to use an external Wifi antenna for the Onion Omega2+ board. This is just in case we encounter any signal loss due to the surface-mounted (SMT) antenna.

![](https://thepracticaldev.s3.amazonaws.com/i/jxwxq9i14adrb1f2ejyd.jpg)

For my setup, I used a 6dBi antenna that was lying around inside my toolbox. Just make sure your antenna is compatible with the u.FL connector. If you need more information about how to connect this kind of antennas, I highly recommend reading the [Onion guide](https://onion.io/2bt-u-fl-antennas-with-the-omega/). 

![](https://thepracticaldev.s3.amazonaws.com/i/2iyakupcxkw8ayix1ztf.jpg)

![](https://thepracticaldev.s3.amazonaws.com/i/rm2d1orptytb2t0t0jhj.jpg)

![](https://thepracticaldev.s3.amazonaws.com/i/0h8qtqa6xothcqj8z6sm.jpg)

![](https://thepracticaldev.s3.amazonaws.com/i/8hddu4pxe5islo5ke4zz.jpg)

![](https://thepracticaldev.s3.amazonaws.com/i/7ajeywwhucdk622p5i3n.jpg)

### Puting everything together

Finally, we need to connect the micro USB cable to the Omega2+ (to power the board) and get everything tightly positioned inside the button's box:

![](https://thepracticaldev.s3.amazonaws.com/i/105a8plltix7j6bqnj5q.jpg)


# The software

When it comes to the software part, and as I mentioned this is an easy setup, we can really choose any technology (python, node...) that can communicate with an HTTP endpoint. S for this quick DIY project, I just wrote a quick Shell script to take care of the button behavior. I've added the comments inside the code:

{% gist https://gist.github.com/manekinekko/2da533f0e1909e33a86b06766001d3d2 %}

What this code does is basically start a loop and listen continuously for the `$PIN` state change. When we press the button, we activate the switch which connects the 2 wires altogether and closes the circuit. When this happens, the Omega 2+ board receives a high voltage (3.3v) in `$PIN`. Using the `fast-gpio` included package, we can read the state.
- A value of `0` means the button is pressed.
- A value of `1` means the button is released.

The rest of the logic is only there to deal with press and lock mode of this particular button, and this is because this button is using a latching switch.

# Your turn...

Now, you may be wondering what can you do with this button? Well, to be honest, there are endless use case scenarios to use this button for but basically, any service that exposes an HTTP endpoint (deploy URLs, a serverless API...etc) would be a great candidate!

> In case you want to start playing around and hook this button to an API, you can try out the Azure Functions which let you quickly create and deploy your application logic to a serverless environment, [see how you can do it](http://bit.ly/2O116xI).

**Let me know in the comments below what would be your use (be creative)?**

Enjoy.