iKcamp出品微信小程序教学共5章16小节汇总(含视频)

<h2 align="center"> 🇨🇳 微信小程序课程，面向全部具有前端基础知识的同窗 🇨🇳 </h2>

阅读要求

读者须要具有但不限于如下技能

• HTML
• JavaScript es6更佳
• CSS

一共四部分十五小节，适合七天的训练营。
从如今开始，我伪装你已经掌握了 html、 css以及 ES6 ☝️

<br>

目标导向

本教程以实战项目驱动，以沪江英语微信小程序项目框架为基础，最终还原一个完整的小程序

列表页面：请求接口，并展现列表页面数据

详情页面：以文章id为参数，获取文章详情

详情页面，点击图片，展现大图

教程大纲 - 完整视频地址

• 第一章：小程序初级入门教程
  • appID准备
  • 文章视频：https://camp.qianduan.group/xcx/1/1/1
  • 工具安装
  • 文章视频：https://camp.qianduan.group/xcx/1/1/2
  • 目录说明
  • 文章视频：https://camp.qianduan.group/xcx/1/1/3
  • 小试牛刀
  • 文章视频：https://camp.qianduan.group/xcx/1/1/4
  • 发布流程
  • 文章视频：https://camp.qianduan.group/xcx/1/1/5
• 第二章：小程序中级实战教程：预备篇
  • 项目结构设计
  • 文章视频：https://camp.qianduan.group/xcx/1/2/1
  • 提取 util 公用方法
  • 文章视频：https://camp.qianduan.group/xcx/1/2/2
  • 封装网络请求及 mock 数据
  • 文章视频：https://camp.qianduan.group/xcx/1/2/3
• 第三章：小程序中级实战教程：列表篇
  • 列表-静态页面制做
  • 文章视频：https://camp.qianduan.group/xcx/1/3/1
  • 列表-页面逻辑处理
  • 文章视频：https://camp.qianduan.group/xcx/1/3/2
  • 列表-视图与数据关联
  • 文章视频：https://camp.qianduan.group/xcx/1/3/3
  • 列表-阅读标识
  • 文章视频：https://camp.qianduan.group/xcx/1/3/4
• 第四章：小程序中级实战教程：详情篇
  • 详情-页面制做
  • 文章视频：https://camp.qianduan.group/xcx/1/4/1
  • 详情-视图渲染
  • 文章视频：https://camp.qianduan.group/xcx/1/4/2
  • 详情-功能完善
  • 文章视频：https://camp.qianduan.group/xcx/1/4/3
• 第五章：课后做业练习

学习方式

教程以 git 分支的方式管理，好比学习第三章第一节 列表-静态页面制做 时候，须要切换到 ch3-1 分支，而后把分支目录 code/ 导入到微信开发工具编辑器，跟随教程进行实战代码操做。操做以下：

1. 经过 git 把项目复制到本地

git clone https://github.com/ikcamp/wechat-xcx-tutorial

2. 切换目录

cd wechat-xcx-tutorial

3. 在当前目录下切换分支

git checkout ch3-1

注意： 每一分支的 code/ 内容，皆是上一节内容操做完成后的结果。好比 ch3-2/code 就是上一节课程 ch3-1/code 随教程操做后的结果。  

<br>

<a>§ 教程完整代码</a>

教程的完整代码在分支 完整代码 中，请自行查阅

<br>

<a>§ 课后做业</a>

整个教程学习事后，能够切换到 教程做业 分支，并完成做业，目录下有相应的做业答案，请自行完成练习。

<br>

<a>§ 核心人员</a>

<table> <tbody> <tr> <td align="center" valign="top"> <img width="85" height="85" src="https://user-gold-cdn.xitu.io/2017/11/6/9a734087ebdc734c00b850e4561f9f01"> <br> <a href="https://github.com/aximario">aximario</a> <p></p> <p></p> </td> <td align="center" valign="top"> <img width="85" height="85" src="https://user-gold-cdn.xitu.io/2017/11/6/e2dfd0cd09608f7cb6788596615b5823"> <br> <a href="https://github.com/pavelShen">pavelShen</a> <p></p> <p></p> </td> <td align="center" valign="top"> <img width="85" height="85" src="https://user-gold-cdn.xitu.io/2017/11/6/d438e0a92b80501a9810fe9a505525ff"> <br> <a href="https://github.com/pangz1">pangz1</a> <p></p> <p></p> </td> <td align="center" valign="top"> <img width="85" height="85" src="https://user-gold-cdn.xitu.io/2017/11/6/1bac111148a845d14354b928949b643b"> <br> <a href="https://github.com/tinyuen">tinyuen</a> <p></p> <p></p> </td> <td align="center" valign="top"> <img width="85" height="85" src="https://user-gold-cdn.xitu.io/2017/11/6/f60c08f4075a83504d669d19690738d9"> <br> <a href="https://github.com/roeis">roeis</a> <p></p> <p></p> </td> <td align="center" valign="top"> <img width="85" height="85" src="https://user-gold-cdn.xitu.io/2017/11/6/28a19b2829af5cbb059451f0e37b62a5"> <br> <a href="https://github.com/sqzhuyi">sqzhuyi</a> <p></p> <p></p> </td> <td align="center" valign="top"> <img width="85" height="85" src="https://user-gold-cdn.xitu.io/2017/11/6/4686ec99e3b5a1a86767ee8a4a8a5d05"> <br> <a href="https://github.com/longdiandian9">longdiandian9</a> <p></p> <p></p> </td> <td align="center" valign="top"> <img width="85" height="85" src="https://user-gold-cdn.xitu.io/2017/11/6/887925bf222d1f0730a3231649e4ac3e"> <br> <a href="https://github.com/brucecham">brucecham</a> <p></p> <p></p> </td> </tr> </tbody> </table>

<br/>

§ 讨论活动区

QQ群：661407609

iKcamp官网：http://www.ikcamp.com

访问官网更快阅读所有免费分享课程：《iKcamp出品｜全网最新｜微信小程序｜基于最新版1.0开发者工具之初中级培训教程分享》。 包含：文章、视频、源代码

iKcamp原创新书《移动Web前端高效开发实战》已在亚马逊、京东、当当开售。

【11月11号】上海iKcamp最新活动

报名地址：http://www.huodongxing.com/event/5409924174200

与“每天练口语”小程序总榜排名第4、教育类排名第一的研发团队，面对面沟通交流。

合做社区