如何开发微信小程序

点击编辑就可以看到亲切的树形结构了看着好熟悉好舒服的感觉，觉得接下来的开发应该是会非常顺利。楼主的javascript强过java，所以学习这个比学Android程序开发容易多了，看着就舒服。Android的IDE看着就眼晕。

最重要的文件是app.js

第一次看到了代码里面有中文注释，热泪盈眶的感觉。作为一个整天大量阅读印度码农的代码的程序猿，这是多么幸福的事情，居然有中文注释解释程序在做什么。

沙发 点赞 楼主准备开发什么呢

看到这么整齐的树形结构和编码想到老板还在屁股后面追我给他写一个Excel macro我就想踹死他。

保密没什么好主意，所以想到什么开发什么，学习为主，或者你有idea也可以啊，应用名称在发布前可以改两次。所以可能一开始想开发“新加坡学区房”，最后就变成“新加坡美食”，这个随时能改。

插播广告推荐别人写的入门文章：http://www.xiaochengxuzhijia.com/blog/5671.html

这里要给小白稍微解释一下这三个文件app.js,app.json和app.wxssjs文件是用来控制网页动态的，所以你想让你的网页在用户点击一个按钮之后发生点什么就得写在app.js里面；
json文件你可以理解为数据文件，之后也许可以换成ajax call，我们先不讲那么多，反正用来给你的程序提供数据的就是了；
wxss文件是用来渲染页面的，类似css文件，这个文件我们程序猿不屑去碰，通常有条件的团队里会专门雇佣一个美女程序猿来搞这个文件，我就不碰它了。

教吗？我是程序小白。

我可以帮你写excel macro。这个我很会

需要一些domain knowledge这个别人帮不了，我会给印度人写。还是聊这个微信小程序开发吧，我又stuck了。hello world还没有写好，教程似乎不太靠谱啊。这个小程序开发最大的好处是适合单个程序猿开发，感觉很简单，只要上手以后应该就很容易了。

发现调试工具有点问题在电脑上无法调试，然后在手机上已经可以正确显示hello world了

补图程序员想自学点东西也不容易啊

我还在学习如果想学也注册个开发者账号呗，不难

今天继续介绍小程序会用到的基础组件

组件是视图层的基本组成单元。 组件自带一些功能与微信风格的样式。 一个组件通常包括开始标签和结束标签，属性用来修饰这个组件，内容在两个标签之内。 Hello, world 看到这里是不是觉得很熟悉，是的，其实和html长得差不多。这里要稍微解释一下微信会不会设计小程序这个东西，这是在传统的微信公众号上面的拓展，传统的公众号只是简单的和网页交互，小程序给了无限的可能。小程序可以理解为是为了程序猿验证"Javascript can do anything"设计的东西，相信微信里面设计这个的是Javascript的高手，甚至于小程序还支持ES6，所以小程序是需要编译的。

求助高手为什么我的本地编译环境里面一直说define is not defined，可是代码放在手机上是可以跑的，基本搜索不到什么回答啊。

我的问题在这里https://developers.weixin.qq.com/blogdetail?action=get_post_info&docid=6b85daf49d34793cc12b59fd1a4372b3&token=436834271&lang=zh_CN

不过似乎没有什么人回答啊。

解决了找到组织了，有小程序程序猿社区，还非常活跃，很多人在线。

看到不屑俩字好想哭觉得css比server端难写多了，后者基本只需要逻辑，前者需要审美加各种不厌其烦

用词不当我是想说技术上没有难度，但是你让一个男程序员去做美工，怎么做都是丑的。我们通常是尽量找一个自动render的framework，然后自己只需要选一个color theme，不需要自己去碰css file。通常我自己设计完以后又会都删掉，因为看上去还不如白板黑子好。

你做美工吗？我添加你去我的微信小程序做程序员？我们做个新加坡溜娃咨询吧，老是有人来新加坡旅游的时候问我带娃去哪里玩。

我们也是这么做的但是对于ui技能好的非常崇拜，反正我做不来，偶尔想改点css都是乱七八糟

我也希望我能做ui前阵子自己花时间写了俩简单软件，一个给娃报听写（学校布置的听写但我偶尔没空只能请不会英文的父母代劳）；一个朋友之间记账使用，花在ui上的时间是后台的好几倍还不咋地，我也想有人帮我做ui…

反对把css和ui技能等同起来css只能算ui的一小部分，网页的话就千篇一律bootstrap就可以了。你看谷歌的网站不也挺成功的，就一个logo两个button罢了。关键有没有用户要靠服务器端，前端再美用户也不能只是盯着它欣赏啊。

没有等同但你不能否认要做好ui css也是必备技能
我只想说我连这点技能都没有…当然啦你是有技能只是不屑，所以我也没有想把你和我归于一类，呵呵

随手就写了能用的程序还是挺厉害的目前自己在家写的程序大部分是垃圾，没有用处

第二个debug version是我在开发的不过还没有发布，你搜不到，其他的可以搜索到了，就在wechat->discover->mini programs。你可以先看看别的，晚一点再发布我的hello world给大家看。

忘记贴图了你看那只牛就知道是我了

继续来讲解怎么做一个稍微有点用处的微信小程序

一开始最主要需要编辑的就是index.wxml和index.js。把数据放在index.js里面，把标签放在index.wxml里面，还有一些简单的loop功能。 比如下面这个数据写在index.js里面。 Page({})是微信小程序的基本格式，不需要理他。需要提供数据的话，就写data:{}。这里我初始化了一个数组，数组的名字叫iconSize，然后我给了这个数组6个值，如果你还记得大学学的C程序基础的话，其实是一样的。　

　Page({ data: { iconSize: [20, 30, 40, 50, 60, 70] } })　

　有了上面的数据以后，我就可以在index.wxml直接使用iconSize做点事情了。

上面的第一个tag是，可以给他一个class，随便叫什么，然后晚一点可以用css渲染。第二个tag是，你就当他也是view就好了，这里可以简单的写一个循环函数了，这个wx:for是微信提供的，你就记住微信给的函数都是wx开头的就行了，这个有点像AngularJS，后面可以直接引用上面定义的数组iconSize，注意这里有两个{{。他的功能就是循环导入数组里面的每一个数字。然后在block里面有使用了一个tag叫，他的type我们可以使用success，就是过一下你会看到的对勾就是success了，然后定义这个对勾的大小，item是一个关键字，它就是调用iconSize里面定义的每一个数据，最终执行结果是这样的。 执行结果：

最后我在index.wxss里面调整了一下这些对勾在屏幕里显示的位置，就是类似css了。

.group {

　 position: relative;

　 top: 50%;

　 height: 50px;

　 margin-top: 100px;

　 margin-left: 30px;

　 display: flex;

}

这里留个小作业，你可以很简单的在屏幕里面再添加点什么。比如warning。

index.wxml的内容没有贴上来<view class="group">
<block wx:for="{{iconSize}}">
<icon type="success" size="{{item}}"/>
</block>
</view>

支持楼主完成大作

已经完成了0.1晚上先发布一下，在mini program里面搜索“新加坡信用卡推荐”就行。

这个是0.1，所以不要骂功能差啊，我可以慢慢改进的。agile, agile

开发demo完毕已经发布，明天下午三点以后在微信的mini program里面搜索“新加坡买房计算器”吧，应该能审核通过的。

不允许发布金融类的应用已经删除了信用卡推荐，改发布买房计算器了。

已经发布了“新加坡买房计算器”@武汉伢我可以去房产车市做个广告吗？在这一页的mini program下面就可以搜索到了

这个计算结果对不对有测试过吗？我总感觉guaiguaid

欢迎指正错误有一些人简单测试过，应该还好。我再自己测试一下

PR第一套房没问题

公民第一套房没问题

外国人买公寓没问题

贷款30年1.5%的利息贷80%没问题，基本主要功能应该还好

【编程技术】如何开发微信小程序

最近开始研究开发微信小程序，在微信里面每个人都可以看到一个一个叫mini programs的button，这个就是中国早已经有的小程序组件了。要想成为微信小程序开发人员，首先你要有一张中国的身份证，楼主没有，所以只能全套用妈妈的身份证和名字了，反正估计妈妈也不会来微信开发程序的。每个身份证只能作为个人注册一个开发者账号，只能发布一个小程序。

注册开发者账号：https://mp.weixin.qq.com

有了账号以后要给自己的小程序起个名字，然后上传个图片，描述几句，记录下AppId，就可以下载微信提供的工具开始写hello world了。打开开发工具以后，选择“本地小程序项目”，输入AppId，起个名字，选择存储路径，就能打开IDE了。

美丽的IDE要上全屏图：

各位程序猿是不是觉得好亲切的开发环境，有点像Google Chrome Dev，现在还不会用，不过看上去很好用的样子。等我读一下用户文档，再来添加接下来该做什么。有中国身份证的可以先创建一个开发者账号了。

该帖荣获当日十大第10，奖励楼主1分以及1狮城帮币，时间：2017-08-18 22:00:09。