微信小程序?qū)W習筆記(一)-- 了解微信小程序

一癣猾、什么是小程序(了解)

小程序是一種不需要下載安裝即可使用的應用余爆,它實現(xiàn)了應用“觸手可及”的夢想蛾方,用戶掃一掃或者搜一下即可打開應用。也體現(xiàn)了“用完即走”的理念拓春,用戶不用關心是否安裝太多應用的問題硼莽。應用將無處不在煮纵,隨時可用,但又無需安裝卸載套像。

二凉夯、小程序的種類(了解)

微信小程序、支付寶小程序休傍、頭條小程序磨取、百度小程序忙厌、QQ小程序

三逢净、小程序的發(fā)展史(了解)

image

四爹土、小程序的優(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: 光標回退

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末爆袍,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子作郭,更是在濱河造成了極大的恐慌陨囊,老刑警劉巖,帶你破解...
    沈念sama閱讀 217,657評論 6 505
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件夹攒,死亡現(xiàn)場離奇詭異蜘醋,居然都是意外死亡,警方通過查閱死者的電腦和手機咏尝,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,889評論 3 394
  • 文/潘曉璐 我一進店門压语,熙熙樓的掌柜王于貴愁眉苦臉地迎上來啸罢,“玉大人,你說我怎么就攤上這事胎食∪挪牛” “怎么了?”我有些...
    開封第一講書人閱讀 164,057評論 0 354
  • 文/不壞的土叔 我叫張陵斥季,是天一觀的道長训桶。 經(jīng)常有香客問我,道長酣倾,這世上最難降的妖魔是什么舵揭? 我笑而不...
    開封第一講書人閱讀 58,509評論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮躁锡,結(jié)果婚禮上午绳,老公的妹妹穿的比我還像新娘。我一直安慰自己映之,他們只是感情好拦焚,可當我...
    茶點故事閱讀 67,562評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著杠输,像睡著了一般赎败。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上蠢甲,一...
    開封第一講書人閱讀 51,443評論 1 302
  • 那天僵刮,我揣著相機與錄音,去河邊找鬼鹦牛。 笑死搞糕,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的曼追。 我是一名探鬼主播窍仰,決...
    沈念sama閱讀 40,251評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼礼殊!你這毒婦竟也來了驹吮?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,129評論 0 276
  • 序言:老撾萬榮一對情侶失蹤晶伦,失蹤者是張志新(化名)和其女友劉穎碟狞,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體坝辫,經(jīng)...
    沈念sama閱讀 45,561評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡篷就,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,779評論 3 335
  • 正文 我和宋清朗相戀三年射亏,在試婚紗的時候發(fā)現(xiàn)自己被綠了近忙。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片竭业。...
    茶點故事閱讀 39,902評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖及舍,靈堂內(nèi)的尸體忽然破棺而出未辆,到底是詐尸還是另有隱情,我是刑警寧澤锯玛,帶...
    沈念sama閱讀 35,621評論 5 345
  • 正文 年R本政府宣布咐柜,位于F島的核電站,受9級特大地震影響攘残,放射性物質(zhì)發(fā)生泄漏拙友。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,220評論 3 328
  • 文/蒙蒙 一歼郭、第九天 我趴在偏房一處隱蔽的房頂上張望遗契。 院中可真熱鬧,春花似錦病曾、人聲如沸牍蜂。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,838評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽鲫竞。三九已至,卻和暖如春逼蒙,著一層夾襖步出監(jiān)牢的瞬間从绘,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,971評論 1 269
  • 我被黑心中介騙來泰國打工其做, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留顶考,地道東北人。 一個月前我還...
    沈念sama閱讀 48,025評論 2 370
  • 正文 我出身青樓妖泄,卻偏偏與公主長得像驹沿,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子蹈胡,可洞房花燭夜當晚...
    茶點故事閱讀 44,843評論 2 354