Inspiration

MCIT online students live in 39 countries. In the United States, students are dispersed across 47 states. It can be an isolating experience. In such a disconnected world, it can be hard to connect with other students. Right now, there are location-specific slack channels for different regions of the world where students connect virtually and attempt to coordinate in-person meet-ups in an inefficient way.

What is Founding Friends?

Founding Friends was designed by MCIT online students for UPenn students. The website provides an intuitive portal for students to create events and sign up for in-person and virtual events. The website uses the UPenn email to log in so that only UPenn students can sign up for events. Each event page allows students to efficiently share Zoom meeting links for virtual meetings and photos from the event. Once logged in, students can filter for events in their area or on certain dates. Students can create a profile to share a brief bio, their interests, and which classes they have completed.

How We Built It

We used Next.js and React.js for our framework. We used Tailwind CSS and the Chakra UI library to style our frontend. We primarily used Typescript throughout our project.

On the back-end side, we connected our website to MongoDB and AWS Cloud Services. We stored user profile details and event information in separate MongoDB collections and stored user uploaded images in an S3 bucket on the AWS Cloud. We used libraries such as react-dropzone to enable a user-intuitive drag-and-drop functionality for the photo upload and Luxon for date/timezone calculations. We leveraged Next-Auth for the login authentication to ensure only students with UPenn SEAS Gmail accounts are able to log in.

We used PhpStorm and VS Code as our IDEs. We used Git, Notion, and Slack to coordinate and work together on this project

Challenges We Faced

During the hackathon, we overcame many challenges for both the front-end and back-end. We decided to try new programming languages, frameworks, and packages. Most of our time was spent researching available packages and frameworks as well as reading documentation and watching YouTube videos. Of course, we also spent hours debugging when the code did not perform as expected.

One major challenge we faced was regarding the issue of time zones. As we planned our website to cater to UPenn students from all around the world, we knew it was a necessity to display time zone accurate dates and times so that our users will never be inconvenienced. Our primary issue was figuring out the best way to store our event dates in the face of the plethora of different time zones our users could be in. Ultimately, we used the Luxon library to set every event's time zone to UTC; once the user begins fetching the event data, the datetime in the data will be converted to the user's local time zone.

Accomplishments that We're Proud Of

Using new programming languages, frameworks, and packages we have never used before, we built a custom website from scratch.

What's next for Founding Friends

More Responsive UI - Making our website more accessible and mobile friendly

Slack and Discord Bots - Integrate with Slack API for users to create and join events without needing to sign-in

Gen-AI Personalized Recommendations - Based on user interests, suggest nearby events for user to attend

Reminder Notifications - Notify users about upcoming events, deadlines for RSVP, or changes in event details

Rating & Feedback - Allow attendees to rate events and provide feedback to help hosts improve

Analytics Dashboard - For event organizers to gain insights into attendance patterns, feedback, and other metrics

Chat Groups - Create communities for students to meet around common interests

Digital Wallet - Integrate payment options for events that have costs or split bills during gatherings

Carpool - Coordinate carpool rides or ride-share service to in-person events

Badge & Achievements - Gamify the experience by offering badges for attending a certain number of events, hosting events, or other milestones

Built With

Share this project:

Updates