tfb414/airspacev2

A group response platform that allows group members to provide feedback and answer a host user’s questions. Built with React, Node, and Express

AirSpaceV2

AirSpace is an audience response platform that allows audience members to provide feedback and answer a host user's questions in real-time. Anyone can initiate a session or join existing sessions via phone, tablet, or computer.

Differences from Version 1

• Users login through Google via Passport.js
• Improved accuracy of our current Active Guest Users display and functionality on the Host Dashboard
• Implementing a multiple choice quiz type

Authors

• Aaron Sosa - aarontsosa
• Tim Brady - tfb414
• Sarah Abbey - sabbey37
• Nat Ventura - nat-ventura

Built With

• React.js
• Node.js
• Express
• WebSockets
• JavaScript ES6
• HTML5/CSS3
• Sass

Development Process

• 1. Concept
• 2. Initial Planning
• 3. Database Architecture
• 4 Backend Structure
• 5. Frontend: React and CSS

1. Concept

We developed AirSpace with the intention of creating a multipurpose space where host users could poll an audience, sending information back and forth instantly.

We had seen digital audience response systems like this in videogames (such as Jackbox.tv) and lecture halls (using "clickers"), but not in the form of an easily accessible mobile app that wouldn't require extra hardware software installation.

In this second iteration of AirSpace, we're specifically developing for use by teachers and students in order to facilitate an open and collaborative classroom environment.

2. Initial Planning

[9/26 Goals]

• Create schema
• Add dummy data to our tables
• Re-write queries from Version 1: - Add Host - Add Client - Add host_client table - Create Survey/Question (referred to as sq) - Add sq - return id - Add question - return id - Add options - return id - Add linking table

3. Database Architecture

Our database contained five primary tables:

• host
• guest
• question
• options
• sq (survey/quiz)

And three linking tables:

• host_guest
• guest_question_response
• sq_question_option

4. Backend Structure

5. Frontend: React and SCSS