Skip to content

alex1504/PetalFM

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

27 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

PetalFM

A simple and delicate Music FM SPA built with react.

react react-router js-standard-style Dependency Status MIT Licensed

Preview

The following pictures are interface display in wechat in IOS 8Plus device. preview preview preview preview

Online Address

Visit http://fm.huzerui.com/, you can get better experience on mobile phones, sweep the qrcode below. qrcode

Test Account

  • Username: petalFM
  • Password: petalFM

Based on

based on

Feature

  • Material design style interface based on MaterialUI. The main color is pink tone.
  • Using backend clouds (leancloud) to provide data services.
  • Customize your exclusive FM by label preferences and collections.

Function

  • Login, regist and logout
  • Customizing personal preference labels
  • High qualityFM, private FM, red heart FM channel for choice
  • Search songs, collect songs, download songs
  • Add songs to the trash bin or recycle songs from it
  • Personal configuration, topic switching, etc.

Redevelope

Pre work:

  • Step1: Clone the project in local environment by command git clone https://github.com/alex1504/PetalFM.git
  • Step2: Execute command npm install
  • Step3: Regist an account in https://leancloud.cn/ and create an application in leancloud admin panel.
  • Step4: Import database table in database directory and create a superuser in _User table in leancloud admin panel.
  • Step5: Change /src/services/config.js
export const APP_ID = 'YOUR APP_ID FOUND IN LEANCLOUD APP SETTING';
export const APP_KEY = 'YOUR APP_KEY FOUND IN LEANCLOUD APP SETTING';
export const SUPER_USER_OBJECT_ID = 'YOUR SUPERUSER ACCOUNT OBJECT ID';

Only the superadministrator can see the admin entrance, in which you can search and input a song and set song category.

Dev:

  • Step6: Execute command npm run dev
  • Step7: Redevelop the project.
  • Step8: Execute command npm run build and view the optimised code in /dist/ folder.

Deployment:

  • Step9: Deploy: Make sure to proxy /api/ to http://music.163.com/api. In development you don't need to care about this for webpack-dev-server has done which is config in package.json, but in deployment you need to make proxy by nginx or nodejs server.

More

License

MIT © alex1504

About

🎵 A simple and delicate Music FM SPA built with react.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published