V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
spades
V2EX  ›  前端开发

MusicHub -- 三合一(qq、xiami、网易云) 音乐搜索

  •  
  •   spades · 2018-05-22 12:17:48 +08:00 · 1401 次点击
    这是一个创建于 2138 天前的主题,其中的信息可能已经有所发展或是发生改变。

    每次去搜个歌,碰巧又不知道在哪个平台发布,这个时候是不是很烦,要去每个平台上搜一遍。前两天 周月半 发了新歌《不爱我就拉倒》,我前后找了两三个平台,最后发现是 QQ 音乐独家发布,更可气的是我没有 qq 音乐 app,orz.....

    效果

    点开看啦 MusicHub

    简介

    MusicHub,三合一搜索平台,数据来源:网易云、QQ、虾米。

    Demo 地址:MusicHub

    git

    MusicHub 记得给 star 啊朋友们

    工程结构

    -- musichub
        -- App
            -- build   => webpack 配置文件
            -- config  => 工程配置文件
            -- src     => 前端源文件目录
            -- static  => 静态资源文件目录
            -- index.html  => htmlwebpackplugin 模板文件
            -- package.json  =>  依赖文件
        -- Server
            -- config  => 工程配置文件
            -- router  => 路由
            -- service => server 服务
            -- spider  => 爬虫
            -- static  => 静态资源
            -- view    => 页面 html 文件
            -- package.json   => 依赖文件
    

    技术栈

    • 前端(App)

      • vue + vue-router + webpack
      • 浏览器兼容:利用两套代码做了 PC、mobile 兼容,PC 端用了 Element 组件、Mobile 端用了 cube-ui 组件
      • 代码风格检查:Eslint + airbnbbase
    • 服务端(Server)

      • Koa:利用 koa 搭建了 RESTful API 服务器
      • request:spider 使用 request 请求数据
      • 服务端渲染:解析 UserAgent,判断当前设备类型:PC/Mobile,根据设备类型渲染对应页面

    快速使用

    • 前端(App)    - 安装依赖:yarn (建议使用 yarn 安装依赖,依赖里有一个 git 仓库(对 cube-ui 做了修改),npm 5.5.1 会报错

      • 开发模式运行: yarn run dev (需要将 App/src/view/desktop/components/Result.vue 和 App/src/view/desktop/components/Result.vue 中 axios.defaults.baseURL 设置为 'http://localhost:3000/api/v1'
      • 打包:yarn run build,打包生成 html 文件将会在 Server/view 目录下,其他文件(css、js 等)会在 Server/static 文件夹下(需要将 App/src/view/desktop/components/Result.vue 和 App/src/view/desktop/components/Result.vue 中 axios.defaults.baseURL 设置为 '/api/v1'
    • 服务端(Server)

      • 修改端口:修改 Server/config/index.js 中 port
      • 开发者模式运行:yarn run dev
      • product 模式:yarn run prod
    viazure
        1
    viazure  
       2018-05-22 14:20:38 +08:00
    速度很快,赞一个
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   3409 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 26ms · UTC 10:38 · PVG 18:38 · LAX 03:38 · JFK 06:38
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.