Overview:
The goal of this dashboard is to allow researchers to analyse data collected from participants and gain insights into infant health. The dashboard is a React.js web application and is supported by the backend-offline team.
Setup and Installation:
- Clone frontend-web github repository. You need to get access as this is not a public repository.
git clone https://github.com/infant-nutrition-project/frontend-web.git
- Open terminal, cd to the folder frontend-web and run the following commands to install necessary packages. You will need to download npm to run these commands, you can do that here.
cd dev-dashboard
cd dashboard-frontend
npm install
- To run the code and host the website locally run the following code from the dashboard-frontend folder. Note that browser should launch automatically with the website. As you make changes to the code, the website will automatically reflect these changes as soon as you hit save.
npm start
Getting Familiar with the Code:
Login, Register, Logout
When you first run the website, you should be greeted with a Login screen. As you will not have an account yet, you can simply press “Create new account.” This will bring you to the registration page. You will enter an email, username, password and will also be asked to confirm your password. There will be alerts on the screen if any of these fields do not meet the guidelines.Thesecanbefoundin /src/RegisterPage/RegisterPage.js and include ensuring the email is valid (using a built-in JS email validation package), ensuring the username is between 3-20 characters, ensuring the password is between 6-40 characters and that the passwords match. Any of this criteria can easily be changed if necessary. Once you hit create account, an API call will be made to register your account and save your information in the database. You can also coordinate with the back-end team to require certain formatting for the database entry as well. Right now, the only restriction the backend has is that no emails can be repeated as they are the primary key.