前言
自从微信小程序功能发布后,我就一直关注着小程序的动向,然而限于学业繁忙,总是没有太多的时间去学习。大二逐渐学习了Vuejs,被其简洁的设计所吸引,后来看了看小程序的开发文档,发现这么的相似?可能前端的发展趋势就是这样的吧,各个框架都趋向于相似的优秀的设计。
大三逐渐学习了Go语言,为了练习Go语言,同时也将自己几年来积累的东西聚合在一起,于是开发了微信小程序:We中南(可以去微信搜索,虽然现在毕业已经不打算维护了),其聚合了中南大学校内常见的信息查询功能,如:成绩课表查询、校车校历查询等项目已经在我的Github开源:前端、后端。
We中南、SCI期刊IF查询
今年暑假的某天突然心血来潮,看了下We中南的数据统计,发现还是有人用的,在没有推广的情况下居然增加了好几百的访问量(突然的感动),同时发现小程序支持云函数开发了,也就是说对于小型的小程序不必使用后端服务器,直接使用其提供的nodejs环境进行开发。
经过这些天的摸索,我想把自己从小程序注册到上架的全过程分享出来,供准备学习小程序的同学参考。
准备工作
1. 注册微信小程序账号
点击传送门立马注册微信小程序账号。点进去后会看到如下界面,选择注册类型时要选择微信小程序。
注册界面
接着填写相关的信息即可完成注册。
注册界面-填写信息
在完成注册后,切换到开发->开发设置,可以查看开发者ID。
AppID
2. 下载开发者工具,新建项目
进入传送门,下载安装最新版的开发者工具。使用开发者工具,开发者可以完成小程序的 API 和页面的开发调试、代码查看和编辑、小程序预览和发布等功能。
关于IDE使用方法的界面,可以详细参考官方文档
接着打开开发者工具,修改项目名称,填入上面说的AppID,后端服务选择小程序云开发。
新建小程序项目
新建项目后我们可以看到,IDE已经帮我们新建了一个包含云函数开发的小程序模板,还提供了一些功能测试界面。
此时我们并没有开通云开发,需要点击IDE左上角的“云开发”,然后选择开通云服务。
IDE主界面
开发小程序
1. 关于项目文件结构的介绍
项目结构
项目分为两个子文件夹,一个为cloudfunctions,里面包含小程序的云函数,一个子文件夹包含一个云函数;另一个为miniprogram,是小程序的前端文件夹,没有固定的文件夹格式,完全可以通过对app.json进行修改定制自己的文件夹。具体文件的介绍可以参考官方文档
2. 修改小程序信息
打开miniprogram文件夹下的app.json,其定义了小程序的基本信息。
下面是我的小程序的app.json,我将示例里无关的页面都删除了,添加了index主界面和detail详情页。
关于示例项目的修改:可以直接将pages目录下除index外的页面都删除,将style、images文件夹下的文件都删除。
{ "pages": [ "pages/index/index", "pages/detail/index" ], "window": { "backgroundColor": "#F6F6F6", "backgroundTextStyle": "light", "navigationBarBackgroundColor": "#F6F6F6", "navigationBarTitleText": "SCI IF期刊影响因子查询2019", "navigationBarTextStyle": "black" }, "sitemapLocation": "sitemap.json" }
另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。