We often come across instances where we have to arrange, with friends, a timing to meetup, be it for a group project or a leisure activity. It is often troublesome to come into an agreement of a common free time slot. Therefore, it is convenient to have Meetups, a planner modification for NUSMods.

What it does

Meetups is a new tab in NUSMods that features an edit mode, which allows for the editing of your own free time slots, easy importing from your NUSmods timetable, as well as resetting to clear all unavailable slots. Meetups also supports importing of multiple timetable schedules from friends, comparison of schedules within a single timetable, and a toggle View button, to allow for the viewing of common free time slots among all imported friends.

How we built it

We started off using the existing NUSMods as a reference to discuss what features we should include in our modification. Then, we used to come up with a wireframe of the features that we wanted to implement. Thereafter, we split the features among the team to each individual to investigate how similar features were implemented in NUSMods, and take charge in developing them.

Challenges we ran into

Firstly, our team is mainly comprised of members who have limited experience working with web applications. As a result, there was a steep learning curve involved. For a good amount of time, we had to first understand the framework that NUSMods was built using, and its project structure and implementation of its features before being able to extend Meetups' functionality into it.

Code wise, we found that the data structure stored by NUSMods was incompatible with our modification. One of the main features we were going to create was the ability for users to block out custom time slots on top of what's already blocked out by their existing NUSMods timetable. As a result, we had to come up with a new overarching state for the meetup feature. The is what we came up with.

type TimetableDay = (0 | 1)[ ]
type Timetable = {
    Monday: TimetableDay
    Tuesday: TimetableDay
    Wednesday: TimetableDay
    Thursday: TimetableDay
    Friday: TimetableDay
    Saturday: TimetableDay
    Sunday: TimetableDay

There were two main reasons why we did it this way. Firstly it made it easier to convert the TimetableDay array into the query string for our share feature and secondly, it made it easier for us to convert the TimetableDay array into the TimetableArrangement type of the existing timetable component already used in the existing timetable feature of NUSMods.

Accomplishments that we're proud of

At the end of it all, we managed to reuse many of the existing components in NUSMods to create our add-on feature, allowing us to meet the tight 24-hour deadline of the event. All of the basic features that we planned for has been implemented in our final product despite the short timeline.

What we learned

Good collaboration is important for a team to complete the project within a short period of time.

What's next for Meetups

In the future, Meetups may want to support downloading of Meetup's timetable image for sharing, and make use of persistent states with Redux.

Built With

Share this project: