Thumbs Check

Enhanced real-time classroom interaction and analytics

Web App Team

• Product Owner: Mike Yao
• Scrum Master: Andy Sponring
• Development Team Members: Austin Liu, David Trinh, Mike Yao, Andy Sponring

Mobile App Team

• Product Owner: Lauren Spiegel
• Scrum Master: Brian Liu
• Development Team Members: Brian Liu, Mark Tausch, Anuj Tomar, Lauren Spiegel

Table of Contents

1. Usage
2. Requirements
3. Tech Stack
4. Development
   1. Installing Dependencies
   2. Set up Firebase
   3. Start local server
   4. Deploy to production
5. Team
6. Contributing

Usage

To view a live hosted instance of the web app, visit this link.

The mobile app is developed for iOS and can be explored using the iOS simulator included with Xcode (open ThumbsCheck.xcodeproj in Xcode and run build).

You will be asked to login via GitHub. Once you have authorized the application, you will be taken to the main view for a student. When an instructor initiates a poll (either a thumbs check or a mini-quiz), this page will be updated with the poll.

If you would like to use the app as an instructor, you will need to add your GitHub user id to the 'instructors' object in Firebase. Contact the team for details.

Requirements

• Node 0.10.x
• Express 4.x
• Firebase Instance (set up at www.firebase.com)
• Bower
• React Native 0.4.2x

Tech stack

We use an Angular client on top of a Firebase backend. We use the official Firebase integration with Angular, called AngularFire, to gain access to objects stored on Firebase and manage authentication.

Firebase is a 'backend as a service'. It allows us to write very little server-side code and is really nifty for syncing real-time data. Firebase is essentially a Mongo database that stores all data as JSON.

The very thin server we have is based on Node and Express.

The UI is based on Bootstrap.

Bower will install all the front-end dependencis for you. Grunt automates some tasks for us. Unit testing (just a stub for now) is done with Karma and uses Angular-Mocks (included in the Bower dependencies).

For the mobile app we use React Native. The mobile app also communicates with the Firebase backen but through Firebase's REST API rather than through AngularFire.

Development

Installing Dependencies

From within the root directory:

npm install -g grunt-cli
npm install
cd app
bower install

Set up Firebase

Create your own Firebase instance and change the Firebase URL in /app/scripts/angularfire/config.js. The Firebase URL is stored in the constant 'FBURL'.

The only required task in Firebase is to create a key called 'instructors'. The value of this key will be an object with keys in this format: 'github:{github_user_id}' (eg, 'github:123456). The value of this latter key should be a string containing the instructor's display name, eg "Fred Zirdung".

Start local server

In the root directory:

grunt deploy

This will start a grunt process that watches all your client and server files for changes and restarts the server if changes are detected.

Now just open your browser to 'http://localhost:3000'.

Deploy to production

Deploying your app using Firebase is a snap! From the root directory run:

grunt deploy --prod

You will be prompted to enter your Firebase login credentials. Once completed, just navigate to 'https://<your_app_name>.firebaseapp.com/' where 'your_app_name' is the the name you configured in Firebase for your app. We used 'https://waffleup.firebaseapp.com/'.

Contributing

See CONTRIBUTING.md for contribution guidelines.