—time is a precious commodity. Labbers optimize our time with the scheduler.
Better match your time to LHL tech mentor availabilities
Key features:
- Live updates with a WebSocket.server and all connected users see the update in their browser. When you make your appointment with us, you know it is not double booked by accident.
- A weekly view of appointment availabilities with daily mentors available.
- Utilize React reducers to efficiently manage multiple states to simulate complex API queries.
0
- React - Library building user interfaces for client application
- Webpack, Babel - Tools for development server
- Axios, WebSockets - Tools to communicate with server
- Storybook, Jest - Unit and Integration Testing
- Cypress - End-to-End Testing
- axios
- babel-loader devDependencies
- classnames
- node-sass devDependencies
- react
- react-dom
- react-scripts
- nodemon devDependencies
-
Clone the repo.
-
Create a .env.development file and update the .gitignore.
-
Update the .env file with the postgres database information. For example:
REACT_APP_WEBSOCKET_URL=ws://localhost:8001
PORT=8000
CHOKIDAR_USEPOLLING=false
-
Follow the migration and seed setup instructions on Lighthouse Lab API server
-
Install node dependencies:
npm i
- Add the proxy to the API server to the package.json:
"proxy": "http://localhost:8001",
- Start the API server in a Guest terminal (vagrant machine for Lighthouse Labbers): Note: Refer to the package.json of the API for scripts
npm start- Start up the Host localhost server and a new browser window will pop-up. The default port is 8080. Note: nodemon is used, so you should not have to restart your server
npm start- Running Jest Test Framework
npm test- Running Storybook Visual Testbed
npm run storybook- Running Cypress End-to-End test
npm run cypressThe End-to-End Testing activity tests the three main functionalities:
- "should book an interview"
- "should edit an interview"
- "should cancel an interview"
- Clicks on the "Add" button to an available appointment
- Student enter their name and choose an interviewer
- Clicks the save button
Test includes:
- Input check to ensure both student's name and interviewer were filled in.
- Checks successful booking (i.e. PUT) using should and find function (i.e. .should.expect) the apppintment's student name exists.
- Check the available spot(s) reduced by 1 to check the spots remaining functionality worked.
- Clicks the edit button for an existing appointment
- Changes the student's name and select a different interviewer
- Clicks the save button
Test includes:
- Input check to ensure both student's name and interviewer remains filled in.
- Checks successful update (i.e. PUT) by should and find (i.e. .should.expect) the apppintment's new student name exists.
- Check the available spot(s) were not reduced by 1 to check the spots remaining functionality behaved appropriately.
Note: The API server may need to be reset after the above tests. This is needed to ensure the script does not cancel an interview that was not available in the default test data.
- Clicks the delete button for an existing appointment
- Clicks the confirm button
Test includes:
- Check the confirmation page and button appeared after clicking the delete button
- Checks successful deletion (i.e. DELETE) using should and find (i.e. .should.expect) to ensure the previous student's name no longer exists.
- Check the available spot(s) were increased by 1 to ensure the spots remaining functionality behaved appropriately.
Check the abscence of previous student's name
cy.contains(".appointment__card--show", "Steve 'Captain America' Rogers")
.should("not.exist");
Check available spots
cy.contains("[data-testid=day]", "Monday")
.find("h3")
.should($h3 => expect($h3).to.contain("no spots remaining"));
There is currently no process for submitting pull requests to this student project.
- SemVer for versioning: version 1.0.0.
- Michael Chui - Initial work
This project is licensed under the MIT License - see the LICENSE.md file for details