记一次纯前端js+html来写web的过程

引子

不用php作后端，是因为不想在语法切换中精神分裂掉，同时也更好的复用小程序中的代码，那为什么用LeanCloud的js sdk作server呢，是因为我不会node.js

使用vue，是对它的数据双向绑定欲罢不能，移动时代浏览器兼容已不是大问题同时强烈体积轻巧的大背景下，jQuery已经完成了它的主要使命了

使用element，是因为它确实很漂亮，拿它当Bootstrap用了，当然它的替代产品iView也不错。

先上图

首页

详情页

起步

用下面这种通过最简单的方式使用element，不折腾npm，webpack，vue-cli。

先堆个轮播出来

输入图片说明

引入LeanCloud sdk

主角登场，加载数据

这时轮播就显示了海报了

引入栅格布局

上面的海报是占满全屏，这不是想要的，27寸下显示会哭死，只要1200px宽度就够了。

发现它对响应式支持不友好，于是深深地被打脸。可以考虑回到Bootstrap了，element就用来做纯PC后台吧。

这次，先一条道走到黑，用ele把首页的卡片布局，详情页也做做完。

用卡片实现单元格

  ![](item.cover.url)
  

    {{item.name}}
    

      {{ item.minutes }} 分钟
    
  

就这样全程只用html/js实现的整个数据请求与页面渲染了。

源代码就不需提供下载了，直接访问这个demo的地址，http://video.it577.net/，Ctrl + U就全都有啦。