Interview Scheduler

Summary

Interview Scheduler is a single page application (SPA) using the latest tools and techniques, we build and test a React application that allows users to book, edit and cancel interview appointments. We combine a concise API with a WebSocket server to build a realtime experience.

Demo interview-schduler.app

Getting Started

1. Fork this repository, then clone your fork of this repository.

2. Fork scheduler-api repository, then clone your fork of scheduler-api repository.

3. Install dependencies using the npm install command in both the scheduler folder as well as the scheduler-api folder.

4. Start the web server using the npm start command while in the "scheduler-api" folder. You will also need to start the client by navigating to the root folder and running this npm start command there as well. The app will be served at http://localhost:8000/.

5. Go to http://localhost:8000/ in your browser.

Final Product

Home page

Book appointment

Edit appointment

Cancel appointment

Error message

Realtime communication (WebSocket)

Running Webpack Development Server

npm start

Running Jest Test Framework

npm test

Running Storybook Visual Testbed

npm run storybook

Running Cypress End-to-End Test

Make sure scheduler-api server is running in test mode with this command.

• in scheduler-api directory

npm run test:server

Make sure scheduler is running.

• in scheduler directory

npm run start

Type this command to run cypress in scheduler directory.
Make sure both scheduler and scheduler-api are running.

• another terminal tap

• in scheduler directory

npm run cypress

Now, you should have 3 terminal taps (scheduler, scheduler-api, cypress)

Dependencies

• React
• Axios
• react-dom
• classnames
• WebSocket

devDependencies

• storybook
• @testing-library
• Cypress
• node-sass
• prop-types
• react-test-renderer

Future Goals

• Replace useState to useReducer
• Combine a concise API with a WebSocket server to build a realtime experience
• Deploy the server to Heroku
• Deply the Client to Netlify