【5270】-微信小程序入门与实战-全新版
第1章 2020全新版:初识微信小程序
本章,我们初步了解什么是微信小程序。同时,我们会下载微信小程序工具、申请appid,并进行一些列开发的准备工作。
共 6 节 (35分钟) 收起列表
1-1 2020版重录说明 (04:55)
1-2 下载小程序开发工具 (02:54)
1-3 新建小程序项目 (08:04)
1-4 小程序appid的注册 (01:49)
1-5 新版小程序开发工具的一些基本设置 (10:24)
1-6 小程序的基本单位-Page页面 (06:06)
第2章 2020全新版:小程序的基本目录结构与文件作用剖析
本章我们会了解小程序官方种子项目的目录结构,并介绍Page页面。同时我们还需要了解页面级别的文件和应用程序级别的文件有什么区别。
共 3 节 (25分钟) 收起列表
2-1 小程序页面的4种基本文件类型详解 (09:39)
2-2 小程序的全局配置文件、全局样式表和应用程序级别js文件 (07:44)
2-3 认识一下我们要开发的Flower项目 (07:02)
第3章 2020全新版:rpx响应式单位与flex布局
本章我们通过制作第一个welcome欢迎页面来学习如何在小程序中做响应式。同时,我们需要学习非常重要的布局语法——flex布局。这是在小程序中用的最多也是 最为好用的布局方案。
共 9 节 (88分钟) 收起列表
3-1 JSON对象与JS对象的区别(重点) (06:13)
3-2 新建页面的技巧与规则 (08:01)
3-3 image标签显示一张图片 (07:06)
3-4 小程序rpx响应式单位的特点(非常重要) (16:14)
3-5 分离CSS样式到WXSS文件中 (06:57)
3-6 初识flex布局进行垂直分布布局 (10:47)
3-7 flex布局的align-items (06:45)
3-8 自己编写一个Button组件 (07:34)
3-9 聊聊小程序的方便性与灵活性的悖论 (17:29)
第4章 2020全新版:阅读列表与setData数据绑定
本章我们通过编写新闻阅读页面来学习小程序的数据绑定的概念。同时,我们也会介绍LinUI组件库的用法。
共 16 节 (149分钟) 收起列表
4-1 LinUI组件库介绍 (06:52)
4-2 安装、编译LinUI (12:01)
4-3 如何使用自定义组件 (13:05)
4-4 l-avatar头像和昵称组件 (09:22)
4-5 添加新的编译模式 (07:47)
4-6 初步了解Swiper和Swiper-Item组件 (08:29)
4-7 Swiper组件(1)通过插槽设置轮播内容 (08:49)
4-8 Swiper组件(3)Swiper组件内容的高宽设置技巧 (08:40)
4-9 属性设置一定要注意字符串以JS表达式的区别(重要) (12:26)
4-10 布尔属性值赋值的良好建议 (04:44)
4-11 Swiper组件的其他重要属性设置 (07:26)
4-12 用Flex布局组织布局思路(1) (09:37)
4-13 用Flex布局组织布局思路(2) (06:49)
4-14 用Flex布局组织布局思路(3) (10:30)
4-15 用Flex布局组织布局思路(4) (09:56)
4-16 用Flex布局组织布局思路(5) (12:10)
第5章 2020全新版:条件渲染、列表渲染与小程序事件
本章我们来学习wx:if与wx:for等渲染语法。同时我们需要了解小程序的事件处理机制。
共 16 节 (156分钟) 收起列表
5-1 使用LinUI的Icon组件代替图片ICON (11:20)
5-2 LinUI Icon组件的颜色和大小设置 (08:18)
5-3 小程序开发数据的流向(1) (09:42)
5-4 单向数据绑定与双向数据绑定 (13:37)
5-5 数据绑定与setData函数(1) (12:03)
5-6 DOM优先 VS 数据优先 (08:26)
5-7 理解Page.data与this.SetData的关系 (08:33)
5-8 预先在data中定义绑定数据的初始值是值得推荐的做法 (06:20)
5-9 小程序的生命周期函数与特殊回调函数 (13:32)
5-10 数据绑定的实战应用 (07:59)
5-11 Mustache语法解析 (18:02)
5-12 条件渲染 (06:59)
5-13 列表渲染(上) (14:01)
5-14 列表渲染(下) (05:15)
5-15 什么是事件 (04:35)
5-16 bind来捕捉事件执行回调函数 (06:42)
第6章 2020全新版:路由函数与事件冒泡
本章我们将重点学习小程序的几个路由函数用于跳转页面,同时我们将学习小程序的事件冒泡机制。
共 7 节 (65分钟) 收起列表
6-1 路由函数NavigateTo和RedirectTo的区别 (14:44)
6-2 Catch与Bind事件的区别 (08:49)
6-3 js模块的导入导出(require与import)_1 (13:33)
6-4 用列表渲染展示导入的数组数据 (07:55)
6-5 从列表页面跳转到文章详情页面 (08:41)
6-6 列表渲染的wxkey赋值规则 (06:05)
6-7 事件冒泡的具体应用 (05:12)
第7章 2020全新版:构建阅读详情页面
本章我们主要构建新闻详情页面,同时介绍Flex的主轴和交叉轴、自定义属性data-等技术和知识
共 11 节 (88分钟) 收起列表
7-1 构建文章详情页面(1) (07:32)
7-2 构建文章详情页面(2) (03:58)
7-3 构建文章详情页面(3) (09:13)
7-4 Flex的高级应用(1) (13:10)
7-5 Flex高级应用(2)主轴和交叉轴 (10:11)
7-6 Flex高级应用(3) (04:08)
7-7 组件的自定义属性data (07:27)
7-8 自定义属性data-的命名规则 (11:24)
7-9 在页面的onLoad函数中获取查询参数 (06:51)
7-10 加载详情数据并填充页面 (09:59)
7-11 为什么只传post-id (03:53)
第8章 2020全新版:缓存机制与异步API的async和await
本章我们通过制作文章收藏的功能,学习小程序的缓存机制与异步API的调用方案,同时我们将学习如何使用async和await来简化异步API的调用。
共 15 节 (123分钟) 收起列表
8-1 app.js的意义和作用 (07:04)
8-2 在app.js中保存全局变量 (03:58)
8-3 小程序缓存的增删改查与清除 (11:06)
8-4 异步函数的几个方案:回调函数、promise与await (13:44)
8-5 文章收藏(1)分析思路 (10:48)
8-6 文章收藏(2)JS的动态属性 (05:39)
8-7 收藏未收藏的切换 (05:23)
8-8 初始化收藏状态 (06:11)
8-9 缓存如何不被覆盖? (07:41)
8-10 同步文章缓存状态 (06:59)
8-11 showToast接口的应用 (08:53)
8-12 牢记setData对于data属性的影响 (06:08)
8-13 showToast更换成showModal(1) (10:25)
8-14 showModal的回调函数与Promise (10:12)
8-15 showActionSheet的使用 (08:32)
第9章 2020全新版:音乐播放
本章我们将只做音乐播放功能,通过音乐播放我们重点学习如何编写复杂的业务逻辑,这对于大家的逻辑思维能力有很好的培养效果。
共 11 节 (90分钟) 收起列表
9-1 浮动居中方案-通过left和top定位音乐图标 (12:23)
9-2 小程序音乐播放API介绍 (05:24)
9-3 小试音乐播放API (11:10)
9-4 切换音乐播放图标的两种方案:条件渲染与js表达式 (12:33)
9-5 音乐播放状态切换 (08:15)
9-6 背景音乐的监听相关API (04:56)
9-7 同步音乐总控开关与自有播放开光的状态 (09:46)
9-8 音乐控制面板的暂停与停止逻辑 (04:53)
9-9 全局变量解决音乐播放状态初始化不正确的问题 (07:11)
9-10 分析一个不是问题的问题 (03:52)
9-11 让每篇文章音乐独立显示状态 (08:43)
第10章 2020全新版:初识小程序的自定义组件
本章我们将学习如何开发类似LinUI一样的自定义组件。自定义组件对于小程序来说非常重要,一定要好好学习。同时我们将介绍小程序的tabBar配置方案。
共 11 节 (80分钟) 收起列表
10-1 文章列表顶部轮播图跳转 (04:17)
10-2 小程序tabBar选项卡配置基础 (07:14)
10-3 小程序tabBar的其他配置选项 (09:29)
10-4 跳转到带有选项卡的页面需要使用switchTab (02:48)
10-5 初识自定义组件 (09:13)
10-6 新建第一个自定义组件 (07:12)
10-7 创建自定义组件的属性 (07:40)
10-8 自定义组件属性的简化定义 (05:06)
10-9 自定义属性可以接收一个Object对象 (06:12)
10-10 分离文章到单独的自定义组件中 (06:30)
10-11 自定义组件的嵌套引用 (13:58)
第11章 2020全新版:电影页面与实战自定义组件
我们将全部用组件化思维构建电影页面,在这个章节我们将学习什么是组件化思维,并深入了解自定义组件的机制。
共 12 节 (109分钟) 收起列表
11-1 Movie自定义组件的构建 (09:27)
11-2 使用LinUI的评分组件快速实现分数预览 (11:53)
11-3 简易评分组件的实现思路(选看) (04:20)
11-4 巧用Flex布局的Space-Between进行分布排列 (08:41)
11-5 调整自定义组件间距 (07:04)
11-6 外部样式类externalClasses的使用 (13:22)
11-7 小试牛刀访问服务端数据 (08:34)
11-8 从服务器加载数据分页数据并传入自定义组件 (12:20)
11-9 使用ES6箭头函数解决this指代的问题 (08:26)
11-10 绑定电影数据(1)两种不同的评分方式 (06:55)
11-11 绑定服务端电影数据(2) (07:34)
11-12 完成即将上映和top250 (09:51)
第12章 2020全新版:电影列表与电影搜索
本章我们主要学习制作电影列表宫格页面与电影搜索功能。本章的重点在于小程序的布局技巧与前面知识的复习与练习
共 11 节 (88分钟) 收起列表
12-1 wx.request的更多参数讲解 (05:59)
12-2 更多电影(1)分析更多电影页面的逻辑 (10:02)
12-3 更多电影(2)加载更多数据 (08:53)
12-4 更多电影(3)Flex-Wrap的应用 (08:33)
12-5 更多电影(4)Flex布局对于普通样式类的影响 (06:52)
12-6 更多电影(5)加载不同类型的电影数据 (08:43)
12-7 使用LinUI快速构建搜索栏 (07:52)
12-8 向服务器请求搜索数据 (09:45)
12-9 搜索结果与电影数据的切换显示 (07:56)
12-10 显示搜索的电影数据 (07:31)
12-11 修复Space-Between2个元素两端分布的问题 (05:31)
第13章 2020全新版:电影详情与滑动加载数据、下拉刷新数据
本章我们重点制作电影详情页面,电影详情页面比较复杂,元素和CSS都比较多。同学们需要重点学习CSS布局的一些技巧。同时我们还会介绍如何滑动加载更多分页数据、如何刷新数据。Flex布局的嵌套应用与Scroll-View组件的应用也需要认真学习...
共 19 节 (192分钟) 收起列表
13-1 上滑加载更多数据(1)onReachBottom (12:16)
13-2 上滑加载更多数据(2)showloading提示 (06:15)
13-3 下拉刷新数据(1) (11:58)
13-4 配置标题与动态配置标题 (13:19)
13-5 谈组件的独立性 (06:52)
13-6 自定义组件的自定义事件产生 (09:27)
13-7 获取自定义组件的detail参数 (07:19)
13-8 同时获取自定义属性和自定义组件的detail参数 (12:17)
13-9 电影详情页面(1)获取电影详情数据 (07:45)
13-10 电影详情页面(2)顶部区域 (10:19)
13-11 电影详情页面(3)头部元素浮动技巧 (10:11)
13-12 电影详情页面(4)图片预览效果只做 (10:06)
13-13 电影详情页(5)图片的多种mode模式 (09:00)
13-14 数据预处理 (24:05)
13-15 电影简介部分的CSS构建 (08:54)
13-16 处理影人信息 (09:45)
13-17 多层Flex布局的嵌套应用 (07:53)
13-18 调整影人信息的CSS细节 (05:09)
13-19 Scroll-View组件的应用与结束语 (08:25)
第14章 19版:什么是微信小程序?
介绍小程序的特点与适用场景、对开发者的影响以及课程特色!
共 9 节 (68分钟) 收起列表
14-1 序:十几个小时的课程就这节最重要 (05:47)
14-2 升级重录说明(重要) (08:06)
14-3 开篇及课程特色介绍 (17:16)
14-4 直观感受一下微信小程序 (13:47)
14-5 小程序适合做什么样的应用 (11:40)
14-6 对开发者的影响 (04:34)
14-7 学习基础 (02:32)
14-8 新版开发工具UI说明 (01:50)
14-9 新版小程序务必勾选“不校验TLS、HTTPS” (02:07)
第15章 19版:小程序环境搭建与开发工具介绍
小程序开发工具的下载与安装、微信Web开发者工具主要功能简介
共 4 节 (45分钟) 收起列表
15-1 小程序进阶——新课程指南 (07:52)
15-2 申请appid (04:05)
15-3 下载并安装微信开发者工具 (13:51)
15-4 微信开发工具UI简介与小程序调试方法 (18:14)
第16章 19版:从一个简单的“欢迎“页面开始小程序之旅
完成第一个小程序页面,并学习小程序的基本目录与文件结构,View、Image、Text组件,RPX自适应单位,Flex弹性盒子模型、小程序基本配置项等知识。
共 11 节 (122分钟) 收起列表
16-1 本章内容简介 (01:38)
16-2 官方种子项目与小程序页面 (10:24)
16-3 应用程序级别文件 (08:46)
16-4 小程序的页面层级结构 (08:12)
16-5 新建welcome欢迎页面 (06:24)
16-6 我的第一个页面 (13:13)
16-7 认识小程序的rpx (17:40)
16-8 使用flex(弹性盒子)快速布局 (13:35)
16-9 制作项目启动页之小程序app.json基础配置 (09:43)
16-10 章节扩展(可选观看1)移动端分辨率精讲 (16:44)
16-11 章节扩展(可选观看2)小程序的自适应单位RPX精讲 (15:27)
第17章 19版:第二个页面:新闻阅读列表
使用Swiper组件、数据绑定、列表渲染等技术来构建新闻阅读页面,学习小程序Page的生命周期等知识。除此之外,还将简单介绍微信小程序账号与真机运行。
共 13 节 (188分钟) 收起列表
17-1 第四章课程简介 (04:52)
17-2 使用Swiper组件构建轮播图 (19:53)
17-3 Swiper组件属性设置 (11:31)
17-4 全局配置与页面配置 (11:48)
17-5 构建新闻列表(上) (13:55)
17-6 构建新闻列表(下) (24:01)
17-7 JS与小程序Page页面生命周期 (16:52)
17-8 数据绑定概念和基础 (13:09)
17-9 setData方法绑定数据 (06:39)
17-10 数据绑定的扩展用法 (12:08)
17-11 条件渲染与列表渲染 (26:34)
17-12 小程序的事件机制——捕捉与回调 (17:09)
17-13 小程序的事件机制——catch与bind (09:01)
第18章 19版:小程序的模板化与模块化
优化代码,使用require构建模块儿化的JavaScript代码以及使用template构建模板化小程序。感受在小程序中使用template的优势。
共 4 节 (40分钟) 收起列表
18-1 将业务中的数据分离到单独的数据文件中 (11:58)
18-2 使用require方法加载js模块儿文件 (06:56)
18-3 template模板的使用 (16:48)
18-4 关于新版自定义组件的说明 (04:11)
第19章 19版:构建新闻详情页面
新闻详情页面包括音乐播放、文章收藏等功能。本节将讲解音乐播放器的用法,重点学习缓存、条件渲染及Toast、ActionSheet接口的使用。
共 19 节 (248分钟) 收起列表
19-1 从文章列表跳转到新闻详情页面(组件自定义属性及获取属性) (22:30)
19-2 先静后动,构建新闻详情页面样式 (22:53)
19-3 配置全局导航栏颜色 (07:11)
19-4 使用数据填充新闻详情页面 (19:14)
19-5 缓存Storage的基本用法 (12:32)
19-6 文章缓存出错修复方案 (03:09)
19-7 使用缓存实现文章收藏功能 (21:39)
19-8 交互反馈 wx.showToast (11:04)
19-9 操作反馈wx.showModal (17:31)
19-10 交互反馈wx.showActionSheet (11:48)
19-11 同步异步方法对比 (12:31)
19-12 playBackgroundAudio-音乐播放基本实现 (23:36)
19-13 加入不同的音乐,个性化音乐播放 (08:03)
19-14 修复音乐播放闪退的问题 (02:13)
19-15 监听播放事件完善音乐播放 (10:27)
19-16 应用程序生命周期 (12:57)
19-17 继续完善音乐播放 (06:48)
19-18 音乐播放最终章 (11:55)
19-19 真机如何清除缓存与template内路径问题 (09:10)
第20章 19版:开始制作电影资讯页面
本章我们将调用服务器数据,编写电影资讯首页。包括正在热映、即将上映、top250三类电影数据的加载,进一步的深入使用template、学习使用wx.request加载服务器数据。
共 16 节 (221分钟) 收起列表
20-1 重要补充说明(关于API调用403) (09:00)
20-2 Banner轮播图跳转文章详情 (20:13)
20-3 三种主要的路由API (02:22)
20-4 给项目加入tab选项卡 (10:52)
20-5 完善tab选项卡 (08:50)
20-6 电影页面嵌套template分析 (11:21)
20-7 3个嵌套template标签的实现 (22:48)
20-8 stars template的样式实现 (14:55)
20-9 movie template的样式实现 (04:09)
20-10 movie-list template的样式实现 (17:14)
20-11 RESTful API简介及调用豆瓣API (25:42)
20-12 获取正在热映、即将上映和Top250的数据 (15:45)
20-13 电影页面数据绑定(上) (20:29)
20-14 电影页面数据绑定(下) (13:04)
20-15 星星评分组件的实现 (17:45)
20-16 更换电影分类标题 (05:38)
第21章 19版:更多电影及电影搜索页面的实现
完成更多电影页面及电影资讯检索页面,template模板将在本章被大量使用,可以充分体现模板化编程思想的重要性
共 8 节 (105分钟) 收起列表
21-1 更多电影页面的编写思路与电影类型获取 (14:12)
21-2 动态设置导航栏标题 (08:27)
21-3 更多电影页面加载数据 (19:25)
21-4 实现movie-grid template (12:48)
21-5 实现上滑加载更多数据 (25:37)
21-6 设置loading状态 (05:41)
21-7 实现下拉刷新数据 (13:46)
21-8 backgroundColor 到底设置的是哪里的颜色 (04:32)
第22章 19版:构建电影详情页面
除了完成以上页面,我们还将模拟常见APP的上滑加载更多和下拉刷新页面等操作,并学习Image组件的高级用法、如何与组件进行数据交互、Scroll-View组件用法等知识。
共 11 节 (165分钟) 收起列表
22-1 电影搜索页面构建(上) (31:22)
22-2 电影搜索页面构建(下) (18:19)
22-3 修复音乐播放完成后图标状态没有复位的bug (03:27)
22-4 编写电影详情页面(上) (19:48)
22-5 编写电影详情页面(下) (13:40)
22-6 图片的缩放与裁剪 (18:00)
22-7 新版本更新后的补充章节 (12:05)
22-8 编写电影详情页面骨架 (12:56)
22-9 完成电影详情页面(上) (22:55)
22-10 完成电影详情页面 (下) (09:15)
22-11 小程序Q&A (02:32)
第23章 19版:Form表单类组件与Map地图组件
本章我们将聊聊我们没有在项目中用到的一些组件和API,包括Form表单的相关组件、Map地图组件
共 6 节 (46分钟) 收起列表
23-1 form之switch组件 (05:57)
23-2 form之slider组件 (05:23)
23-3 form之radio组件 (04:43)
23-4 form之checkbox组件 (03:53)
23-5 form表单提交 (09:39)
23-6 map组件 (16:16)
第24章 19版:0.15.152900 版本重要API、功能讲解
新版本重要解析、用户登录及获取用户信息接口解析、新增API解析以及常见误区解读
共 6 节 (75分钟) 收起列表
24-1 新版本重要特性总览 (17:09)
24-2 选择用户收货地址API (05:28)
24-3 对login、getUserInfo等接口的改动与理解 (25:52)
24-4 用户设置界面与动态分享详解 (10:29)
24-5 场景值获取方式与应用举例 (09:28)
24-6 当我们谈编程能力的时候,我们谈的是什么(选自Java全栈体系课。) (06:09)
第25章 19版:扩展内容ES6在小程序中的使用与微信小程序后台账号配置
我们将用ES6的Class和箭头函数改写部分小程序代码,并讲解微信小程序后台账号的配置方法。
共 4 节 (55分钟) 收起列表
25-1 小程序常见问题(非常重要) (17:57)
25-2 小程序中的ES6 Class (08:22)
25-3 使用Module和Class提取封装一个Movie对象 (19:40)
25-4 箭头函数、致谢与再见 (08:09)
本课程已完结