要在微信小程序上开发一个功能模块，通常需要先创建一个新的页面，方法很简单，示例如下：
例如，需要新建一个名称为one的页面，只需要在项目的根目录下的app.json文件下的pages数组中新建一行："pages/one/one"。
{
  "pages":[
    "pages/index/index",
    "pages/logs/logs",
    "pages/canvas/canvas",
    "pages/one/one"
  ],
  "window":{
    "backgroundTextStyle":"light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "WeChat",
    "navigationBarTextStyle":"black"
  }
}


重新运行程序代码后，即可在pages目录下发现一个名为one的文件夹，里面会自动生成一个小程序页面所需要的四个文件。

文件类型
必填
作用
js
是
页面逻辑
wxml
是
页面结构
wxss
否
页面样式表
json
否
页面配置
注意：为了方便开发者减少配置项，官方规定描述页面的这四个文件必须具有相同的路径与文件名。
把小程序页面比作一个人的话，那么组成它的各个文件的作用可比喻如下：
one.js管的是这个页面的“大脑”，它是用JavaScript编写的，负责将数据进行处理后发送给视图层，同时接受视图层的事件反馈。例如：获取数据、更新数据、页面的跳转等；

one.wxml管的是这个页面的“”长相“”，即用户看到的是什么样子的页面是由它决定的。例如：定义页面的整体布局以及页面内容的显示效果文本框、按钮、视图、照片等；
one.wxss管的是这个页面的“化妆品”，它决定了小程序页面平时如何见人？例如：页面的长宽高、组件边距、颜色边框、鼠标经过的效果等；
one.json管的是这个页面“性格”，它负责对本页面的窗口表现进行配置，例如：页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。


一个拥有网页开发基础的学者只要明白了如何定义一个小程序的页面，再对其页面组成的使用加以熟悉，很快就可以上手小程序的开发。
还在等什么？赶紧试试吧！
后续我会陆续分享一些小程序的学习心得给大家，欢迎多多关注~~~

一、小程序结构目录的创建：

1、首先打开 微信公众平台 | 小程序的官方文档：https://mp.weixin.qq.com

2、按照官方文档的小程序发布流程，完善信息，申请到自己的 小程序开发 ID  

       地址：https://mp.weixin.qq.com/wxopen/waregister?action=step1

3、申请完ID之后，下载 微信开发者工具，

       下载地址：https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

4、安装完微信开发者工具后，打开开发者工具，在本地新建一个自己小程序的文件夹，在微信开发者工具里面就可以看到小程序          的结构目录完成了。

如果不够详细，可以查看百度经验 ：https://jingyan.baidu.com/article/ad310e80eeedd71848f49e53.html

 

引入UI库：

1、下载WeUI 。下载WeUI框架的github地址：https://github.com/weui/weui-wxss/

2、我们只需要将weui-wxss-master\dist\style\weui.wxss文件导入到小程序项目的根目录下

 

 



3、在项目中引用：在全局app.wxss中加入weui.wxss的引用- @import "weui.wxss";

 

 

5 根组件使用class=”page”

<view class="page"></view>


6 页面骨架

<view class="page">
<view class="page__hd"></view><!--页头-->
<view class="page__bd"></view><!--主体-->
<view></view><!--未设置页脚-->
</view>


7 除此之外都是按照weui-开头后接组件名称，例如class=”weui-footer”

<view class="weui-footer">我是页脚</view>


8 组件的子组件样式，例如view.weui-footer组件还有链接和版权信息。

<view class="weui-footer">
<view class="weui-footer__links">
    <navigator url="" class="weui-footer__link">上海物联网科技有限公司</navigator>
</view>
<view class="weui-footer__text">Copyright © 程序媛专用</view>
</view>


9、具体组件在小程序中新建个项目，地址指向weui-wxss-master\dist，就可以随时查找自己要的效果，剩下的就是复制粘贴了，或者导入从github上下载代码中的实例使用，

以下为小程序引用UI库的学习资源：

原文作者：祈澈姑娘

原文链接：https://www.jianshu.com/u/05f416aefbe1

微信小程序从零开始开发步骤（一）搭建开发环境https://www.jianshu.com/p/0ff8c3b2f59f

微信小程序从零开始开发步骤（二）创建小程序页面https://www.jianshu.com/p/fe0db14e2869

微信小程序从零开始开发步骤（三）底部导航栏https://www.jianshu.com/p/89a63dc99839

微信小程序从零开始开发步骤（四）自定义分享的功能https://www.jianshu.com/p/65d9bdb8051d

微信小程序从零开始开发步骤（五）轮播图https://www.jianshu.com/p/bc3261557031

微信小程序从零开始开发步骤（六）4种页面跳转的方法https://www.jianshu.com/p/01a5a6a0fdb9

微信小程序从零开始开发步骤（七）引入外部js 文件https://www.jianshu.com/p/5f2cde64d7f2

微信小程序从零开始开发步骤（八）引入框架WeUI：https://www.jianshu.com/p/fd423b6e17be



 

 

　　微信小程序商城，目前在市场发展的非常好，很多的商家想要创建自己的商城，但是对于如何创建微信小程序商城？不知如何下手，接下来，木鱼小铺小编就带着大家一起来看看吧。

　　





　　一、如何创建微信小程序商城？

　　

　　1.明确目的和需求

　　

　　商家在创建小程序商城之前，一定要明确自己建立商城的目的，如确定小程序目标是什么，小程序商城的功能有哪些，这些是商家必须要考虑的问题。

　　

　　2.注册并认证小程序账号

　　

　　登录微信公众平台，注册并认证小程序账号，然后开通微信支付账户，保存好账号密码。

　　

　　3.选择开发方式

　　

　　注册号了账号之后，就是需要选择小程序的开发方式了，目前市场制作小程序商城的主流方式有三种，自己开发、模板搭建和定制开发。商家可以根据自己的实力来选择开发方式。但大部分的商家会选择第三方定制开发。因为是定制开发，是为品牌量身定制的，贴合企业需求和业务。

　　

　　4.制作微信小程序商城

　　

　　选择好了开发方式后，就可以开始制作商城了，如果是模板搭建的话，商家只需要购买一个商城模板，自己跟着步骤搭建即可。

　　

　　如果定制开发，商家需要跟第三方服务公司确定好微信小程序商城功能是什么，如管理功能，订单管理，在线支付，线上预约等等，然后服务商就可以开发。

　　

　　5.提交审核

　　

　　商制作结束后，需要提交到微信平台去审核。当小程序商城的主体和小程序服务类目通过审核后，那么商家的微信小程序就可以上线了。

　　

　　二、微信小程序商城制作多少钱？

　　

　　小程序的商城制作的价格是多少钱呢？这个就和商家选择的开发方式来决定的。

　　

　　三、创建微信小程序商城的优势是什么？

　　

　　1.帮助企业拓宽销售渠道

　　

　　微信小程序商城背靠微信，流量巨大，可以利用商城自带的营销活动，如拼团，秒杀等。帮助商家吸引客户，在通过线上商城购买自己需要的产品，开通线上销售渠道，解决销售难的问题。

　　

　　2.宣传品牌

　　

　　商家还可以通过公众号、附近小程序、朋友圈，分销功能等营销方式，对小程序商城进行推广盈利，有有利于品牌形象的建立。品牌形象好了，那么客户源肯定源源不断的，流量多了，就大大增加转化率。

　　

　　3.线下线上资源有效融合

　　

　　微信小程序商城是打通商家线上与线下的一条纽带，O2O模式的创立可以有效的把线下资源和线上服务有效融合，让企业得到进一步的发展。木鱼小铺作为一个优质的小程序开发公司，成立至今，一直致力于帮助线下企业解决经营过程中遇到的“效率、品牌、营销、数据”四大难题。想做商城的商家，欢迎来咨询。

　　

　　综上所述，可以了解到，创建微信小程序商城，没有想象中的那么复杂，商家做好准备工作，选择好开发公司，确定好商城功能后，就可以当一个甩手掌柜，等待商城的上线即可。

	

微信小程序(Mini Program)是一种运行在微信内部，程序大小一般不超过2MiB(最高不超过8MiB)。正是因为这种特性，微信小程序也被称为是一种不需要下载安装即可使用的应用。那么作为开发者，我们又怎样开发出这种简单轻巧的小程序呢？
一、准备工具
这里废话不多说，进入微信小程序开发工具下载界面，根据自己的操作系统，建议选择下载稳定版。
二、创建项目
打开开发程序之后先扫码登录，之后在左侧栏目选择小程序并点击右侧带有加号的白色方框。
项目名称和目录可以随意修改。因为我们目前不需要对AppID进行发布，所以AppID选择使用测试号。其它缺省设置不必修改，直接点击右下角“创建”即可。
三、程序开发
项目创建成功之后，窗口会类似下图三部分：工具栏、模拟器和编辑器。
    这三部分主要功能就不再详细说明。
四、代码构架
    观察编辑器左侧目录列表，将所有文件夹展开会看到下图：
   下面主要说明这些文件的作用以及协同关系。
    pages文件夹下存放的文件夹是页面，也就是每一个页面在pages文件夹中都是一个文件夹，而页面名称就是这个文件夹的名称。如上图，pages下有2个文件夹分别名为index和logs，这就表明这个小程序有两个页面。
每一个页面文件夹下都有4个和文件夹同名的不同类型文件，他们分别是
.json 后缀的 JSON 配置文件
.wxml 后缀的 WXML 模板文件
.wxss后缀的 WXSS 样式文件
.js 后缀的 JS 脚本逻辑文件
接下来我们分别看看这4种文件的作用。
JSON 配置
    JSON是一种数据格式，并不是编程语言，他的作用就像我们手机电脑中的设置一样，把我们手中的东西变为我们想要的样子。
    以app.json为例，app.json 文件用来对微信小程序进行全局配置，他声明了小程序的所有页面路径、界面表现、网络超时时间、底部 tab 等。每一个小程序页面也可以使用同名.json 文件来对本页面的窗口表现进行配置，页面中配置项会覆盖 app.json 中相同的配置项。
WXML 模板
    WXML与HTML相像，HTML 是用来描述网页的结构，所以在微信小程序中，WXML 充当的就是类似 HTML 的角色。WXML能够在屏幕上显示它本身所呈现的内容，但是在WXML写了一个按钮，我们希望用户在点击他的时候他能正确交互，这时就需要用到JS逻辑交互。
JS 逻辑交互
    就像上面所说，一个服务仅仅只有界面展示是不够的，还需要和用户做交互：响应用户的点击、获取用户的位置等等。在小程序里边，我们就通过编写JS 脚本文件来处理用户的操作。另外，我们页面中需要用到的变量和函数方法也需要在JS文件中定义。有了它，再配合WXML，就能够写出来一个有模有样的程序了。
WXSS 样式
    WXSS 具有 CSS 大部分的特性，但小程序在 WXSS 也做了一些扩充和修改。通俗点讲WXSS的作用就是定义WXML中我们所显示在屏幕上的那些按钮图片文字的高度宽度大小颜色等性质。和前边app.json, page.json 的概念相同，wxss也提供了全局的样式和局部样式。你可以写一个app.wxss 作为全局样式，会作用于当前小程序的所有页面，局部页面样式 page.wxss 仅对当前页面生效。
    说完了4种主要文件，我们会发现在根目录下存在一个名为app.js的文件。其实和前边app.json, page.json 的概念相同，app.js定义了全局样式，同样也会作用于当前小程序的所有页面，局部页面样式page.js仅对当前页面生效。
工具配置 project.config.json
    通常大家在使用一个工具的时候，都会针对各自喜好做一些个性化配置，例如界面颜色、编译配置等等，当你换了另外一台电脑重新安装工具的时候，你还要重新配置。
    考虑到这点，小程序开发者工具在每个项目的根目录都会生成一个 project.config.json，你在工具上做的任何配置都会写入到这个文件，当你重新安装工具或者换电脑工作时，你只要载入同一个项目的代码包，开发者工具就自动会帮你恢复到当时你开发项目时的个性化配置，其中会包括编辑器的颜色、代码上传时自动压缩等等一系列选项。
sitemap 配置
    根目录下sitemap.json声明了小程序及其页面是否允许被微信索引，文件内容为一个JSON对象，如果没有 sitemap.json ，则默认为所有页面都允许被索引。这个文件目前我们用不到，就先搁置不用考虑这个文件。
    最后就是utils文件夹以及其中的util.js文件，和sitemap配置一样，我们也先搁置不考虑这个文件。
总结
     到这里，我们就明白如何创建微信小程序，并对其中的文件逻辑和框架有了大致的了解。但是我们具体如何去构建代码，写出自己想要的小程序，这个以后再更吧。