Blobber Buddy Chat

We are living in a post-pandemic era where social distancing and germaphobia is our new normal. Finding friends is becoming more difficult and strangers are becoming stranger! Blobber's got your back.

Comment

Inspiration

We are living in a post-pandemic era of human history where social distancing and germaphobia is our new normal. This means that the typical chance encounters where you can find unlikely friends at the local coffee shop, in between classes at school, or even social events like parties and concerts have dwindled down to almost zero.

Humans crave social connections more than anything, and Zoom meetings and lectures simply do not fill that need, simply because it does not foster an environment where people are there to make friends.

What it does

BLOBBER offers the ideal friendship making environment by allowing users to connect with each other in chatrooms where they can bond over things that interest them. BLOBBER chatrooms are broken into categories, like Anime, Fine Arts, Tech, etc, where users can select whichever interest or topic they would like to talk about and connect with other online users to organically make friends. After all, people like people who like mostly the same stuff as them right?

Users are able to register and specify their pronouns so others can know how to refer to them. In addition to secure login and registration, there is an additional layer of security associated with logging in and registering, implemented by recaptcha to avoid bot and spam accounts.

How we built it

We built BLOBBER using Flask, socket.io, html and css, as well as a bunch of other libraries and open source tools that we learned from completing Trainual assignments and Facebook talks:

  • We used socketio for the chatroom
  • HTML / CSS for front-end design
  • Postgres for our backend database
  • Flask for our web framework
  • Nginx to reverse proxy to connect Flask
  • Created a blobber.tech domain
  • Contained our webapp, nginx and database for security and efficiency
  • Use cAdvisor, Prometheus and grafana for monitoring containers in real time
  • Created a custom CI/CD pipeline with Github Actions for testing, linting
  • Deployed on AWS with domain name and ip blocking
  • Use google reCaptcha to help with replay attempts

Challenges we ran into

One challenge we ran into as a team was getting used to Flask-SocketIO. After some online research we found that socketIO isn't backward compatible so we had to find compatible versions of socketIO server components and the javascript client to work together. Another issue we ran into was socketIO would break in development mode so we had to do most of our coding in flask-production mode. The last issue was getting socket.IO to run over HTTPs. We tried a lot of NGINX configuration settings and even tried an Apache docker image just to see if it would go through. We finally found the namespace we had missed to switch socket.io sending messages from HTTP to HTTPs and it worked wonderfully. In the end we had a lot of fun coding and learning a lot while creating this project as a team.

Accomplishments that we're proud of

We were not only able to pull off a functional website application that checks off all the boxes for the systems side of things, but we were also able to make it look fun and really bring out the ambitious vision of what we had for our final project. Everyone on the team worked super hard and worked really well together!

We also are proud of the fact that we were able to get nginx working with socket.io since there was a lot of early issues with integrating socket.io with our flask application which caused a lot of anxiety within the team since the biggest part of our application is realtime chatting with other user accounts. Even though the matchmaking algorithm is not in the final version of this project, we're super proud of how we wrote it since its pretty comparable to how modern-day matchmaking sites like Bumble do their matchmaking with their users.

What we learned

We learned so much about how much detail goes into deploying a functional flask application, not only from just the front-end perspective where we are developing the wireframe of how the website is going to look like and what kind of functional components we needed to develop, but also the system perspective that comes with setting up databases to storing user information as well as testing, hosting, and containerization of the website and its components. We were able to not only recall the information and lessons we learned from completing our weekly Trainual assignments, but also use the information we learned from Trainual and the daily Facebook mentor talks (hosted by Kunal) for our final flask application project. We also learned how valuable good teamwork and communication is when working on code sprints, since we were able to accomplish so much in the past three weeks. A major thing we learned was how difficult it is to integrate socket.io with flask applications, but we were able to get everything working smoothly!

What's next for Blobber Buddy Chat

We currently have a separate branch of the project where we have almost finished implementing a more ambitious version of BLOBBER. It includes a matchmaking algorithm as well as a profile questionnaire page that first-time users can fill out before accessing the dashboard. In this version, users are pre-matched with other users that could be compatible with each other according to the algorithm. Our next step for BLOBBER would be to fix bugs currently in this version and integrate it into our current deployment of the website.

Share this project:

Updates