Finally, a project that provides a turn-key solution for setting up remotely-controlled LEDs on a Raspberry Pi with Express + React. This project allows users to get up and running with WS281x LED strips while also providing a simple web server to act as a remote control.
A separate repository for the Express back end can be found at this repo.
For one thing, you'll need a Raspberry Pi 3 or newer and a WS281x LED strip.
Make sure you have Node installed. If not, go to Node's download page. Or just run this to get the latest version of Node:
curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash -
sudo apt install -y nodejs
Then, check node is working:
node --version
Also NPM:
npm --version
- Clone the project:
git clone https://github.com/dannydi12/pi-led-client
- Enter the directory with
cd pi-led-client
- Install with NPM:
npm i
- Open the 'example.env' file with your favorite text editor and change the API key to something secure. I recommend using a password generator to make a strong key. They key should match the API key you set for your server.
- Rename 'example.env' to '.env' with
mv example.env .env
- Run
sudo npm i serve pm2 -g
- Build the production folder with
npm run build
(should result in a new folder called 'build') - Edit
webserver.sh
with the absolute path to your folder - Start the deployment with
sudo pm2 start webserver.sh
That should be all that's needed to get everything installed. Even after rebooting your Pi, this server should remain live.
Note: the web server startup command requires sudo
because it needs root privileges to access port 80. There are much safer ways to do this but this should not be exposed to the outside world.
Once everything is up and running, simply browse to your Pi's local IP and enter the URL to your API server. I recommend saving the site to your home screen for easy access. Have fun!
This React site makes it incredibly easy to quickly change the settings of the current running routine. It's as simple as using a remote control:
The routines are fetched from the API server and can easily be chosen with a selector:
- React
- HTML5
- CSS3
- Javascript
- Jest
- Daniel DiVenere - Initial work - Portfolio
I'm always looking for ways to better my projects. Feel free to make a pull request or submit an issue.
This project is licensed under the MIT License - see the LICENSE.md file for details