This is a web app built with MERN technology stack, provides a unified portal page to show results from several online music providers' API. To help users play and get info about songs in different languages or districts instead of irrelated feedbacks from single platform.

Using npm:

npm install
npm install @material-ui/core
npm install @material-ui/icons
npm install react-jinke-music-player --save

Using yarn:

yarn install
yarn add @material-ui/core
yarn add @material-ui/icons
yarn add react-jinke-music-player

Using npm:

npm install

Using yarn:

yarn install

Using npm:

npm start

Using yarn:

yarn start

(You need to enter different directory to run the client and server side respectively)

The portal page will now run in your default browser at: http://localhost:3000/

And a backend server will be listening port 3001 for communicating with the database. i.e.: http://localhost:3001/

Search and play music from Spotify/Netease Music, allow you to listen to Chinese and English songs within one website simultaneously.

Music content is retrieved from APIs for each platform, you can add songs to your own playlist and listen to them.

Register and login to the portal with your own credentials, can set personal avatar.

Search music from the above two platforms at one time, results displayed by each platform, you can choose the one you like to the playlist. At the same time, this app not only searches for songs, but also displays the corresponding music list and mv.

After selecting and adding music to the playlist, you can store the list and load when you need.

Although none of us had studied react before, we learned the basics of react through this course. As a popular development tool, it was put to good use in this project and we were able to gain experience in using react through this program.

With its flexibility and performance-oriented approach, React can be used to build high-end single-page applications with an interactive interface. By using its powerful code base, developers can easily use the code's features on both the server and the browser.

We use MongoDB as the database for storing user and affiliated information. It allows us to use JavaScript for both client-side and server-side code.

We have used GitHub as a free remote repository before, especially as we have teammates who have studied 719 and are already very familiar with its operation, so version control for this project is no problem at all to put on GitHub. In fact, GitHub is also an open source collaborative community, and through GitHub, it is possible to involve others in both your open source projects and in others' open source projects.

For project management, the agile development approach is our preferred choice. There are normally three roles in a Scrum agile team: the Product Owner, the team (development team) and the Scrum Master.

Given the impact of the epidemic at the beginning of the school year, we decided to use mainly online tools for project management. The online Kanban program Trello therefore became our project management tool, as it was ideally suited to the agile development model.

As normal Agile Kanban, we use elements like Backlog, sprint, retrospective to fulfil the management process. Especially for the one who are not familiar with this methodology, it provides friendly UI that can make us quickly adapt to it.

For each sprint, we can track different user stories, assign it for each teammate. The labels can help us with status of changes.

After each sprint, we will have retrospectives. We put our disscussion and debate on specific Trello board. This helps us to make better progress and improve development efficiency.

We would like to thank @Binaryify for the NetEase Music API, @lijinke666 for the beautiful/powerful/customizable player and Spotify for providing the APIs that allow us to obtain music resources and info.

For detailed API documentation, please refer to API Documentation.