Smart Home Panel - FE repo

June 21, 2022 ยท View on GitHub

https://user-images.githubusercontent.com/16705876/174797840-ab4cedf1-ded8-42c8-b9b9-d8ff30084384.mov

Background:

  • I wanted to build out a website to be able to control one of my smart bulbs in my home - instead of being reliant on the 'Smart Life' mobile app. This is the FE repo with the BE repo existing here.
  • Although, my solution works exactly as intended, arguably a far easier solution would be to buy a Raspberry Pi and install the Home Assistant OS on it. But hey ho, you live and learn.

Running locally:

  • Run npm install to install dependencies
  • Set the following environment variable as the url of the BE:
    • REACT_APP_API_URL=http://localhost:{{PORT-NUM}}
  • Run npm run start to run the code

Hosting the FE:

  • I decided to host the FE on Netlify as it's free ๐Ÿค‘
  • Netlify apparently has a CLI for easy deployment - though I haven't used this yet. Instead, I followed the flow on their website to be able to deploy from a GitHub repo - which was pretty straightforward.
  • Set the following environment variable as the url of the BE
    • REACT_APP_API_URL=https://{{APP-NAME}}.herokuapp.com/