Background

We built a multiplayer song guessing game using React, PubNub, Node.js, and MongoDB. The game allows each player to enter their top five songs. Then during each round, a random song is chosen and players need to guess whose song this is before the 10 seconds is up. The game features a join code that you can send to your friends and allows for many games to be played independently at the same time. A critical tool for our game was PubNub which allows real-time updates on each player’s screen when other players make a move.

Timeline

Our project had three major milestones, detailed below:

Milestone 1

• Setting up database with MongoDB, building backend server using Node.js, start learning how to use PubNub for multiplayer games.
• Complete design of join/create game page

• Building frontend and main game logic using React and PubNub
• Complete design of main game page

• Complete implementation of game logic and incorporate design into frontend

Challenges

• Our major challenge was incorporating Spotify into our game. We wanted to allow users to sign in with their Spotify accounts and then use the Spotify API to obtain songs for each of the players and play the song directly in our web application. However, the Spotify API was not returning properly formatted JSON objects, and we could not find any way to parse the information.
• - We also had some challenges at the end of our development period in putting all of the pieces of our project together. We had each developer working on one aspect of the game, one for backend, one for frontend, and one for Spotify, and merging everything together took some extra work since developers were only familiar with their own individual part.

Takeaways

• It was a really rewarding experience to see web development and design work together to create something exciting and creative. There aren’t many opportunities where creative minds and technical minds get to collaborate on a project. It was interesting to see how quickly things came together in the last week or so, from very fragmented pieces to a working game.
• What we learned:
  • How to build a backend server using MongoDB and Node.js
  • Experience working with a Spotify API for the first time
  • Experience working with PubNub, a popular communication API, for the first time

Looking Forward

Looking forward, we could continue to expand our project by:

• A stretch feature: If we find a way to parse the information from Spotify correctly, it should be extremely easy to incorporate that aspect into our game. All of the backend and frontend structure is designed around working with the Spotify API, so if anyone is ever able to figure out how to parse the data correctly, the addition of Spotify features should be straightforward and quick (we were really disappointed about leaving out this aspect of the game.