Welcome back to my little post series on building my own home automation suite. Today I will show you how I implemented a simple REST API and also a little Vue.js-based frontend.
In my last post, I wrote about my little library for communicating with my IKEA Tradfri Gateway. Now it was time to implement a simple REST API that will be the backend to my Vue.js frontend.
And I won't bore you with too many details here. Here are the steps I took:
- Create a .NET 5 WebAPI project
- Added my Tradfri library as a dependency
- Added the necessary connection information (IP address, username, and access token for the Tradfri Gateway) to my
- Modified the
Startup.csto create a
TradfriGatewayobject based on the settings
- Create a controller and use the
TradfriGatewayin each action
Every .NET 5 (and .NET Core) WebAPI comes with a Swagger UI out-of-the-box. That's awesome because it makes manual testing super simple. You just open
https://localhost:5001/swagger and you are ready to go. Here is an early version of my API.
As the last step (for now), I wanted to create an easy-to-use frontend. Turning the lights on or off should be as simple as possible. Dimming the lights should also be easy to do.
So... I'm not a designer. I'm also not a frontend developer. And while trying to come up with a simple but useful UI, I always had Ben's cover image from his post in mind. So it ended up looking pretty much the same.
But you know what they say:
Imitation is the highest form of flattery.
I hope that's how you take it. 😄
My kids have RGB light bulbs in their nightlights. So adding a way to change the color through the UI would be a good fit.
And adding a way to group lights into rooms would improve the overview a lot.
At the moment, the app just runs on my laptop while debugging. In the end, my plan is to run it on a Raspberry Pi. That means buying and configuring a Pi is also on my list.