Our project is named ClubTime because it forms a compound of its two main functions, to serve as a hub for clubs and other social events, and to help reduce procrastination with proper time management. We were inspired to make ClubTime because we noticed that there was a significant drop in school spirit and sense of community with online learning compared to previous years, with many club executives reporting lower membership rates in the 2020-2021 school year. That served as the reason why we decided to congregate clubs and school events in ClubTime, so that we could revive school spirit and create a greater sense of community in online learning environments. In addition, we’ve also noticed that procrastination has gotten worse during online learning, due in large part to poor time management. That served as the inspiration for the calendar, which can aid in proper time management by planning out a schedule in order to avoid procrastination.

What it does

ClubTime has two main sections, the calendar page and the “Explore” page.

The main page contains the calendar. The left panel features your calendars and clubs. The calendars section allows the user to enable or disable specific calendars, and new calendars can be added by clicking the plus button. The club section allows you to enable or disable the calendar for a specific club. User specific events can be added by clicking a specific day on the calendar.

The “Explore” page contains a carousel that features clubs and another carousel that features upcoming events. Featured clubs and events carousels can also be cycled through by clicking the arrows on either side. Clicking on a club will navigate the respective club page, with a brief description of the club, the member count, and a button to join the club, which will add the club’s calendar to your clubs list on the main page. Clicking on an event will create a pop-up with event details and the option to add it to your calendar.

How we built it

We used ReactJS to create the components of the website like the navbar, calendar, carousels, and popups. To host the website, we used Github Pages.

Challenges we ran into

We ran into time constraints due to how long it takes to create components of the page in React. We also ran into configuration issues with Github Pages displaying the readme file, which took a while to fix. Also, using a carousel library was quite challenging since the documentation was not clear and to the point.

Accomplishments that we're proud of

We are proud that we were able to complete this project in such a short amount of time, especially when only two out of our three team members knew how to code.

What we learned

We learned that we should have practiced before the competition started so that all our team members would have known how to do web development. We also learned that libraries are useful for saving time, as we spent a lot of time on many components when there were other libraries which had already implemented our target features.

What's next for ClubTime

We want to integrate our calendar with other calendars such as Google Calendars, to allow more people to use ClubTime. We also want to create a desktop app so we can notify the user of any events coming up soon.

Built With

Share this project: