小程序基本开发流程 第1篇
在中大型的公司里，人员的分工非常仔细：同一个小程序项目，一般会有不同岗位、不同角色的员工同时参与设计与开发。
此时出于管理需要，我们迫切需要对不同岗位、不同角色的员工的权限进行边界的划分，使他们能够高效的进行协同工作。
项目成员的组织架构：
小程序的开发流程：
小程序成员管理体现在管理员对小程序项目成员及体验成员的管理：
我们来看看不同项目成员对应的权限：
开发者的权限说明
我们可以像下图一样在成员管理项中添加项目成员和体验成员：
小程序基本开发流程 第2篇
然后我们来看一下项目的基本组成结构：
① pages 用来存放所有小程序的页面
② utils 用来存放工具性质的模块（例如：格式化时间的自定义模块）
③ 小程序项目的入口文件
④ 小程序项目的全局配置文件
⑤ 小程序项目的全局样式文件
⑥ 项目的配置文件
⑦ 用来配置小程序及其页面是否允许被微信索引
小程序官方建议把所有小程序的页面，都存放在 pages 目录中，以单独的文件夹存在，如图所示：
其中，每个页面由 4 个基本文件组成，它们分别是：
JSON 是一种数据格式，在实际开发中，JSON 总是以配置文件的形式出现。小程序项目中也不例外：通过不同的 .json 配置文件，可以对小程序项目进行不同级别的配置。
小程序项目中有 4 种 json 配置文件，分别是：
接下来我们对上面四种配置文件展开说说：
文件
是当前小程序的全局配置，包括了小程序的所有页面路径、窗口外观、界面表现、底部 tab 等。Demo 项目里边的 配置内容如下：
简单了解下这 4 个配置项的作用：
文件
是项目配置文件，用来记录我们对小程序开发工具所做的个性化配置，例如：
注意：我们在详情页中的本地设置做出的操作，会在文件中进行同步
文件
微信现已开放小程序内搜索，效果类似于 PC 网页的 SEO。 文件用来配置小程序页面是否允许微信索引。
当开发者允许微信索引时，微信会通过爬虫的形式，为小程序的页面内容建立索引。当用户的搜索关键字和页面的索引匹配成功的时候，小程序的页面将可能展示在搜索结果中。
如果不想被索引，我们可以将action中的allow改成disallow
注意：sitemap 的索引提示是默认开启的，如需要关闭 sitemap 的索引提示，可在小程序项目配置文件 的 setting 中配置字段 checkSiteMap 为 false
页面的 .json 配置文件
小程序中的每一个页面，可以使用 .json 文件来对本页面的窗口外观进行配置，页面中的配置项会覆盖 的 window 中相同的配置项。例如：
新建一个小程序页面：只需要在 -> pages 中新增页面的存放路径，小程序开发者工具即可帮我们自动创建对应的页面文件，如图所示：
pages文件夹下面放着list目录，list目录里面有list页面
修改项目首页:只需要调整 -> pages 数组中页面路径的前后顺序，即可修改项目的首页。小程序会把排在第一位的页面，当作项目首页进行渲染，如图所示:
WXML（WeiXin Markup Language）是小程序框架设计的一套标签语言，用来构建小程序页面的结构，其作用类似于网页开发中的 HTML。
WXML 和 HTML 的区别：
WXSS (WeiXin Style Sheets)是一套样式语言，用于描述 WXML 的组件样式，类似于网页开发中的 CSS
WXSS 和 CSS 的区别:
小程序基本开发流程 第3篇
提示：提交审核阶段有些需要注意的事项，一个是小程序的代码最大限制为2M，如果有分包的话可以有更大容量，如果您需要与后端交互，建议把所有相关的图片放到服务器上，另一个就是注册小程序前需检查小程序的logo和名字是否已经被注册过，是否被别人注册了商标
代码以及课件和视频资源领取方式： 关注公众号：小猿搜码 后台发送：csdn小程序
小程序基本开发流程 第4篇
1. 小程序中组件的分类
小程序中的组件也是由宿主环境提供的，开发者可以基于组件快速搭建出漂亮的页面结构。官方把小程序的组件分为了 9 大类，分别是：
① 视图容器 ② 基础内容 ③ 表单组件 ④ 导航组件 ⑤ 媒体组件 ⑥ map 地图组件 ⑦ canvas 画布组件 ⑧ 开放能力 ⑨ 无障碍访问
2. 常用的视图容器类组件
① view ⚫ 普通视图区域 ⚫ 类似于 HTML 中的 div，是一个块级元素 ⚫ 常用来实现页面的布局效果 ② scroll-view ⚫ 可滚动的视图区域 ⚫ 常用来实现滚动列表效果 ③ swiper 和 swiper-item ⚫ 轮播图容器组件 和 轮播图 item 组件
右下角第4段代码解释：
.container1 这里的.表示选择器是一个类选择器。container1是类名，这意味着这个样式规则将应用于所有具有container1类的HTML元素。
display: flex;： 当一个元素设置为display: flex;后，它的直接子元素将按照弹性盒模型（Flexbox）的布局方式排列。Flexbox是一种用于在容器内分配和对齐子元素的一维布局方法。
justify-content: space-around justify-content属性用于设置弹性容器内弹性项目在主轴上的对齐方式。 space-around值表示弹性项目将在主轴上平均分布，每个项目两侧的空间相等
小程序基本开发流程 第5篇
page存放当前小程序所有页面的路径，可以不主动添加，可直接在目录下右击新建页面，page会自动注册增加该页面的路径。
1. 什么是WXML
WXML（WeiXin Markup Language）是小程序框架设计的一套标签语言，用来构建小程序页面的结构，其作用类似于网页开发中的 HTML。 2. WXML 和 HTML 的区别
① 标签名称不同 ⚫ HTML （div, span, img, a） ⚫ WXML（view, text, image, navigator） ② 属性节点不同
③ 提供了类似于 Vue 中的模板语法 ⚫ 数据绑定 ⚫ 列表渲染 ⚫ 条件渲染
WXSS (WeiXin Style Sheets)是一套样式语言，用于描述 WXML 的组件样式，类似于网页开发中的 CSS。
WXSS 和 CSS 的区别
① 新增了 rpx 尺寸单位 ⚫ CSS 中需要手动进行像素单位换算，例如 rem ⚫ WXSS 在底层支持新的尺寸单位 rpx，在不同大小的屏幕上小程序会自动进行换算
② 提供了全局的样式和局部样式 ⚫ 项目根目录中的 会作用于所有小程序页面 ⚫ 局部页面的 .wxss 样式仅对当前页面生效
③ WXSS 仅支持部分 CSS 选择器 ⚫ .class 和 #id ⚫ element ⚫ 并集选择器、后代选择器 ⚫ ::after 和 ::before 等伪类选择器
小程序基本开发流程 第6篇
温馨提示：一个身份证最多只能注册5个小程序账号，所以要慎重使用自己的身份证。当注册满了以后会提示:该身份证记登记过5次，请使用另一个身份证完成用户信息登记。
个人小程序不支持微信认证，微信支付以及高级接口能力 小程序的AppID（Application ID）是小程序在特定平台上的唯一标识符。每个小程序在注册时都会被分配一个AppID，它是小程序开发者进行开发、调试和发布的关键凭证之一。以下是关于小程序AppID的一些详细信息：
小程序的appID很重要，以后开发要用到。