Overview

In the next three weeks (April 17 - May 5), you'll work in teams to build an interactive web application that is useful to the Wellesley community and is built with and runs on the Meteor framework.

In addition to building the app, you will also work on collaborative code writing (learning to use Github), give a technical talk (with the help of PLTC public speaking tutors), and then perform code review of other teams' code.

Requirements

There are two major requirements for this project:

  1. The topic of the project has to be about Wellesley College (everything that can be tied to the life of a student at Wellesley is allowed).
  2. The app should be written in the Meteor framework and make use of its real-time features.

You are free to use external APIs or D3.js visualizations if your app needs them, but these are not required. The focus of this project is to give you experience with building a Meteor application from scractch by working with peers in the same problem. This experience will be very helpful when you will work on your own IP later in the semester.

Milestones

The Team Project will go over a few phases:

  1. Phase 1: Team creation + idea. Deadline: April 19, end of day. You should sign-up your team in the Google Doc for the Team Project and also provide a short description of your project idea.
  2. Phase 2: Prototype discussion in class. Deadline: April 28, before class. During class time you'll share the link of your app with other teams to get feedback from them and discover bugs or other things that can be further improved.
  3. Phase 3: Meet with PLTC tutors / prepare presentation. Deadline: May 3 and 4. You'll be preparing a short technical presentation (timed) to showcase your app.
  4. Phase 4: Project Presentation. Deadline: May 5, in class. Each team with present their project in class.
  5. Phase 5: Code Review. Deadline: May 6, in class. Teams will give feedback to each-other about the code quality and implementation.

Ideas for the Project

Given the reactivity of Meteor, its best use is to create real-time apps, where one can see live updates from other users. However, apps that are used to keep track of things over time and immediately update some totals are also a good example. Here are some ideas for topics for the Team Project related to Wellesley. Of course, you are not bound at all to any of these. They are not fleshed out in purpose, to not influence your brain-storming process.

  1. Creating / joining study groups in real-time
  2. Course registration planning with friends
  3. Collaborative problem-solving and discussion
  4. Collaborative creation of concept maps when preparing for midterms and exams
  5. Looking for car-sharing opportunities at the last minute
  6. Time-sharing of books or other goods
  7. Generate joint menu order for food-delivery
  8. Keep track of efforts to lower carbon-emmission in campus (maybe like a challenge among dorms)
  9. Keep track of eating healthy (maybe get information from APIs such as NutritionX or Yummly) and compare to friends

Preparation and Work Progress

It will help your work a lot if initially you create a very detailed mockup of how your app will look like and behave. Our guest lecturer will talk about this process on Friday, April 17.

Based on this mockup, you should decide what documents will be stored in the MongoDB database and what fields each document will have. You can also enter data in the database from the console and try different CRUD operations to test that you are getting the desired results.

Once you know what data you'll be storing, and have a mockup of the interface, you can create the HTML templates and embed them in the HTML/CSS of your app.

Now you can write the JS code that has template helpers, template events, and Meteor methods to provide data to the app.

Finally you can add users and make sure that the app does the right thing for different users (keep in mind security as well).

Submission

In your cs249 folder, you should create a TP folder where you will have an index.html page that contains links to all materials you will generate during this period:

  1. A short paragraph that explains what you built and the contribution of every team member.
  2. Link to the completed app, deployed on meteor.com
  3. Link to the GitHub repository that has the final version of your code.
  4. Link to the slides of your presentation.

Make sure to provide dates and short descriptions for all links that you will collect in this page.

Presentation Slides

On May 5, there will be a in-class presentation of the team project. Each team with have about 8 minutes for the presentation and 2-3 minutes per question.

When preparing the presentation, try to allocate equal speaking time to each team member.

Your presentation should have a minimum a five content slides (plus the initial title/names slide). The content slides can contain text, images, or both.

  1. What is the problem you're trying to solve?
  2. Why is it important to solve this problem?
  3. What is your proposed solution and why is it a good solution?
  4. Screenshot of your app with link to live demo.
  5. What remains to be done, or future features that would be good to add.

You are free to add more slides, as long as your entire presentation doesn't go over 8 minutes.

Kee in mind the presentation tips shared by the PLTC tutors and if you need it, sign up for a time to rehearse with them.

Upload the Presentation

To avoid losing time in class with opening your email account, downloading slides, etc., all teams should have their slides online in their folder (see submission instructions above). Given that this is a team presentation, you may use Google Presentation, and make your slides public within Wellesley College.

Alternatively, you can create a HTML/CSS/JS presentation using tools such as reveal.js, impress.js, or others that you may find on the Web.

Grading

This Team Project counts for 10% of the course grade. This will be converted into 10 points divided in the following way:

  • Create team and submit idea in time. [0.5 points]
  • Have a working prototype to test in class. [1 point]
  • Meet with PLTC tutors. [0.5 points]
  • Presentations in class. [2 points]
  • Code implementation (taking into account complexity of project). [5 points]
  • Reflecting about the progress by writing blog posts. [1 points]