Eleme (饿了么移动端SPA)
-
概述:
非常感谢黄毅老师录制的实战视频,给刚入门Vue的人提供了很好的Vue进阶教程。
该实战项目使用Vue2.0开发。
Github地址: Eleme SPA -
技术架构:
- Vue 2.0
- Vue-router 2
- Vue-cli
- Axios
- Better-scroll
- ES6
- Webpack 2
- Eslint
- Sass
-
项目截图
goods page detail page shopcart ratings page seller page
-
功能:
- 模拟原生App滑动
- 商品联动
- 商品加入购物车
- 图片左右滑动
- 小球飞入动画
- 评论筛选
- 等等
-
安装:
-
github:
git clone https://github.com/Eval0day7/StudyEleme.git
- npm:
npm install
npm run dev
-
总结:
- 了解了项目开发整个流程。
- 设计稿高度还原移动端页面。
- 模块化、组件化开发。
- css sticky footer 经典布局。
- 明白了设备像素比、移动端1px问题。
- Eslint 代码规范检测工具,明白了ES6代码规范。
- 熟悉了Webpack打包工具。
Ps: 总之这次实战收获匪浅,加深了对Vue开发知识理解,是个很好体验过程,成就感十足。由于实战视频使用的是Vue 1.0,在开发过程也碰到了许多问题。不过还好都已经解决了。
网友评论