返璞归真~原生html开发内网项目总结
「文章性质:一个小项目总结」
「观看时间:5min」
「内容:环境搭建,组件库使用总结」
前言
- 做的一个政府内网的项目,就是信息发布,公众号链接h5发布信息,参与时间为一周~
- 移动端:mui
- pc端:layui
环境搭建
起初,前台没有任何内容,无法连接外网,无法使用U盘copy资料,客户说只能用H5,不能用vue,我表示很无语...好歹资料可以通过另一个途径copy(特别特别麻烦),起初准备了几个方案
vue脚手架搭建环境,将所有用到的依赖提前安装,因为内网无法安装,要提前将需要的UI组件,可视化组件等提前安装copy
纯html的方式,这个时候绝对不会纯手写的~赶紧找了几种UI矿建,对比下文档/UI样式,将定下来的UI组件以及第三方插件通过github下载下来以备copy
copy过去之后,考虑到客户限制不让使用vue,后台开发的小伙伴也不会,最终定下来使用纯html的方式
以上为选型,接下来搭建环境
其实也就没什么了,按照常规的pages/css/js/plug创建文件夹,查看UI组件API,将基础框架搭建出来就可以开始撸界面了
组件库使用
在开发界面的时候,有经验的程序员一定知道,尽量用组件库内的组件来快速搭建页面,这个前提是要收悉api,并且一般都是在项目紧急的情况下,因为这些UI组件我之前也是没有用过的,所以我选择将官方文档所有有用的信息大致瞟一眼,详细看的是官方的快速上手和注意事项部分,关于组件的使用可以在用的时候去查找相关文档
于后台对接过程中,所有的元素绑定和数据获取都是通过API文档解决的。完全脱离了手写js操作,很方便,所以站在巨人的肩膀上没有错
总结
- 这个项目从技术的选型到所有界面的开发历时1周,返璞归真~
- 这种老的技术不管是在界面的开发,数据对接,代码可读性,复用性都不如现代vue/react组件化开发思想~
- 不管是纯html开发还是在基于现代框架的开发,UI组件库起到快速组装,风格统一的作用,工作处处可以站在巨人的肩膀上
本文使用 mdnice 排版