- Create React App to initialize project
- Material UI as my CSS library
- Nivo as my charting library
- App component:
- renders Header component
- holds top most state, including formatted list of user scores and current chosen user
- renders form to select new user
- renders Chart passing in the relevant data
- Header component:
- Header component that displays title and subtitle
- Chart component:
- using Nivo ResponsiveLine chart to showcase users GAD-7 and PHQ-9 scores
- data.json:
- json file containing the relevant user scores
- Decided based on the application a more robust state management solution wasn't necessary as props were not passed down more than one level
- Decided to use Material UI and Nivo as that is what you use at Prairie Health
- Improve responsiveness
- Read more documentation on Nivo to make the chart more intuitive
- Implement testing
- Improve view on mobile devices
- clone repository
- run npm i