Coder Social home page Coder Social logo

oriravid / appo-music Goto Github PK

View Code? Open in Web Editor NEW
98.0 3.0 37.0 163.42 MB

A full-stack clone of the incredible Apple Music online streaming platform, with an aim to re-create it's core features, seamless design, and excellent user experience.

Ruby 3.23% JavaScript 94.32% CoffeeScript 0.07% CSS 0.09% SCSS 1.92% HTML 0.37%
music-player songs album add-songs playlist streaming

appo-music's Introduction

Appo Music

About

Appo Music is a full-stack clone of the incredible Apple Music online streaming platform, with an aim to re-create it's core features, seamless design, and excellent user experience.

Backend:

  • Ruby on Rails

Frontend:

  • JavaScrip ES6
  • React
  • Redux

Features

Music Player

  • Fully functional music player
  • Clicking/playing a song adds song to music player and automatically creates a queue of next songs
  • Loop/shuffle functionality (setting saved for next session if logged in)
  • "LCD" display with current playback information and relevant links to song artist & album
  • 30 Second previews for logged out users
  • Space bar support to play/pause from keyboard

Search

  • Live search the entire database
  • Results seperated by appropriate categories
  • Selecting a result leads to relevant page

Artist Page

  • Displays most recent release and chronological discography
  • Live list of top songs โ€“ calculated by play count
    • Selecting a top songs leads to album that contains it, hightlights song, and brings it into view for easy selection
  • Quickplay
    • Start playback of artist's most popular songs
  • Artist description modal

Album Page

  • Displays album track listing and information
  • Ability to save individual songs or entire album to user library
  • Ability to add song to playlist

Playlist CRUD

  • User can create, rename, delete and add songs to playlist
  • Playlist page contains all playlist songs with a rotating display of their album's cover artwork

User Authentication

  • Simple, yet elegant modal for user account creation and login
  • Demo user provided with automatic login functionality

Future Features

  • Up/arrow/enter key functionality on album/playlist pages
  • Improved mobile compatibility

appo-music's People

Contributors

oriravid avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

appo-music's Issues

Readme for backend?

Hi there, first well done for the great work. I was looking at the site you have built and think it would be great for a music project I want to try and build. I have some music files, music art images, on S3 storage on AWS. I was wondering would it be possible that this would be able to be hosted on AWS with the Backend so I could play the files from their. I haven't used Ruby on Rails as a backend before so am unsure if its even possible. I'm just starting with React and React Native currently. I'm still in college learning cloud and the various languages and methods associated with deploying content.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.