Introduction

This is the first post of many covering the creation of a home system from scratch. The idea of this project came to me when my garage remote broke and I was left with no way to open and close the garage.

The Goals

I have many goals for this project, but for the short term I am focused on creating webservers in node.js and User Interfaces in react.js along with a little bit of electrical engineering when hooking up raspberry pis to various appliances around the house.

Note: The choice of programming language is due to how versatile yet simple nodejs is. The vast libraries compared to ease of install with npm rivals python's pip. Along with an overall much easier to read coding syntax combined with much faster speeds nodejs is quickly becoming my favorite project language. Not to mention, the language was designed to deal with http traffic.

First Step

Back to top

The first step, and only step covered in this post will be the creation of the webserver. For the webserver, I installed Ubuntu Server on a Raspberry Pi Model 3 B.

After setting up ssh, I installed Nginx. I wanted to use Nginx to server all static files and then have a nodejs server running that will handle the dynamic requests.

Here is my nginx website configuration file...

So, a quick rundown:

• Nginx will listen on port 80 and this website will be the default webpage if no domain is specified.
• "root" specifies where all the static html files are.
• "servername" aka domain name doesn't matter I just left it as it was.
• Now the location block grabs all links that start with "/" (so it grabs all links) and then tries to find a static file matching the request, if nothing is found it send it to the proxy block.
• The proxy block then sets some headers and redirects the request to a server running on the same machine on port 3000.

Here is the structure of all the website code/files.

You may notice the ftp-deploy json file, that is because I have already setup the webserver with ftp. I've added a github deploy action which will automatically update all the code on the webserver. I have a test webserver setup on my personal machine that I use for testing.

Let's take a look at the current webpage.

Not very interesting, but that's because I've only taken the template code for reactjs.

The like button works, though!

The Conclusion

Back to top

I know there is nothing very interesting about this post, but it is only meant to introduce the project, all the more interesting stuff is in the next posts.

Back to top