..

frej8: the frontend

The batch processing API endpoints are up and running, and the backend is now in a state ready for a simple frontend. Honestly not looking forward to it. Dealing with layouts and flexboxes feels like a step back, but with that sort of attitude, everything will seem boring. Instead, I’ll force myself to see this as another learning opportunity, to learn something that will likely be impossible to avoid and which will be a good tool to have in my toolbelt. Learning React will be a way to showcase any work and projects I do in a more accessible and meaningful way.

As with the backend, I want to get something concrete real up and running asap, I think that will help with motivation. I’m going to use Material UI and chart.js to create a simple data dashboard for real-time sensor data. Here is a wireframe for that very simple, step one frontend.

frontend wireframe

Next Steps

  1. Set Up React Project: Initialize a new React project and install the necessary dependencies (Material UI, Chart.js, Axios).
  2. Create Basic Dashboard Layout: Design a simple layout with Material UI components to house the charts and data displays.
  3. Implement Data Fetching: Use Axios to fetch data from the API and populate the dashboard with real-time sensor data.