# react-NeteaseCloudMusic-mobile

**Repository Path**: dengzy321/react-NeteaseCloudMusic-mobile

## Basic Information

- **Project Name**: react-NeteaseCloudMusic-mobile
- **Description**: 本项目是一个移动端仿网易云音乐的 Web 应用，前端使用 React 构建，后端基于社区开源的 Node.js API 接口服务（感谢 Binaryify/NeteaseCloudMusicApi）。

市面上大多数仿网易云的项目多为 Vue 实现，本项目作为 React 版本实现，旨在提供一个 React 学习参考案例。
- **Primary Language**: JavaScript
- **License**: AFL-3.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 3
- **Forks**: 1
- **Created**: 2019-10-31
- **Last Updated**: 2025-09-07

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 🎵 仿网易云音乐 · 移动端 Web 项目（React + Node.js）

## 📌 项目简介

本项目是一个移动端仿网易云音乐的 Web 应用，前端使用 **React** 构建，后端基于社区开源的 **Node.js API 接口服务**（感谢 [Binaryify/NeteaseCloudMusicApi](https://github.com/Binaryify/NeteaseCloudMusicApi)）。

市面上大多数仿网易云的项目多为 Vue 实现，本项目作为 React 版本实现，旨在提供一个 React 学习参考案例。

> 🕒 最后更新时间：2020-01-30  
> ✅ 后续会根据空闲时间不定期更新与优化。

---

## 🧩 技术栈

- **前端：** React + React Router + Axios + Flex 布局 + SCSS
- **后端：** Node.js（基于 [NeteaseCloudMusicApi](https://github.com/Binaryify/NeteaseCloudMusicApi)）
- **适配平台：** 移动端浏览器（响应式布局）

---

## 📺 项目演示

- 🔗 演示地址： [http://music.dengzy.cn](http://music.dengzy.cn)
- 👤 演示账号：
  - 手机号：`root`
  - 密码：`123456`

> _如遇接口无法访问，请检查后端服务或访问限制。_

---

## 🛠️ 安装与运行

### 1️⃣ 后端部署

```bash
git clone https://github.com/Binaryify/NeteaseCloudMusicApi.git
cd NeteaseCloudMusicApi
npm install
node app.js
```

### 2️⃣ 前端部署

```bash
git clone <你的前端项目地址>
cd <项目目录>
npm install
npm start
```

> ✅ 若使用淘宝源，可用 `cnpm install` 加速安装。

---

## ⚠️ 注意事项

- 请确保本地已正确安装 `Node.js`。
- 后端需先启动，前端请求接口需依赖后端服务。
- 接口文档请参考： [API 文档](https://binaryify.github.io/NeteaseCloudMusicApi)

---

## ✅ 已实现功能（截至 2020-01-30）

<img src="https://images.gitee.com/uploads/images/2020/0130/112040_606a0795_2241364.png" width="30%" />

- 登录 / 登出
- 首页推荐列表
- 歌曲详情页
- 播放控制条
- 歌词展示
- 我的歌单

---

## 📷 软件截图

<div align="center">
  <img src="https://images.gitee.com/uploads/images/2020/0130/114744_eaa57cdf_2241364.png" width="45%" />
  <img src="https://images.gitee.com/uploads/images/2020/0130/114758_b76a2976_2241364.png" width="45%" />
  <img src="https://images.gitee.com/uploads/images/2020/0130/114815_5d5a94a6_2241364.png" width="45%" />
  <img src="https://images.gitee.com/uploads/images/2020/0130/114826_7ec7c58b_2241364.png" width="45%" />
</div>

---

## 🙏 致谢

- 感谢 [@Binaryify](https://github.com/Binaryify) 提供高质量的网易云音乐 Node 接口。
- 项目仅用于学习交流，禁止用于商业用途。

---

## 📮 联系交流

如有建议或问题，欢迎提 Issue 或 PR，感谢支持！