nwHacks24

Office hours made easy... Introducing EduQueue!

EduQueue presents a clean and minimalistic solution to waiting in line for office hours!

Inspiration

Overcrowded office hours are frustrating for both students and instructors Neglected students and overwhelmed instructors do not create an effective learning environment.

What it does

• EduQueue is a webpage that features a question form for students to submit a question based on category and follower count.
• They are then added to the waitlist queue, which can be viewed in full in the queue viewer.
• The queue viewer features a real-time clock display and a list of entries, which are expandable for a more convenient view.
• You can delete the question entry in the queue with a press of a button.
• You can also follow other questions you find interesting, and get answers even faster.
• When your turn in the queue is up, you will be notified.

How we built it

We developed this webpage through the use of HTML, CSS, and JavaScript. We used HTTP to connect our front end with the back end by transfering data. For collaboration, we used VS Code, Repl.it, and Git for compiling and comitting codes. JSON was used to save data to local storage. Additional tools for design involved Font Awesome CSS Library, Figma and InkScape.

Challenges we ran into

• Joining front end and back end together as a team (we worked in 2 parts separately)
• Git commits, merge conflicts, and pulls
• Time manangement and shaping the scale of our problem that we wish to solve

Accomplishments that we're proud of

• Active use of HTTP and application of asynchronous programming
• Clean and Dynamic UI/UX design
• Implementing notification for students who reach the front of the queue

What we learned

• Efficient collaboration with teammates
• Intricate management of simulatneous front end and back end programming
• Understanding and utilizing local storage
• Streamlined design and implementation of UX/UI
• Effective time and resource management

What's next for EduQueue

• Implementation of API for school credentials log-in, mathematic notations, and/or code block markdown
• Use of LLM to detect similar questions and suggetions for following questions
• Adding option for students to yield when they are not ready to ask questions when reached the front of the queue
• Additional UI/UX expansion for TAs/Instructors, so they can also use the webpage to manage their availability during office hours

How to run

• Open a terminal window and navigate to the backend folder
• Run npm start
• Open the frontend/index.html file on your browser