Giter VIP home page Giter VIP logo

music's Introduction

music

花了一个星期时间做的的基于SSH一个小型WEB项目,界面仿的是桌面版的网易云音乐,采用前后端分离,使用iframe将多个浏览界面整合到一个网页上了,主页和iframe里的网页之间的交互postMessage通过跨文档请求结合sessionStorage来实现,消息实时通知功能是通过webSocket来实现的。前端界面元素使用了bootstrap,图标是“阿里巴巴矢量图标库”里找的,设计的时候并没有进行响应式布局处理,主要用到了bootstrap里的栅格化布局和按钮,模态框,表格等元素。同时也用到了angularJs,angularJs的ng-repeat非常好用,我主要用它来控制歌曲列表和评论列表之类的显示,这比使用jquery直接操作dom要方便多了。前端和后端的交互是通过json和ajax来实现的,所以struts2的action基本都是用来返回json的。

这个项目我在自己的云服务器上已经部署:

   访问链接http://www.myfirstday.cn/music

主要的技术:

前端:html5,css3,javascript,jquery,bootstrap,angularJs
后端:java,struts2,hibernate4,spring4,webscoket 图标:阿里巴巴图标库,bootstrap自带图标

项目文件结构:

image

用例图:

image image

数据库类图:

image

部分功能界面展示:

1.首页 image

2.登录和注册 image  

3.点击听歌并且评论 image  

4.关注其他用户 image  

5.查看听歌记录 image  

6.管理评论 image  

music's People

Contributors

duckshell avatar

Stargazers

 avatar  avatar  avatar mawenjie avatar  avatar 申迎飞 avatar

Watchers

James Cloos avatar  avatar 申迎飞 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.