微信小程序笔记1

一：微信小程序是啥？

        微信嵌入式微型APP   

二：微信小程序特点

       1.便携便捷      体积小相当于无需下载  方便随时使用

       2.自带用户量  微信用户量广粘性大 相当于自带大量潜在客户

       3.简便              性能要求低，操作简单。

       4.成本较低      开发难度稍微偏低，运维量不大，维护成本低。

三：对开发者的影响（APP）

        1.跨平台      适用微信平台中的各种手机系统

        2.开平台      开放式平台，允许各程序员进行开发

        3.门槛低      0基础相对容易入门

四：小程序开发基础

         JS语法  ES6  CSS

五：小程序开发工具

        开发工具下载地址：https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html?t=201714

        开发环境（暂不支持个人？）

        没有小程序帐号的限制（不能上传 发布 支持开发？仅在支持PC上开发？  手机一般通讯功能受限制）

六：开发工具使用

         1.手机类型选择（显示比例） 上网信号选择

         2.编辑区域 （代码编写）

            2.1 Sources区域  主要代码

            2.2 Console区域  错误信息提示

            2.3 Network区域   连接耗费时间管理

            2.4 Security区域   ？？？

            2.5 Storage区域   缓存功能

            2.6 APPData区域  页面相关

            2.7 WXML区域      UI界面+UI代码联调

         3.调试区域（调试代码）

             3.1打断点调试代码（SM后续文件处打断点）

         4.快速查找功能

             快速查找文件

         5.项目界面

             上传及预览

              ES6→ES5

         6.后台

            后台切换模拟

             缓存清楚功能

       7.关闭退出

七：小程序页面编写

       1.1.文件类型与目录结构

       1.2.注册小程序项目（View Image Text 等组建基本用法  ）

       1.3.Flex弹性盒子模型

       1.4.移动项目分辨率及小程序自适应单位

八：项目创建

        1.思想：骨架（wxml） 样式（wxss）逻辑（js） 配置（json）

                       应用程序入口→一级页面（wxml  wxss  json  js）→二级页面（wxml  wxss  json  js）

        2.指令：  文本  图片  

                      容器 分隔  

容器 分隔

                      class=  指向   user-  引用

        3.实操：前置文件创建（app.js  app.json  app.wxss)

                       页面文件创建（Pages文件夹 js wxml  wxss）

                      骨架构建（wxml  ）<view>写入信息view>

页面路径设置 { "pages": [ "pages/目录名称/目录名称"]}

4.样式：  文本样式 <text class=“user-指向样式名称>写入信息text>

图片样式 <image class=“user-指向样式名称”>image>

容器样式 <view class=“指向样式名称">view>