WK 2 – Device Data Dashboard

I’ve done a couple things so far — one being sending data to an MQTT broker (trying to refresh my memory from UndNet), and I was also to create another webpage from biancasbread to eventually display sensor data, but now instead of getting an error, it show a line of text –> www.biancasbread.com/conndev-sensor.

MQTT Explorer + Arduino MKR1000 + Sound Sensor

I also ran the script using pm2 so it’s constantly running in the background.

Now I am trying to integrate fetch into the script to push sensor values from log.json

Currently, I have a github repo that I’ve cloned into the directory /var/www/biancasbread.com/ , here I ran the script.js — which leaves me with a couple of questions

  • Like the fetch example with node.js server, I have an index.html file in a public folder, which should be executed, although I can’t see it’s context, not sure why…?
  • How come when I visit the biancasbread.com/conndev-sensor it only shows the text written in my script.js file?
  • How do I get the contents of the .html to show instead?

Another note — I know Tom wants us to write our own code but for now I am using his examples as a crutch / foundation to get a better understanding of it all.

Ok, so I’ve worked off of the fetch with node.js example, but am still unable to see the context of my index.html file …?

Stepped away from trying to get the server fetch app to work, and went back to working local.

Here is the github repo for my local files.

UPDATE: Had office hours with Tom today and he helped resolve the problem!

He found that I had not enabled the port in my firewall, so that was the first thing to fix.

Next, Tom figured out that the line in my server.js code that is supposed to default to any files in the ‘public’ folder, was missing the /conndev-sensor route.

I came across this in my attempt to troubleshoot it over the past couple of days, and had referred to the expressjs site for help, I was close but instead of the correct code below, I had used the directory folder of all the project files –> ‘/ConnDev_DDD_Server/’

So with that, the site www.biancasbread.com/conndev-sensor worked! (mostly)

Once all the correct routing was finally fixed (thanks Tom), I just had to figure out why I was getting errors when clicking the fetch buttons/slider.

It was a pretty simple fix, in my code I had interchanged res / response and req / request, I just had to make sure I was consistent throughout.

Also ran the server.js script with PM2 so it can always run in the background without node.

Fun quote from week 2 readings: “A smartphone allows you to do work or doomscroll while you watch television and ignore your children.” -Ian Bogost, The Atlantic

Leave a Reply