Team Snitch'd
presentMusic Clash

Music Clash Demo Video

Music Clash Demo Video

Music Clash is a game to test your music knowledge in the style of NYT’s “Connections”.

MUSIC CLASH is a mobile and web app game designed to test your music knowledge. In the game, you match 16 random songs to their correct artists. One of our unique features allows users to sign in with Spotify to generate a personalized set of songs from their own library. Users can easily sign up and log in, and the app offers an exciting multiplayer mode to compete with friends. MUSIC CLASH combines engaging gameplay with social interaction, creating a fun experience for all music lovers.

How we came up with the idea? We like puzzles, and we like music and we love challenging friends!

The Team

  • Team member imagePreview: Team member image

    Jez Piedad

  • Team member imagePreview: Team member image

    Robert Chapman

  • Team member imagePreview: Team member image

    Ted Smiles

  • Team member imagePreview: Team member image

    Hasan Chowdhury

Technologies

Logos for Expo, Socket.io, Spotify, TypeScript, Supabase, Tailwind, React, Axios, Node.JSPreview: Logos for Expo, Socket.io, Spotify, TypeScript, Supabase, Tailwind, React, Axios, Node.JS

We used: React Native, Expo, Supabase, Socket.io, Nativewind CSS, Node, Typescript, Spotify OAuth, Axios

React Native: Enables cross-platform mobile app development for iOS and Android
Expo: Simplifies React Native development with built-in tools and services.
Supabase: Provides backend-as-a-service with real-time databases and authentication as well as really flexible table creation and editing. Also required for local development and testing.
Jest: To have a fully tested back-end.
Socket.io: Facilitates real-time, bidirectional communication for our multiplayer functionality
Nativewind CSS: Integrates Tailwind CSS with React Native for styling.
Node: Powers server-side functionality with JavaScript.
Typescript: Adds type safety to JavaScript code to keep the project consistent.
Spotify OAuth: Manages user authentication through Spotify.
Axios: Simplifies HTTP requests and API communication.

Challenges Faced

  • Project setup and familiarising ourselves with new technologies in a short amount of time.
  • The friendly annoyance of typescript.
  • Not having any merge conflicts.
  • Deciding what we want in our app (MVP)

FAQs