ClubHub

Inspiration

Stanford organizes two club fairs each academic year, providing a primary but limited avenue for students to explore new clubs and communities on campus. Beyond these events, opportunities for discovering and engaging with campus organizations are scarce. Given the evolving nature of student interests and schedules in college, a more consistent and accessible source of information of active groups would benefit both students are large and club leaders, proving opportunities to make new connections, learn new skills, and grow club enagement, by attracting new members.

What it does

ClubHub is a personal portal for discovering and joining social groups on campus. It’s key features are the directory, inbox, and group profile pages.

Directory - A filterable database of groups on-campus. Clubs are tagged with “Interests” (relevant keywords that describe their programming), “Meeting Day” (weekday of their most consistent meetings), and “Commitment Level” (expected engagement on a scale from I-III). The filters assist users in searching for clubs that align with their interests, schedules, and involvement preference. Also included is a button to join each club, which takes you to the club’s website.

Inbox - A dedicated destination for newsletters and club announcements. The goal is to separate club/event newsletters to prevent clutter and distraction from personal and professional emails in students’ main inboxes. In a student’s ClubHub portal, they can manage all group and event related announcements on their Inbox page with the ability to reply, archive, and delete old messages.

Group Profiles - Each group has a profile that includes their logo, tags, pictures, and a bio.

The Build

Backend: API - Rust, Framework - Axum Frontend: React.js, Next.js, CSS, HTML, TypeScript Design: Figma Mockup

Challenges we ran into

All three of us came in without any experience building a website
One of our teammate’s laptop’s screen repeatedly crashed at the beginning of the hackathon
Learning how to deal with async API calls in React components
Translating complex Figma designs to CSS (originally we tried to use Chakra FigPilot, but we encountered bugs with the plug-in, so we went the manual route instead)
Building an ideal data model that will allow for extensibility in the future

What's next for ClubHub

Even though we didn’t get to implement everything we had planned for, we’re passionate about the idea and have high hopes for the continued development of the project. Here are a few of our next steps:

Include more groups Implement profiles for each group Include more filters (time of day, group size, etc.) and capabilities (filter by intersection) Implement the inbox Incorporate subscribable mailing lists Allow users to sign-in and follow groups and/or subscribe to mailing lists Create a campus events page with RSVP functionality