微信小程序APP（商超营销类）经验总结

项目介绍

这是一款主打门店营销的小程序。包括首页、门店、营销、我的设置、登陆、数据统计展现、营销设置等。

原本要独立完成整个项目，包括先后端一套的，有些意外因素，项目临时收尾（说明：只完成了前端的部分，后端未完成）。

管理大师们说过：一个好的项目，必须有一个好的收尾，好的收尾，就必定要有好的经验总结。

因而乎，我索性将成果拿出来给各位分享了，旨在总结经验教训，跟各位交流小程序开发。

整个项目23个独立页面（不算雷同的页面），从资料准备到开发完成，历史4.5个工做日，大约25小时。

今年多作的是Python与Java，霎时将思惟切换至移动端页面开发，忽然有些不适应，竟然花费25个小时完成这些页面，心理深感惭愧，项目历程大致上主要是体力负担重一些，不过还好，借此机会三刷了CSS的教程，N刷了小程序文档。老祖宗说过，熟能生巧嘛！

点击跳转至本人我的主页

项目截图

截图1

截图2

截图3

项目经验总结

第一步 收集项目需求

收集任务
按照原型图，提取UI元素，上网找寻web UI组件。	信息来源：文档3
根据UI元素提取组件/插件关键字及下载连接、组件demo、组件源码	搜索引擎、 小程序开发文档、 文档一、文档2

第二步小程序知识储备

第二步：根据任务预备开发知识
知识点总结	连接
小程序开发文档	小程序官方文档
文档连接1	Github 小程序开源组件库：
文档连接2	Github 小程序开源组件库
文档连接3	css教程
wxml	view、左右滑动、上下滑动、九宫格、复用
wxss	上下排列、左右排列、均分、内边距、外边距、
js	本地缓存、点击事件、渲染事件、网络请求
异步	worker组件 多线程
chart	echart小程序版介绍连接 备选方案 wx-chart
产品需求	饼图 柱状图 折线图 延迟加载 页面不阻塞滚动 页面建立多图表
下拉选择	相似文字识别底部action-sheet
多类型list	citySelect 备选方案 wx-alphabetical-listview
	https://github.com/zhongjie-chen/wx-scrollable-tab-view
下拉弹框	menudown 备选方案： 下拉1 下拉2
左滑删除	minapp-slider-left
图片预加载	img-loader
请求队列管理库	wx-promise-request
md5加密	wxmd5
base64	wxbase64
websocket	weapp.socket.io
富文本	wxparse
联动等常见样式	youzan-ui
时间+日期选择器	http://www.javashuo.com/article/p-aovwxfpw-ha.html

参考历史项目——商城小程序

参考历史项目是一款商城类小程序，复用、借鉴了部分面细节和样式设计

历时时长总结

拿到UI，制定开发计划	预计1天 实际0.5天
纯页面开发	预计7工做日 实际4工做日
小程序开发总时长	4.5工做日，实际25小时
总结：	23个页面，若是能全力开发，应该能缩短至20个小时左右完成。