Smart Home Panel

illustrations illustrations illustrations illustrations

Published on 23rd June 2022 by Madeleine Smith

Background

For this side project, I wanted to build out a website to control one of the smart bulbs in my house. I had been using the ‘Smart Life’ mobile app to control my smart devices, but I didn’t want to be tied to my phone to be able to do this. So I built out a website instead 💯


Implementation

For the front-end, I built this out using React and hosted it on Netlify. I hadn’t touched React before, but I’ve previously used Vue for a couple of side projects so it felt pretty familiar to me.

Although JavaScript is definitely not my first choice of language 🤭, I wanted to use the TuyAPI JavaScript package to control my smart device. And so I wrote the back-end in JavaScript and used Express as the web framework. Although this package in question has been ported to various languages (including my language of choice - Go), I really wanted to use a mature package that I would have confidence in.

In terms of getting my website running locally, this was pretty straightforward. However, I ran into the limits of my knowledge whilst hosting the API. Specifically regarding how to hit a private IP address (of the device) from a hosted API. After much research, I was able to get the API working through using port forwarding on my router and setting up a dynamic DNS service on my Raspberry Pi.

Detailed instructions for this project are over on my GitHub:


In need of a back-end engineer for your project? Get in touch to hire me for contract work 💯