PlaylistExplore

Usage

git clone https://github.com/HcwXd/PlaylistExplore.git
cd PlaylistExplore
npm install
npm start

Demo

Link: https://playlist-explore.herokuapp.com/homepage

功能說明

1. 登入： FaceBook登入，自動串接大頭貼和使用者名字

2. 新增歌單

   • 查詢功能：
     • URL: 直接傳入歌曲Youtube URL加入歌單
     • 關鍵字： 支援youtube關鍵字Auto Complete，送出搜尋後列出與關鍵字最相關5筆
   • 針對每首歌加入描述
   • 針對歌單貼文加入描述

3. 歌單頁面

   • 使用者留言
   • 使用者的讚
   • 自動播放下一首

4. Explore

* 列出最新釋出的歌單，每個貼文都可以連結到歌單頁面

* 彩蛋： ``待機三秒``後，出現炫砲``動畫``，``滑鼠``所在的地方會``浮出一首歌``，點擊後可以進入歌單聆聽(另類的隨機播放！)

Demo Image

Facebook 登入

Auto Comolete

與關鍵字最相關五首

增加歌曲描述

成功加入歌曲

發布歌單

個人歌單頁面

炫砲動畫！

Built With

• css
• html
• javascript