Gege Raptor
Despite the fact a lot of Raspberry Pi projects are built with Python, I wanted to capitalise on my knowledge of javascript. Javascript is a very good fit for Raspberry as it includes many capabilities adapted for event driven applications. Node JS can help you to build a solid backend and many libraries exist to manage GPIO as well as developping great UIs
I started initially with Node.js with a clear willingness to leverage the ability to use a unique development langage for both backend and frontend. Javascript is fast to learn and powerfull enough for what most of applications I am planning to develop
There are lots of projects for raspberry Pi on the internet, but not so many that propose a good modular approach where business logic is separeted from data capture. Most projects run on a single RPI and it is difficult to get a clear picture of how you can build applciations distributed in differnt tiers.
My first intention was to put in place an architecture that could help me to add more features and devices easily in the future without disrupting what has been built before
I then decided to :
The main advantage of such architecture is to bring modularity and being able to easily add new features or devices
MQTT stands for MQ Telemetry Transport. It is a publish/subscribe, extremely simple and lightweight messaging protocol, designed for constrained devices and low-bandwidth, high-latency or unreliable networks.
I installed MQTT on my backend RPI and MQTT clients on the devices that collect data from sensors. When data are captured, the client sends a message to the server. It is then very easy to subscribe to the message and then trigger events that will take care of its content and perform all transformations you need. You can find more details on this website MQTT.org
The first project I wanted to build was a weather station where I could collect data coming from sensors connected to a RPI zero and display those data as well as data coming from external API to a screen that woudl be switched on by a movement sensor
There is nothing fancy in the project, all components are basic components well documented. the real value of this approach is to have a clear separation of duties between differnet components specialised that work together to deliver value
ON the RPI zero, a node JS application manages data captured from sensors and send them to the Backend through MQTT. the Backend also plays different roles. 1st - it acts as an MQTT server, 2nd - it runs all the business logic and also fetch data from a forecast API website , 3rd - the RPI also serves a vueJS application that is consumed by the browser of the RPI zero. Events are sent to the UI through socket.io
A basic Node JS application deployed on a Raspberry Pi zero W. The RPI is connected to a button, a BME280 sensor (captures temperature, pressure and humidity). An IR captor detects movement in the room and switches on the monitor connected to the RPI. The browser displays the UI of the application served by the backend.
You can find more detail on bitbucket repository
I do not need to spend time on the connection of the sensors or on the code as I used components that are very well documented. The only lesson I would like to share is that I would not recommend to build project whose UI is delivered by the browser of the RPI. The RPI zero lacks memory and is a great computing resource, but when you use the graphic interface and launch chromium, there are lots of things that slow down the system. In my case I really wanted to leverage a monitor that was available to build the project at low costs but I would rather us different ways to display the UI. It was specifically true in my case, As I wanted to use part of the screen to display randomly pictures of past trips and each time a picture was loaded, linux swap memory inccreased very quickly
Another Node JS application, but this time, I wanted to leverage newest capabilities of Node. I used non LTS version to benefit from latest capabilities to deploy modules and leverage ES6 natively. It works perfectly and simplifies life significantly
In order to make sure the app is always up and running I also used PM2 to run the app on the RPI
I also created a public folder where the UI (built by VueJS) is hosted and served as static files
You can find more details on bitbucket repository
This is the first version of the User Interface. the intention was to quickly expose data coming from sensors. I also wanted to use visual graphs in order to help visualisation of those data. I thus decided to fetch data from an external API OpenWeathermap.org and complement that with data from outside. For the forecast I decided (and regretted quickly) to leverage a widget
Building the graphs with v-charts was a challenge as documentation is not bad, but not a lot is easily reachable in forums. As for the widget, you have no control on when it will be updated and i refused to force a refresh of the browser as it would have killed the RPI zero. So the widget is rarely updated
It was also a mistake to fetch data from the API through vueJS as data where only updated when the browser was active. Once again, a forced browser refresh would have solved the problem but it is really not the best option
You can find more details on bitbucket repository
I decided to build a second version of the UI that woudl be fully reactive and the first imnprovement I did was to send to the backend the role of fecthing data from the API. the server would then use socket.io to emit a message to the client. I am using a VueJs socket client that is well integrated with Vuex, so anytime, a new message was received, the store was updated and computed values displayed on the screen were directely updated. I also used reactive capabilities of VueJS to update automatically the graphs that this time are using vue-chartjs
I also used the button to switch between graphs in order to get a forecast for next 4 days or the temperatures you will get in the next 24 hours
You can find more detail on bitbucket repository