返璞归真~原生html开发内网项目总结

1,276 阅读2分钟

返璞归真~原生html开发内网项目总结

文章性质:一个小项目总结

观看时间:5min

内容:环境搭建,组件库使用总结

前言

  • 做的一个政府内网的项目,就是信息发布,公众号链接h5发布信息,参与时间为一周~
  • 移动端:mui
  • pc端:layui

环境搭建

起初,前台没有任何内容,无法连接外网,无法使用U盘copy资料,客户说只能用H5,不能用vue,我表示很无语...好歹资料可以通过另一个途径copy(特别特别麻烦),起初准备了几个方案

  1. vue脚手架搭建环境,将所有用到的依赖提前安装,因为内网无法安装,要提前将需要的UI组件,可视化组件等提前安装copy

  2. 纯html的方式,这个时候绝对不会纯手写的~赶紧找了几种UI矿建,对比下文档/UI样式,将定下来的UI组件以及第三方插件通过github下载下来以备copy

  3. copy过去之后,考虑到客户限制不让使用vue,后台开发的小伙伴也不会,最终定下来使用纯html的方式

以上为选型,接下来搭建环境

其实也就没什么了,按照常规的pages/css/js/plug创建文件夹,查看UI组件API,将基础框架搭建出来就可以开始撸界面了

组件库使用

在开发界面的时候,有经验的程序员一定知道,尽量用组件库内的组件来快速搭建页面,这个前提是要收悉api,并且一般都是在项目紧急的情况下,因为这些UI组件我之前也是没有用过的,所以我选择将官方文档所有有用的信息大致瞟一眼,详细看的是官方的快速上手和注意事项部分,关于组件的使用可以在用的时候去查找相关文档

于后台对接过程中,所有的元素绑定和数据获取都是通过API文档解决的。完全脱离了手写js操作,很方便,所以站在巨人的肩膀上没有错

总结

  1. 这个项目从技术的选型到所有界面的开发历时1周,返璞归真~
  2. 这种老的技术不管是在界面的开发,数据对接,代码可读性,复用性都不如现代vue/react组件化开发思想~
  3. 不管是纯html开发还是在基于现代框架的开发,UI组件库起到快速组装,风格统一的作用,工作处处可以站在巨人的肩膀上

本文使用 mdnice 排版