As promised from my last update, I’ll do another post once the user dashboard was complete. As of now, not only is the base user dashboard complete, I’ve updated functionality of the login to include more information to be used by the app, updating the process of new user registrations to do additional backend work along with including more details in the tables. Overall, all the work and bug fixes happened faster then expected, and motivation was at an all time high. Partly due to feeling the pressure of having an MVP by end of April, and time is moving quickly.
The Goal
Originally the user dashboard was plan for a week to complete, I needed to finalize the layout and the details on the dashboard, learn about react tables and figure out how to efficiently display the correct user’s information from the backend. However, in the span of 1 week, the user dashboard was completed, along with the backend API, routing and private routing with authentication. And some additional backend work such as new data table to handle each user’s performance metrics and updating existing APIs and functions to work with the new feature.
The Challenge
One of the challenges I faced during this feature implementation was with dynamically displaying the data metrics without the user’s action and when no data was found. I solved this by having updating my backend to return specific values if row didn’t exist and to use “useEffect” inside the app to call sub functions to pull data for the tables. I also had to update and include additional information to my session storage during login for my sub functions in the dashboard. The application is now looking better then ever, and finally starting to look the part.
The Result
My next step is to build a side navigation bar for logged in users to navigate into different part of their accounts and to create an activity page to show details of uploaded activities. During my previous development work I had already done bits and pieces of an upload functionality that enables local storage of the upload which I will build upon later.