Stream Team

• 

  Landing Page

• 

  Pick a Movie

• 

  Options

Challenges/Categories

We would like to be considered for the Media Track, and the following categories - Best Woman's Hack, Most Fun Hack, Best Domain Registered with Domain.com (StreamTeam.tech), Best Use of Google Cloud.

Inspiration

The inspiration for this project comes directly from our personal experiences of spending hours deciding on a movie to watch. Especially during the pandemic, when everyone is using extensions like Netflix Party to watch together remotely, deciding what to watch collectively as a group can sometimes take hours. This is an issue that everyone consuming this form of media faces, which can easily be solved with technology.

What it does

Introducing Stream Team, a website that helps you choose what to stream as a team! Through a unique link, each group member can pick the movies they want to watch, and our algorithm will use that to find a movie that everyone wants to watch. Users also have the option to choose the genre and streaming service they want to watch from, to get a personalized list of movies to choose from.

How we built it

Stream Team was built using React.js with a Firebase Realtime Database to store all our user data and the list of movies. The app also uses Bootstrap for styling. The scripting was done using Node.js, and we also used libraries such as React-Router-Dom for the routing of the site.

Challenges we ran into

This was our first time using the real-time database, so the learning curve was quite steep. We had a lot of trouble understanding and planning how to store the data and how to retrieve it, but we eventually figured it out. We also had some challenges throughout with the technology we used, and certain parts of the app worked differently on our different devices. However, we worked together to get through those challenges and still create a great application that we're super proud of!

Accomplishments that we're proud of

We are particularly proud of how we overcame our challenges during this Hackathon to still be able to build something we were passionate about. Our use of the Realtime Database for the first time was also something that we were excited about, and our ability to work together quickly and efficiently in an online environment worked in our favor.

What we learned

We learned a lot about creating databases and planning out how to structure them beforehand. We also learned a lot about the importance of design, which is crucial to a proper app, and most importantly, we also realized that design is an area that we could definitely develop more in. We learned a lot of lessons as well about formatting our code and comments in a way that is not difficult to read or follow, which is important when collaborating on code online.

What's next for Stream Team

In the future, we’d love to be able to offer more functionality, such as real-time movie matches and a more sophisticated UI. It would also be great to have Stream Team as a mobile application as well. We’d also like to add a larger database of movies in the future.

Built With

• bootstrap
• css3
• firebase
• html5
• imdb
• javascript
• node.js
• react.js
• realtime-database