小程式2017.08.31更新大版本，本系列文章暫停更新，正在製作最新版本內容，敬請期待吧
?? 微信小程式課程，面向所有具備前端基礎知識的同學 ??
微信小程式自發布以來，廣受大家關注。小程式釋出初期，顛覆現有移動網際網路格局，讓很多開發者欣喜若狂。如今，隨著小程式入口越來越多的開放，越來越多的開發者加入到小程式的開發大軍中。滬江Web前端團隊打造了【小程式實戰文章+視訊教程】是為初學者量身打造的一系列課程。
§ 核心人員
|
|
|
|
|
|
|
|
|
§ 閱讀要求
讀者需要具備但不限於以下技能
- HTML
- JavaScript
es6更佳- CSS
一共四部分十五小節，適合七天的訓練營。
從現在開始，我假裝你已經掌握了 html、 css以及 ES6 ☝️
§ 目標導向
本教程以實戰專案驅動，最終實現一個完整的小程式
列表頁面：請求介面，並展示列表頁面資料
詳情頁面：以文章id為引數，獲取文章詳情
詳情頁面，點選圖片，展示大圖
§ 教程大綱
- 第一章：小程式初級入門教程
- appID準備
- 工具安裝
- 目錄說明
- 小試牛刀
- 釋出流程
- 第二章：小程式中級實戰教程：預備篇
- 專案結構設計
- 提取 util 公用方法
- 封裝網路請求及 mock 資料
- 第三章：小程式中級實戰教程：列表篇
- 列表-靜態頁面製作
- 列表-頁面邏輯處理
- 列表-檢視與資料關聯
- 列表-閱讀標識
- 第四章：小程式中級實戰教程：詳情篇
- 詳情-頁面製作
- 詳情-檢視渲染
- 詳情-功能完善
- 第五章：課後作業練習
§ 學習方式
教程以 git 分支的方式管理，比如學習第三章第一節 列表-靜態頁面製作 時候，需要切換到 ch3-1 分支，然後把分支目錄 code/ 匯入到微信開發工具編輯器，跟隨教程進行實戰程式碼操作。操作如下：
-
通過
git把專案複製到本地git clone https://github.com/ikcamp/wechat-xcx-tutorial複製程式碼 -
切換目錄
cd wechat-xcx-tutorial複製程式碼 -
在當前目錄下切換分支
git checkout ch3-1複製程式碼
注意： 每一分支的 code/ 內容，皆是上一節內容操作完成後的結果。比如 ch3-2/code 就是上一節課程 ch3-1/code 隨教程操作後的結果。
§ 教程完整程式碼
教程的完整程式碼在分支
完整程式碼中，請自行查閱
§ 課後作業
整個教程學習過後，可以切換到
教程作業分支，並完成作業，目錄下有相應的作業答案，請自行完成練習。
【下一章】【小程式實戰文章+視訊教程】第一章：小程式初級入門教程 – appID準備
iKcamp原創新書《移動Web前端高效開發實戰》已在亞馬遜、京東、噹噹開售。