Computer Science Mentors (CSM) Connect

Homepage
About
Sign Up
Login
Reset Password
Profile
Dropdown Menu
Blank Calendar
Add Meeting
Calendar with Event
Meeting Details
Edit Meeting
Delete Meeting

Inspiration

During the COVID-19 pandemic, I heard from many of the computer science students that I teach at my university that they feel isolated, without someone to talk to about course and career advice or to vent to about life. CSM Connect aims to bring together computer science students all around the world during some of the most trying times in modern history. Mentors can create one-on-one mentoring sessions via our scheduler, and students can use the app to sign up for one-on-one conversations with a mentor. The goal of our app is for students and mentors to learn from each other through discussing topics important to them!

What it does

The app functions as a scheduler where mentors can create mentoring appointments, and students can sign up for them. There are two types of accounts: mentor and student. The mentor account can create appointments, edit appointments, and delete appointments. The student account can join or leave appointments. Mentors can view all their created appointments, and students can view all the appointments they signed up for on a calendar. Every time there is an update to a meeting (student joined, left, meeting cancelled, etc.), there will be email updates sent out to the mentor and participant.

How I built it

For the database, I used PostgreSQL. I used the Django framework to code the business logic (creating/editing meetings, etc.). I used React to build the calendar; HTML, CSS, and Bootstrap were also used as part of the front-end. Our team's UX designer, Jhinuk Barman, designed all of the webpages using Figma.

Challenges I ran into

We ran into numerous challenges; one of the biggest challenges was building the calendar. The most difficult part of building the calendar was figuring out how to place the events accurately on the grid so that the column corresponds to the day of week, row corresponds to starting time, and height corresponds to the duration. It was very easy to get the calculations wrong; I tested numerous times to make sure I covered all corner cases. Another challenge we ran into was error handling. We had to imagine all of the ways our app could break: for instance, in event creation, a mentor could enter a date/time of the incorrect format, an invalid date/time range, or miss fields. We had to think about how our app should handle the errors: how would we detect the error, and what would we display as an error? We also faced the challenge of hosting our app. We wanted to choose a platform and storage service that had high latency and availability: we decided on Heroku as the platform and AWS S3 as our storage.

Accomplishments that I'm proud of & What We Learned

We are so proud of learning the following: PostgreSQL, Django, React/Javascript, HTML/CSS, and UI/UX design. Most importantly, we loved learning the product design process: throughout our ideation process, we learned that we should always keep the end users in mind and think about how we can make our product accessible to them. We learned that little features, such as scrolling navigation for the calendar, can make the product so much easier to use.