Hosting a React App on Raspberry Pi

green and black circuit board

This article assumes you’ve already got a Raspberry Pi set up and running the latest Raspberry Pi OS, and you’ll be hosting a React app locally (meaning it’s only accessible on your local network).

First you’ll want to enable SSH. There’s some fancy ways to do this in the terminal, but the easiest is to just enable it in the preferences.

Once you’ve got SSH enabled, there’s one little security doodad you’ll need to fix. You’ll want to open your Pi’s terminal and head over to your config file and edit it with nano: sudo nano /etc/ssh/sshd_config. You potentially won’t need to run this command with sudo, but when you do… you’ll most certainly feel more powerful.

Once you’re inside, you’ll want to be on the lookout for a line that reads:
#PermitRootLogin prohibit-password
Once you find that line, you’ll want to edit it so it reads like so:
#PermitRootLogin no
That’s it! You can close out of nano and save your changes.

Next, you’ll want to confirm which IP address your Pi is using on your local network. Do find this, just type hostname -I.

At this point, you’re pretty much home-free. Hop onto a different computer on your local network and open a terminal. I’m assuming you’ll be ssh-ing from another Mac or Linux machine. Go ahead and SSH into your pi with ssh [username]@[IPaddress] at which point, you’ll be prompted for the password on the Pi to log in. Enter the password and you’ll hit the /home directory of the Pi!

Now, you can just build out your React app like you would normally, in my case I just installed Node, ran npx create-react-app /some-project and off it went! Once your React app is set up, you can access it from any device on your network by going to the IP address of your Pi (the one that appeared when you ran hostname -I), then a colon with the port number, just like you would on localhost.

Happy hacking!