Skip to content

yongjiexu/vue-mtime

Repository files navigation

vue-mtime

Vue全家桶仿写移动版时光网web页面。根据个人审美适当改变了页面设计。

预览

在线预览地址:www.xxxxxxxxx.com 未考虑兼容性问题,最好在Chrome浏览器下查看。

技术栈

已使用

  • Vue2.0 构建前端页面
  • Vuex 不同组件间数据共享
  • Vue-router 单页应用路由切换
  • axios 向后端发起请求
  • Express 改造了开发服务器,代理浏览器发出的网络请求
  • ES6、ES7 客户端、服务端都使用ES6 使用promise/async/await 处理异步
  • Webpack 项目打包工具
  • Stylus 预处理css
  • CSS3 过渡、动画、转换等
  • Flex flex弹性布局,响应不同尺寸的屏幕
  • 响应式设计 宽、高、字体等使用单位vw,响应不同尺寸的屏幕

计划使用

  • BetterScroll 实现滚动
  • MySql/Mongodb 存放后端数据
  • vueg 实现转场效果
  • Socket.io 实现实时消息推送
  • egg.js 生产环境中替换Express
  • localStorage 本地保存用户信息

截图

一级页面:

  • 首页页面
  • 购票页面
  • 商城页面
  • 发现页面

二级页面:

正在热映和即将上映页面等

项目分析

  • 前端: todo
  • 后端: todo