After I finished the backend of my project, I had to figure out how I wanted to do the frontend. Originally, I figured it would be easiest to create it using Python and Flask, but I had more experience with Node and JavaScript from classes at Oregon State. The main problem I saw myself having is figuring out how to use Node/JS with the Microsoft SQL database that I created when I was working with the backend. There was a lot of information from Microsoft for working with C# and their SQL server, but not much out there for doing exactly what I needed to do with Node. It took a lot of experimenting, but I figured out how to make the information come through on the front end. I also figured out how to creatively query the SQL server to get only the most recent entries for the tables to display current statuses. I also figured out how to query it to let people search for any information from the server in the last two weeks. It was so cool to finally hit that breakthrough and see it all work.
Once I got all of my tables working and displaying information, I knew I wanted to make it look like an actual dashboard instead of just tables of information. I wanted my team to be able to see every status on one page. I searched online for how I could make that happen and I discovered Chart.js. I had never used it before, but I knew it would work perfectly because there were so many charts and cool things you could do to display information. I ended up creating donut charts to represent all of the statuses in red, yellow, and green depending on its current health. It ended up working out so well.
This is a picture of part of the homepage. I created the donut charts in their own little box. This page has about 15 different donut charts down below. It also has a table with all of the information on it.
Leave a Reply