/VirtualHelpCenter

This online tutoring center built in VueJs allows tutors and students to connect for Zoom sessions in real-time. Students can attach files and input formatted code on their request submissions, and can rate their sessions after completion. Session histories and the ability to re-open, edit, or cancel requests makes this system flexible and user-friendly.

Primary LanguageVue

Virtual Help Center 💻

Application Video Demo: https://www.youtube.com/watch?v=5_vFra2uvFY&feature=youtu.be

About

Virtual Help is an online tutoring solution for connecting students with TAs to get assistance on the project. This project was inspired as a solution for accomodating the tutoring needs of students with the virtual limitations presented by COVID-19. The system allows students to select their course, describe their issues, attach files, and even input formatted code in a special code-friendly text box on our UI. Tutors can see all open requests in order of submission, select the one they choose to assist with, and the student is then notified of the pending session. The student has 60 seconds to accept the session, and upon acceptance, both the student and the tutor are directed to a private Zoom meeting to address the student's questions.

The application allows TAs and students to see their session histories, and students can re-submit previously closed or missed sessions through their history UI. Students can also rate their session and submit an explanation for the rating upon the session closing. The application does everything in real-time, and addresses both success and failure scenarios for pairing students with TAs. Additionally, a CMS system allows the application's control to lie in the hands of administrators, who are able to adjust user permissions and availble courses that can be addressed on the application.

Build Setup:

In order to implement all functionality of the application, you will need a
  • Ably key (for real-time database implemetation)
  • MongoDb key (for accessing and storing user data)
  • Firebase key (for student file storage and retrieval)
# install dependencies
$ npm install # Or yarn install

# serve with hot reload at localhost:3000
$ npm run dev

# build for production and launch server
$ npm start

For detailed explanation on how things work, checkout the Nuxt.js docs.

App Images

Student and TA Pairing

Rating a Session