一癣猾、什么是小程序(了解)
小程序是一種不需要下載安裝即可使用的應用余爆,它實現(xiàn)了應用“觸手可及”的夢想蛾方,用戶掃一掃或者搜一下即可打開應用。也體現(xiàn)了“用完即走”的理念拓春,用戶不用關心是否安裝太多應用的問題硼莽。應用將無處不在煮纵,隨時可用,但又無需安裝卸載套像。
二凉夯、小程序的種類(了解)
微信小程序、支付寶小程序休傍、頭條小程序磨取、百度小程序忙厌、QQ小程序
三逢净、小程序的發(fā)展史(了解)
四爹土、小程序的優(yōu)勢(了解)
對于開發(fā)者而言胀茵,小程序開發(fā)門檻相對較低,難度不及APP脱拼,能夠滿足簡單的基礎應用拒炎,適合生活服務類線下商鋪以及非剛需低頻應用的轉(zhuǎn)換击你。 對于用戶來說,能夠節(jié)約使用時間成本和手機內(nèi)存空間朝巫;對于開發(fā)者來說也能節(jié)約開發(fā)和推廣成本石景。
五揪荣、小程序展示(熟悉)
微信小程序 - 微信首頁下拉
支付寶小程序 - 朋友 - 小程序
QQ小程序 - QQ首頁下拉
頭條小程序 - 今日頭條搜索 - 小程序入口 點擊左上角圖標
百度小程序 - 百度APP下拉
六、微信小程序介紹(了解)
微信小程序提供了一個簡單挨决、高效的應用開發(fā)框架和豐富的組件及API脖祈,幫助開發(fā)者在微信中開發(fā)具有原生 APP 體驗的服務盖高。
七掏秩、準備工作(掌握)
1或舞、申請賬號
進入小程序注冊頁 根據(jù)指引填寫信息和提交相應的資料,申請自己的微信小程序帳號
登陸小程序后臺蒙幻,在“設置” - “開發(fā)設置”中查看自己的APPID
小程序的 AppID 相當于小程序平臺的一個身份證映凳,后續(xù)你會在很多地方要用到 AppID
2、安裝開發(fā)者工具
開發(fā)者工具下載頁面 下載微信開發(fā)者工具
根據(jù)自己的硬件環(huán)境選擇穩(wěn)定版本下載即可
八邮破、體驗小程序
打開開發(fā)者工具诈豌,使用自己的微信掃碼登錄即可
開發(fā)者工具登錄之后可以看到有兩個大的分類,分別是【小程序項目】和【公眾號項目】
【小程序項目】包括“小程序”抒和、“小游戲”矫渔、“代碼片段”,主要用來開發(fā)、調(diào)試蚁袭、發(fā)布微信小程序以及微信小游戲删性;
【公眾號項目】主要用來開發(fā)和調(diào)試微信公眾號它掂、訂閱號以及服務號等的網(wǎng)頁應用发乔。我在這里主要帶大家學習的是【小程序項目】中的小程序译仗。
點擊“+”號
頁面中我們需要添加的選項有【項目名稱】笛辟、【目錄】围来、【AppID】才漆、【開發(fā)模式】、【后端服務】、【語言】,
重中之重的是AppID這個選項购城,在第七步中我們已經(jīng)知道如何獲取自己的AppID侮攀,只需要正確填入即可。
【項目名稱】填寫為lesson_01
【目錄】即為自己的項目地址
【AppID】正確填寫即可
【開發(fā)模式】選擇“小程序”即可
【后端服務】選擇“不使用云服務”
【語言】選擇“javascript”。
點擊【新建】,將成功創(chuàng)建一個微信官方所提供的示例項目
點擊工具上的編譯按鈕,可以在工具的左側(cè)模擬器界面看到這個小程序的表現(xiàn),也可以點擊預覽按鈕哨啃,通過微信的掃一掃在手機上體驗你的第一個小程序祝峻。
九轴踱、開發(fā)者工具界面功能介紹(掌握)
創(chuàng)建項目成功后壶唤,在主界面頂部有13個選項卡迎吵,分別為【模擬器】、【編輯器】针贬、【調(diào)試器】桦他、【云開發(fā)】坪郭、【小程序模式】意推、【編譯】砸喻、【真機調(diào)試】癣漆、【切后臺】维咸、【清緩存】、【上傳】惠爽、【版本管理】癌蓖、【社區(qū)】、【詳情】婚肆。
1租副、 模擬器選項卡
點擊【模擬器】選項卡,可以打開和關閉模擬器较性,在模擬器的頂部有一個狀態(tài)欄
“iPhone5”這一欄可以讓開發(fā)者選擇模擬器的機型附井,可以測試代碼在各機型上的運行情況讨越;“100%”這一欄可以調(diào)整模擬器的大小,讓開發(fā)者可以清楚的看到效果的全貌永毅;“WiFi”這一欄可以讓我們選擇不同的網(wǎng)絡環(huán)境測試代碼把跨;“模擬操作”這一欄默認為Home選項和返回選項;再往右為模擬器的聲音的開關沼死;中間的點擊可以把模擬器單獨作為一個頁面顯示着逐;最右側(cè)的點擊可以調(diào)整模擬器的位置,默認在左意蛀,點擊可以調(diào)整到右側(cè)耸别,
2、編輯器選項卡
點擊【編輯器】選項卡县钥,可以打開和關閉編輯器
3秀姐、調(diào)試器選項卡
點擊【調(diào)試器】選項卡,可以打開和關閉調(diào)試器
4若贮、云開發(fā)選項卡
點擊【云開發(fā)】選項卡省有,可以開通是“小程序·云開發(fā)”
云開發(fā)為開發(fā)者提供完整的原生云端支持和微信服務支持,弱化后端和運維概念谴麦,無需搭建服務器蠢沿,使用平臺提供的 API 進行核心業(yè)務開發(fā),即可實現(xiàn)快速上線和迭代匾效,同時這一能力舷蟀,同開發(fā)者已經(jīng)使用的云服務相互兼容,并不互斥面哼。
5野宜、小程序模式選項卡
點擊【小程序】選項卡,可以選擇插件模式
6魔策、編譯選項卡
點擊【編譯】選項卡匈子,指定編輯哪一個頁面,小程序默認編輯的是app.json文件中“pages”選項中的第一個頁面代乃,使用該功能可以提高開發(fā)的效率。
點擊【預覽】可以使用手機微信掃碼進行真機預覽效果仿粹。
7搁吓、真機調(diào)試選項卡
點擊【真機調(diào)試】選項卡,可以在手機上微信掃碼直接查看效果
8吭历、切后臺選項卡
點擊【切后臺】選項卡堕仔,可以在模擬器中模擬應用的前后臺切換操作。
9晌区、清緩存選項卡
點擊【清緩存】選項卡摩骨,會出現(xiàn)【清除數(shù)據(jù)緩存】通贞、【清除文件緩存】、【清除授權(quán)數(shù)據(jù)】恼五、【清除網(wǎng)絡緩存】昌罩、【清除登錄狀態(tài)】、【全部清除】幾個選項
10灾馒、上傳選項卡
點擊【上傳】選項卡茎用,會把當前代碼上傳到微信服務器,并且自動編譯睬罗,在微信小程序的后臺生成一個體驗的二維碼轨功,開發(fā)者可以測試代碼。
11容达、版本管理選項卡
點擊【版本管理】選項卡古涧,可以使用微信提供的Git工具管理項目中的代碼。
12花盐、社區(qū)選項卡
點擊【社區(qū)】選項卡羡滑,可以使用默認瀏覽器打開“微信開放社區(qū)”。
13卒暂、詳情選項卡
點擊【詳情】選項卡
【詳情】選項卡主要有3個大的功能:項目的設置啄栓、域名的信息、騰訊云狀態(tài)也祠,在后續(xù)課程中會有介紹
十昙楚、微信開發(fā)者工具常用快捷鍵(熟悉)
俗話說的好,工欲善其事必先利其器诈嘿,我給大家?guī)砹烁@熬桑⑿判〕绦蜷_發(fā)者工具的快捷鍵,具體如下:
1奖亚、界面開關
Ctrl + shift + T: 工具欄
Ctrl + shift + D: 模擬器
Ctrl + shift + E: 編輯器
Ctrl + shift + T: 目錄樹
Ctrl + shift + I: 調(diào)試器
2淳梦、工具
Ctrl +B: 編譯
Ctrl +R: 刷新
Ctrl + shift + P: 預覽(自動預覽)
Ctrl + shift + U: 上傳
3、編輯
Ctrl + shift + F: 格式化代碼
Ctrl + P: 跳轉(zhuǎn)文件
Ctrl + E: 最近文件
Ctrl + [: 代碼行向左縮進
Ctrl + ]: 代碼行向右縮進
Ctrl +shift + [: 折疊代碼塊
Ctrl + shift + ]: 打開代碼塊
Alt + Up: 上移動一行
Alt + Down: 下移動一行
Shift + Alt + Up: 向上復制一行
Shift + Alt + Down:向下復制一行
Ctrl + shift + enter: 在當前行上方插入一行
Ctrl + shift + F: 全局搜索
4昔字、光標相關
Ctrl + End:移動到文件結(jié)尾
Ctrl + Home:移動到文件開頭
Ctrl + I:選中當前行
Shift + End: 選擇從光標處到行尾
Shift + Home: 選擇從行首到光標處
Ctrl + shift + L: 選中所有匹配
Ctrl +D: 選中最近的匹配
Ctrl + U: 光標回退