課程簡介
小程序是一種不需要下載安裝即可使用的應(yīng)用，它實(shí)現(xiàn)了應(yīng)用“觸手可及”的夢想，用戶掃一掃或者搜一下即可打開應(yīng)用。也體現(xiàn)了“用完即走”的理念，用戶不用關(guān)心是否安裝太多應(yīng)用的問題。應(yīng)用將無處不在，隨時可用，但又無需安裝卸載。
本課程從零基礎(chǔ)開發(fā)，詳細(xì)介紹小程序開發(fā)時的，環(huán)境搭建、組件、API的使用，以及開發(fā)完成后，部署上線的全部內(nèi)容。
目標(biāo)收益
?學(xué)習(xí)小程序開發(fā)的全部功能。
?學(xué)會如何在微信中運(yùn)用小程序框架開發(fā)應(yīng)用。
?掌握在頁面中使用小程序中重要組件和API的功能開發(fā)。
?了解通過小程序中Video元素基本使用功能。
?理解小程序中本地?cái)?shù)據(jù)存儲的方法與技巧。
培訓(xùn)對象
?正在從事傳統(tǒng)PC端Web頁面的技術(shù)開發(fā)人員。
?希望從事移動端WebApp應(yīng)用開發(fā)的技術(shù)人員。
?對前端技術(shù)感興趣，希望從事這方面工作的人員。
?掌握一些傳統(tǒng)的前端開發(fā)技術(shù)，想進(jìn)一步學(xué)習(xí)移動端應(yīng)用開發(fā)的人員。
課程大綱
| 前期準(zhǔn)備 |
1.1.下載開發(fā)工具 1.2.準(zhǔn)備登錄帳號 1.3.申請小程序開發(fā)帳號 1.4.開通服務(wù)端的接口網(wǎng)站 1.5.解決https和TSL版本過低的原因 |
| flex布局 |
2.1.flex布局的定義 2.2.容器和項(xiàng)目的屬性 2.3.案例一：使用flex實(shí)現(xiàn)骰子和網(wǎng)格布局 2.4.案例二：使用flex實(shí)現(xiàn)新聞頁的反向隨機(jī)布局 |
| 組件使用 |
3.1.雙大括號綁定數(shù)據(jù)的方式 3.2.Block遍歷綁定API數(shù)組 3.3.Swipe組件的使用方法 3.4.模板組件的語法與使用 3.5.sroll-view組件的上拉與下刷事件 3.6.video組件的注意事項(xiàng) 3.7.案例三：動畫制作推出點(diǎn)評框，彈出鍵盤輸入窗口 3.8.案例四：動畫制作旋轉(zhuǎn)、彈出、居中效果 |
| 重要API說明 |
4.1.如何POST提交數(shù)據(jù) 4.2.調(diào)用封裝后的方法與屬性 4.3.全局變量的定義與使用 4.4.案例五：使用本地存儲定時緩存API接口數(shù)據(jù) 4.5.案例六：頁面跳轉(zhuǎn)過程中的傳值與接收 |
| 交互API使用 |
5.1.信息提示功能 5.2.導(dǎo)航與信息置頂 5.3.掃碼與手機(jī)振動 5.4.案例七：查看商品的二維碼 5.5.案例八：顯示手機(jī)中的聯(lián)系人信息 |
| 其他API使用 |
6.1.設(shè)備信息顯示 6.2.音頻播放功能 6.3.地理定位顯示 6.4.案例九：通過經(jīng)緯度查找用戶坐標(biāo) 6.5.案例十：頁面的上拉刷新加載更多內(nèi)容 |
| 自定義組件與插件 |
7.1.聲明自定義組件 7.2.編寫組件模版 7.3.自定義組件的構(gòu)造器 7.4.組件的引用和配置 7.5.組件在其他頁面中的調(diào)用 7.6.第三方插件的調(diào)用方式 7.7.常用第三方插件的推薦 |
| 注意事項(xiàng) |
8.1.網(wǎng)絡(luò)請求異常的解決方案 8.2.圖片元素加載時的無初始化 8.3.事件冒泡現(xiàn)象的解決方案 8.4.Scrollview組件滾動時注意事項(xiàng) 8.5.wxml模板不生效的原因 8.6.video標(biāo)簽的適配問題 |
| 界面UI與設(shè)計(jì)方案 |
9.1.小程序界面設(shè)計(jì)標(biāo)準(zhǔn)和要求 9.2.WeUI 前端框架 9.3.Sketch 源文件 9.4.圖標(biāo)與布局 9.5.菜單與面板 |
| 案例實(shí)戰(zhàn)——動畫展示 |
10.1.項(xiàng)目功能需求分析 10.2.項(xiàng)目功能界面效果展示 10.3.調(diào)用API接口更新狀態(tài) 10.4.以動畫方式彈出禮品 |
| 案例實(shí)戰(zhàn)——地理查詢 |
11.1.頁面功能需求分析 11.2.業(yè)務(wù)邏輯分析 11.3.獲取經(jīng)緯度并在地圖中繪點(diǎn) 11.4.根據(jù)繪點(diǎn)調(diào)用API返回商家信息 11.5.將商家繪制在地圖上 |
| 小程序云端開發(fā) |
12.1.云開發(fā)介紹 12.2.構(gòu)建數(shù)據(jù)庫 12.3.云函數(shù) 12.4.云開發(fā)控制臺 |
| 數(shù)據(jù)集合操作 |
13.1.創(chuàng)建第一個集合 13.2.插入數(shù)據(jù) 13.3.讀取數(shù)據(jù) 13.4.更新和刪除數(shù)據(jù) |
|
前期準(zhǔn)備 1.1.下載開發(fā)工具 1.2.準(zhǔn)備登錄帳號 1.3.申請小程序開發(fā)帳號 1.4.開通服務(wù)端的接口網(wǎng)站 1.5.解決https和TSL版本過低的原因 |
|
flex布局 2.1.flex布局的定義 2.2.容器和項(xiàng)目的屬性 2.3.案例一：使用flex實(shí)現(xiàn)骰子和網(wǎng)格布局 2.4.案例二：使用flex實(shí)現(xiàn)新聞頁的反向隨機(jī)布局 |
|
組件使用 3.1.雙大括號綁定數(shù)據(jù)的方式 3.2.Block遍歷綁定API數(shù)組 3.3.Swipe組件的使用方法 3.4.模板組件的語法與使用 3.5.sroll-view組件的上拉與下刷事件 3.6.video組件的注意事項(xiàng) 3.7.案例三：動畫制作推出點(diǎn)評框，彈出鍵盤輸入窗口 3.8.案例四：動畫制作旋轉(zhuǎn)、彈出、居中效果 |
|
重要API說明 4.1.如何POST提交數(shù)據(jù) 4.2.調(diào)用封裝后的方法與屬性 4.3.全局變量的定義與使用 4.4.案例五：使用本地存儲定時緩存API接口數(shù)據(jù) 4.5.案例六：頁面跳轉(zhuǎn)過程中的傳值與接收 |
|
交互API使用 5.1.信息提示功能 5.2.導(dǎo)航與信息置頂 5.3.掃碼與手機(jī)振動 5.4.案例七：查看商品的二維碼 5.5.案例八：顯示手機(jī)中的聯(lián)系人信息 |
|
其他API使用 6.1.設(shè)備信息顯示 6.2.音頻播放功能 6.3.地理定位顯示 6.4.案例九：通過經(jīng)緯度查找用戶坐標(biāo) 6.5.案例十：頁面的上拉刷新加載更多內(nèi)容 |
|
自定義組件與插件 7.1.聲明自定義組件 7.2.編寫組件模版 7.3.自定義組件的構(gòu)造器 7.4.組件的引用和配置 7.5.組件在其他頁面中的調(diào)用 7.6.第三方插件的調(diào)用方式 7.7.常用第三方插件的推薦 |
|
注意事項(xiàng) 8.1.網(wǎng)絡(luò)請求異常的解決方案 8.2.圖片元素加載時的無初始化 8.3.事件冒泡現(xiàn)象的解決方案 8.4.Scrollview組件滾動時注意事項(xiàng) 8.5.wxml模板不生效的原因 8.6.video標(biāo)簽的適配問題 |
|
界面UI與設(shè)計(jì)方案 9.1.小程序界面設(shè)計(jì)標(biāo)準(zhǔn)和要求 9.2.WeUI 前端框架 9.3.Sketch 源文件 9.4.圖標(biāo)與布局 9.5.菜單與面板 |
|
案例實(shí)戰(zhàn)——動畫展示 10.1.項(xiàng)目功能需求分析 10.2.項(xiàng)目功能界面效果展示 10.3.調(diào)用API接口更新狀態(tài) 10.4.以動畫方式彈出禮品 |
|
案例實(shí)戰(zhàn)——地理查詢 11.1.頁面功能需求分析 11.2.業(yè)務(wù)邏輯分析 11.3.獲取經(jīng)緯度并在地圖中繪點(diǎn) 11.4.根據(jù)繪點(diǎn)調(diào)用API返回商家信息 11.5.將商家繪制在地圖上 |
|
小程序云端開發(fā) 12.1.云開發(fā)介紹 12.2.構(gòu)建數(shù)據(jù)庫 12.3.云函數(shù) 12.4.云開發(fā)控制臺 |
|
數(shù)據(jù)集合操作 13.1.創(chuàng)建第一個集合 13.2.插入數(shù)據(jù) 13.3.讀取數(shù)據(jù) 13.4.更新和刪除數(shù)據(jù) |
近期公開課推薦
