SchedulerBay Web Application

Microsoft Engage'21 Submission by Yashtika Kakkar

☄️ Overview

‣ Problem Statement

Build a functional prototype of a platform that gives students an array of digital academic and social tools to stay engaged with their studies, peers and broader university community during pandemic.

‣ Proposed Solution

A Scheduler Application to bring hybrid mode of classes to life. With the ease in restrictions wrt Covid-19, many organizations have started to implement hybrid mode of classes which allows a certain number of students to attend classes in offline mode. This webapp helps in organizing the same by allowing students to submit weekly preferences for attending classes in offline mode. The seat allocation done on FCFS basis, will eventually provide a roster of students attending in offline mode to the faculty.

This project has been solely built during the period of Microsoft Engage'21 Mentorship Program conducted by Microsoft from the period of 8th November 2021 to 26th November 2021.

‣ Live Link: https://schedulerbay.netlify.app/

☄️ Agile Methodology and Workflow

Agile methodology was implemented in 3 sprints, each sprint comprising of 6 days/week for 3 weeks. The intent of the project, to help teachers and students, their viewpoints and easy to use interface build were kept in mind during the development of this project. The web application has been hosted on Netlify.

Week	Phase	Tasks	Status
1	Design & Planning	Explored different ideas keeping uniqueness and timeline in mind. Decided upon the tech-stack to be used. Implemented UI layouts of all the pages from scratch. (Templates were not used to cater to the uniqueness of the project) Planned the feature flow of the project.	Completed
2	Implementation	Implemented Sign In/Sign Out feature using Auth in Firebase. Structured the collections in Firestore. Implemented Class addition by Teacher and create a Join Class code. Implemented Subject addition by Student using the same Join Class code.	Completed
3	Implementation contd, Testing & Deployment	Implemented booking an offline seat functionality for Student. Implemented fetching and displaying of list of students attending offline class to the Teacher. Tested on multiple use cases. (Bugs Fixed) Deployed Schedulerbay using Netlify.	Completed

☄️ Project Screenshots

Pages + Features	Screenshot
Landing Page User can Login or Sign Up as a Teacher or a Student
Teacher - Sign Up Page
Teacher - HomePage User can access different classes User can add new classes
Teacher - Add Class Modal Upon successful creation of the class, a joining code is shared
Teacher - Class Details Page User can view the class details fetched from the database They can also view the roster of students attending offline class by selecting a particular date
Student - Sign Up Page
Student - HomePage User can access different subjects User can add new subjects
Student - Add Subject Modal User can add a new subject by using the joining code provided by the teacher
Student - Subject Details Page User can view the subject details fetched from the database User can book an offline class slot based on appropriate filters **

** Use Cases for booking an offline class slot:

• The number of allowed students limit provided by the teacher is never exceeded.
• If student selects correct date where there is a class and is fully vaccinated -> Success confirmation alert
• If student selects correct date where there is a class but isn't vaccinated -> Vaccination required alert
• If student selects a wrong date where there is no class OR the allowed limit of students has reached already -> No slots available alert
• If student selects a date outside the week -> Request to select a date within the week alert
• If student attempts to book multiple slots for same date and class -> Refrain from booking multiple slots alert

☄️ Tech-Stack Used

Design


Languages


Frameworks


BackEnd


Hosting


Special Mention

☄️ Installation Setup

1. Clone the App

• Make a new folder and open the terminal there.
• Write the following command and press enter:

  $ git clone https://github.com/yashtikakakkar/Microsoft-Engage-Schedulerbay.git

2. Install Required Packages

• Write the following commands and press enter to download all required modules:

$ npm install 

$ npm i react react-router-dom react-dom 

$ npm i firebase

$ npm i shortid

3. Run Locally

• While you are still inside the cloned folder, write the following command to run the website locally:

  $ npm start

☄️ EndNote

These 3 weeks turned out to have a very steep learning curve for me for which I am super grateful. I would like to thank my mentor for their constant support and guidance during the entire program, and to Microsoft for providing students with an enriching opportunity such as this!

Developed by Yashtika Kakkar With ❤️