/the-tone-zone

Primary LanguageJavaScript

ToneZone

ToneZone is a web application for listening to music and connecting with your peers and audience. I used SoundCloud as my main source of inspiration and built it using React.js, Redux, and Express/Sequelize.

ToneZone Live Link

Splash page (unauthorized user)

Screenshot 2023-05-30 at 8 36 53 PM

Home page (authorized user)

Screenshot 2023-05-30 at 8 39 28 PM

Stream page

Screenshot 2023-05-30 at 8 41 19 PM

Individual Song Page

Screenshot 2023-05-30 at 8 42 36 PM

Feature list

  • Integrated continuous playback using the react-h5-audio-player in conjunction with Wavesurfer.js
  • Use of redux allows for data to be rendered correctly in real time and for currently playing song to be saved throughout renders on page
  • Sign in/sign up with email/username
  • Can upload/play/edit/delete audio tracks posted by other users or your own music
  • Images and audio files can be loaded with tracks and will render on the page once uploaded
  • Users can create, edit/delete their own tracks
  • Users can create comments on tracks and delete them
  • Users can search for songs and users
  • AWS upload configured
  • Discover page displays the most recent tracks uploaded by users

To-do

  • Likes
  • Tags
  • Shares
  • Follows
  • Notifications