在當(dāng)今移動(dòng)互聯(lián)網(wǎng)大潮中,微信應(yīng)用憑借其龐大的用戶(hù)基數(shù)和極強(qiáng)的用戶(hù)黏性牢牢地占據(jù)著移動(dòng)App應(yīng)用的頭把交椅之位,據(jù)相關(guān)統(tǒng)計(jì),微信月活躍用戶(hù)已達(dá)10億之多,且占據(jù)著中國(guó)用戶(hù)30%以上的應(yīng)用時(shí)間,微信已經(jīng)是當(dāng)之無(wú)愧的超級(jí)App。隨之誕生的微信小程序商城,背靠微信這棵大樹(shù),將成為下一個(gè)備受矚目的焦點(diǎn),本書(shū)將帶你一站式開(kāi)發(fā)微信小程序商城,打造自己的商城。
在當(dāng)今移動(dòng)互聯(lián)網(wǎng)大潮中,微信應(yīng)用憑借其龐大的用戶(hù)基數(shù)和極強(qiáng)的用戶(hù)黏性牢牢地占據(jù)著移動(dòng)App應(yīng)用的頭把交椅之位,據(jù)相關(guān)統(tǒng)計(jì),微信月活躍用戶(hù)已達(dá)10億之多,且占據(jù)著中國(guó)用戶(hù)30%以上的應(yīng)用時(shí)間,微信已經(jīng)是當(dāng)之無(wú)愧的超級(jí)App。大樹(shù)底下好乘涼,含著金鑰匙誕生的微信小程序,背靠微信這棵大樹(shù),從微信官方首次透露之日起,就受到了廣大用戶(hù)和開(kāi)發(fā)者的重點(diǎn)關(guān)注。
小程序自2017年1月9日正式上線以來(lái),經(jīng)過(guò)將近兩年的發(fā)展,市面上已經(jīng)涌現(xiàn)出了諸多優(yōu)秀的小程序應(yīng)用,如:跳一跳、拼多多、摩拜單車(chē)和肯德基 等。而在這些小程序應(yīng)用中,最具商業(yè)價(jià)值的則是電商類(lèi)的小程序應(yīng)用,借助微信的社交引流再加上小程序無(wú)需安裝、用完即走的技術(shù)賦能,社交電商小程序開(kāi)辟出了移動(dòng)互聯(lián)網(wǎng)電商市場(chǎng)的新局面。正是基于電商小程序的潛在商業(yè)價(jià)值和龐大的市場(chǎng)需求,我選擇微信小程序商城這個(gè)實(shí)戰(zhàn)項(xiàng)目案例為各位讀者詳細(xì)講解如何打造一款小而美的電商小程序應(yīng)用以饕讀者。
本書(shū)的編寫(xiě)思路力求符合程序員自學(xué)的最佳路徑,先進(jìn)行小程序技術(shù)知識(shí)框架基礎(chǔ)以及核心的由淺入深、由點(diǎn)及面的全面梳理和認(rèn)知,再結(jié)合具體的小程序商城實(shí)戰(zhàn)項(xiàng)目案例來(lái)綜合實(shí)踐前面所學(xué)的技術(shù)知識(shí)點(diǎn)。我沒(méi)有選擇太過(guò)簡(jiǎn)單的小程序項(xiàng)目案例,而是選擇了小程序商城這個(gè)經(jīng)典實(shí)用和綜合性強(qiáng),且極具商業(yè)價(jià)值的實(shí)戰(zhàn)項(xiàng)目來(lái)進(jìn)行講解,這樣能更好地讓自學(xué)者對(duì)整個(gè)小程序項(xiàng)目有一個(gè)更高維度的認(rèn)知和理解,同時(shí)該實(shí)戰(zhàn)項(xiàng)目又可以很方便地用作實(shí)際的互聯(lián)網(wǎng)創(chuàng)業(yè)或商業(yè)項(xiàng)目來(lái)落地應(yīng)用,可謂一舉兩得,兼具學(xué)習(xí)用途和商業(yè)用途。
全書(shū)共分三大篇,第一篇為小程序開(kāi)發(fā)基礎(chǔ)篇,主要講解了小程序概念、市場(chǎng)分析、入門(mén)DEMO體驗(yàn)和框架基礎(chǔ)等,讀者需要重點(diǎn)掌握的是小程序框架基礎(chǔ)知識(shí)部分;第二篇為小程序開(kāi)發(fā)高級(jí)篇,主要講解了小程序框架組件、API和服務(wù)端開(kāi)發(fā)思路,建議讀者快速閱讀框架組件和API部分的知識(shí),形成大致印象即可,知道如何查閱這些技術(shù)要點(diǎn),而對(duì)于小程序服務(wù)端開(kāi)發(fā)則重點(diǎn)在于理解小程序前后端如何通過(guò)接口進(jìn)行數(shù)據(jù)交互的開(kāi)發(fā)模式;第三篇為小程序開(kāi)發(fā)實(shí)戰(zhàn)篇,我按照項(xiàng)目需求分析、項(xiàng)目數(shù)據(jù)庫(kù)設(shè)計(jì)、小程序前端程序開(kāi)發(fā)和后端程序開(kāi)發(fā)詳細(xì)講解了微信小程序商城應(yīng)用的完整實(shí)戰(zhàn)開(kāi)發(fā)過(guò)程,并羅列了具體代碼示例,建議讀者首先對(duì)項(xiàng)目需求和數(shù)據(jù)庫(kù)設(shè)計(jì)形成初步理解之后,再對(duì)小程序前端程序開(kāi)發(fā)部分進(jìn)行具體的學(xué)習(xí),小程序前端這塊是該項(xiàng)目的重中之重,也是對(duì)前面兩篇技術(shù)知識(shí)點(diǎn)的綜合運(yùn)用和實(shí)踐。至于小程序后端程序開(kāi)發(fā)部分,如果讀者是專(zhuān)注做前端開(kāi)發(fā)的,建議可以大致了解下后端開(kāi)發(fā)的技術(shù)知識(shí),方便以后進(jìn)行前后端協(xié)作開(kāi)發(fā)時(shí)的快速溝通和理解開(kāi)發(fā)需求。如果讀者是全棧開(kāi)發(fā)者或是項(xiàng)目經(jīng)理,建議重點(diǎn)閱讀后端開(kāi)發(fā)這一部分的內(nèi)容,學(xué)習(xí)和參考均可。
此外,我還有一個(gè)多年學(xué)習(xí)技術(shù)的經(jīng)驗(yàn)技術(shù)學(xué)習(xí)九字真訣,也希望在此分享給各位:學(xué)習(xí)技術(shù),重點(diǎn)掌握該技術(shù)的三點(diǎn),其一為是什么,知道該技術(shù)的基本概念,最好結(jié)合一些具體的生活化的實(shí)例來(lái)理解抽象的技術(shù)知識(shí);其二為為什么,理解該技術(shù)的核心原理,是否對(duì)技術(shù)有深度的認(rèn)知重點(diǎn)在于是否對(duì)該技術(shù)的核心原理理解透徹;其三為怎么用,掌握并實(shí)際運(yùn)用該技術(shù)是學(xué)習(xí)技術(shù)的最終目的和最佳實(shí)踐方式,當(dāng)你知道了該技術(shù)怎么用、用在什么業(yè)務(wù)場(chǎng)景時(shí),想必你對(duì)技術(shù)的掌握就已經(jīng)達(dá)到了一定的高度。
本書(shū)讀者對(duì)象包括:前端開(kāi)發(fā)工程師、軟件項(xiàng)目經(jīng)理、微信應(yīng)用開(kāi)發(fā)者、全棧開(kāi)發(fā)愛(ài)好者和計(jì)算機(jī)軟件相關(guān)專(zhuān)業(yè)的學(xué)生。
在寫(xiě)作本書(shū)的過(guò)程中,得到了眾多好友和同行的鼓勵(lì),在此由衷感謝;同時(shí)也感謝北京航空航天大學(xué)出版社的編輯的全力支持;最后感謝家人的理解和支持,讓我能全身心地投入到這本書(shū)籍的創(chuàng)造中。謹(jǐn)以此書(shū),獻(xiàn)給自己的寶貝女兒唐悠然,希望她未來(lái)能健康快樂(lè)、悠然自得。
請(qǐng)到北京航空航天大學(xué)出版社官網(wǎng)的下載專(zhuān)區(qū)(隨書(shū)資料)下載本書(shū)源碼。
唐磊,武漢信真科技創(chuàng)始人,先后在東軟集團(tuán)、神州數(shù)碼和北京尋未科技任職,承擔(dān)過(guò)銀行業(yè)務(wù)系統(tǒng)、訂單管理系統(tǒng)以及移動(dòng)互聯(lián)網(wǎng)醫(yī)療App等大型項(xiàng)目研發(fā)工作,擁有超過(guò)8年的一線編程實(shí)戰(zhàn)和架構(gòu)經(jīng)驗(yàn)。
小程序開(kāi)發(fā)基礎(chǔ)篇第1章初識(shí)小程序2
1.1小程序概述2
1.2什么是小程序2
1.3小程序的優(yōu)劣勢(shì)4
1.4小程序市場(chǎng)前景4
1.5小程序商業(yè)價(jià)值分析5
第2章小程序入門(mén)10
2.1開(kāi)發(fā)前的準(zhǔn)備10
2.1.1注冊(cè)微信公眾平臺(tái)成為開(kāi)發(fā)者11
2.1.2開(kāi)發(fā)工具下載與安裝17
2.2體驗(yàn)第一個(gè)小程序20
2.2.1開(kāi)發(fā)模式選擇20
2.2.2創(chuàng)建Hello World小程序21
2.2.3如何獲取小程序AppID23
2.3微信開(kāi)發(fā)者工具使用介紹24
2.3.1開(kāi)發(fā)工具界面圖解24
2.3.2小程序調(diào)試工具27
2.3.3如何預(yù)覽小程序31
2.3.4上傳和發(fā)布小程序32
第3章小程序框架基礎(chǔ)35
3.1理解小程序開(kāi)發(fā)框架35
3.1.1小程序框架原理35
3.1.2小程序目錄結(jié)構(gòu)和文件構(gòu)成37
3.1.3小程序配置38
3.1.4小程序運(yùn)行和加載機(jī)制41
3.1.5小程序生命周期和線程架構(gòu)42
3.2WXML:小程序版HTML43
3.2.1標(biāo)簽與屬性43
3.2.2數(shù)據(jù)綁定45
3.2.3條件渲染50
3.2.4列表渲染50
3.2.5模板、引用和事件53
3.2.6WXML與HTML的區(qū)別58
3.3WXSS:小程序版CSS58
3.3.1選擇器與優(yōu)先級(jí)59
3.3.2盒子模型60
3.3.3內(nèi)聯(lián)樣式61
3.3.4尺寸單位與樣式導(dǎo)入62
3.3.5WXSS與CSS的區(qū)別63
3.4WXS:小程序版JavaScript63
3.4.1小程序JavaScript63
3.4.2同步和異步64
3.4.3模塊化65
微信小程序商城開(kāi)發(fā)實(shí)戰(zhàn)小程序開(kāi)發(fā)高級(jí)篇
第4章小程序框架組件69
4.1視圖容器組件69
4.1.1視圖容器69
4.1.2可滾動(dòng)視圖區(qū)域71
4.1.3滑塊視圖容器74
4.1.4可移動(dòng)視圖容器77
4.1.5覆蓋在原生組件上的文本視圖80
4.1.6覆蓋在原生組件上的圖片視圖80
4.2基礎(chǔ)內(nèi)容組件83
4.2.1圖標(biāo)83
4.2.2文本85
4.2.3富文本87
4.2.4進(jìn)度條88
4.3表單組件89
4.3.1按鈕89
4.3.2多項(xiàng)選擇器93
4.3.3表單94
4.3.4輸入框96
4.3.5標(biāo)簽100
4.3.6滾動(dòng)選擇器104
4.3.7單項(xiàng)選擇器116
4.3.8滑動(dòng)選擇器118
4.3.9開(kāi)關(guān)選擇器120
4.3.10多行輸入框121
4.4導(dǎo)航組件123
4.4.1頁(yè)面導(dǎo)航123
4.4.2功能頁(yè)導(dǎo)航125
4.5媒體組件127
4.5.1音頻127
4.5.2圖片129
4.5.3視頻135
4.5.4相機(jī)139
4.5.5實(shí)時(shí)音視頻播放140
4.5.6實(shí)時(shí)音視頻錄制143
4.6地圖組件145
4.7畫(huà)布組件148
4.8開(kāi)放能力組件151
4.8.1開(kāi)放數(shù)據(jù)151
4.8.2網(wǎng)頁(yè)容器151
4.8.3廣告152
4.8.4公眾號(hào)關(guān)注153
第5章小程序框架API154
5.1網(wǎng)絡(luò)API155
5.1.1發(fā)起請(qǐng)求155
5.1.2上傳下載156
5.1.3長(zhǎng)連接WebSocket158
5.2媒體API160
5.2.1音視頻160
5.2.2圖片166
5.2.3錄音170
5.3文件API172
5.4數(shù)據(jù)緩存API176
5.5位置API180
5.6設(shè)備API182
5.6.1加速計(jì)、藍(lán)牙、羅盤(pán)182
5.6.2電量、性能、屏幕184
5.6.3聯(lián)系人、電話、掃碼186
5.7界面API187
5.7.1動(dòng)畫(huà)187
5.7.2交互190
5.7.3導(dǎo)航欄193
5.7.4置頂、滾動(dòng)、下拉刷新194
5.8開(kāi)放接口API196
5.8.1授權(quán)、登錄、用戶(hù)信息196
5.8.2微信支付201
5.8.3模板消息、統(tǒng)一服務(wù)消息203
5.9其他API207
5.9.1基礎(chǔ)207
5.9.2轉(zhuǎn)發(fā)207
5.9.3系統(tǒng)信息209
第6章小程序服務(wù)端開(kāi)發(fā)思路211
6.1服務(wù)端開(kāi)發(fā)語(yǔ)言和框架選擇建議211
6.1.1開(kāi)發(fā)語(yǔ)言和框架的選擇211
6.1.2新選擇小程序·云開(kāi)發(fā)213
6.2數(shù)據(jù)庫(kù)設(shè)計(jì)思路214
6.2.1小程序項(xiàng)目數(shù)據(jù)庫(kù)選型214
6.2.2數(shù)據(jù)庫(kù)設(shè)計(jì)方法和建議216
6.3服務(wù)端接口開(kāi)發(fā)思路217
6.3.1RESTful
API介紹217
6.3.2后端API開(kāi)發(fā)技巧和建議218
6.4服務(wù)端后臺(tái)管理系統(tǒng)開(kāi)發(fā)思路219
6.4.1后臺(tái)管理系統(tǒng)頁(yè)面設(shè)計(jì)建議219
6.4.2后臺(tái)管理系統(tǒng)功能開(kāi)發(fā)注意要點(diǎn)220
小程序開(kāi)發(fā)實(shí)戰(zhàn)篇第7章小程序商城需求分析和數(shù)據(jù)庫(kù)設(shè)計(jì)223
7.1項(xiàng)目需求分析223
7.1.1項(xiàng)目背景概述223
7.1.2業(yè)務(wù)需求分析223
7.1.3產(chǎn)品需求分析225
7.1.4產(chǎn)品結(jié)構(gòu)圖228
7.2項(xiàng)目數(shù)據(jù)庫(kù)設(shè)計(jì)229
7.2.1數(shù)據(jù)庫(kù)設(shè)計(jì)概述229
7.2.2數(shù)據(jù)庫(kù)表結(jié)構(gòu)設(shè)計(jì)230
第8章小程序商城前端程序開(kāi)發(fā)237
8.1小程序商城前端頁(yè)面開(kāi)發(fā)概述237
8.2項(xiàng)目全局基礎(chǔ)模塊代碼清單237
8.2.1全局入口 app.js237
8.2.2全局配置app.json241
8.2.3全局樣式 app.wxss243
8.2.4項(xiàng)目配置 project.config.json244
8.3首頁(yè)代碼清單245
8.3.1wxml模板代碼246
8.3.2wxss樣式代碼247
8.3.3js邏輯代碼257
8.3.4json配置代碼261
8.4商品分類(lèi)頁(yè)代碼清單261
8.4.1wxml代碼262
8.4.2wxss樣式代碼263
8.4.3js邏輯代碼267
8.4.4json配置代碼269
8.5商品詳情頁(yè)代碼清單270
8.5.1wxml模板代碼270
8.5.2wxss樣式代碼272
8.5.3js邏輯代碼290
8.5.4json配置代碼300
8.6購(gòu)物車(chē)頁(yè)代碼清單300
8.6.1wxml模板代碼300
8.6.2wxss樣式代碼302
8.6.3js邏輯代碼311
8.6.4json配置代碼317
8.7訂單確認(rèn)頁(yè)代碼清單317
8.7.1wxml模板代碼318
8.7.2wxss樣式代碼320
8.7.3js邏輯代碼328
8.7.4json配置代碼333
8.8訂單詳情頁(yè)代碼清單333
8.8.1wxml模板代碼333
8.8.2wxss樣式代碼335
8.8.3js邏輯代碼341
8.8.4json配置代碼343
8.9地址管理頁(yè)代碼清單343
8.9.1wxml模板代碼343
8.9.2wxss樣式代碼344
8.9.3js邏輯代碼346
8.9.4json配置代碼350
8.10保存地址頁(yè)代碼清單350
8.10.1wxml模板代碼351
8.10.2wxss樣式代碼352
8.10.3js邏輯代碼353
8.10.4json配置代碼358
8.11優(yōu)惠券頁(yè)代碼清單358
8.11.1wxml模板代碼359
8.11.2wxss樣式代碼359
8.11.3js邏輯代碼363
8.11.4json配置代碼365
8.12個(gè)人中心頁(yè)代碼清單365
8.12.1wxml模板代碼366
8.12.2wxss樣式代碼367
8.12.3js邏輯代碼371
8.12.4json配置代碼374
8.13我的訂單列表頁(yè)代碼清單374
8.13.1wxml模板代碼375
8.13.2wxss樣式代碼376
8.13.3js邏輯代碼379
8.13.4json配置代碼387
8.14搜索頁(yè)代碼清單387
8.14.1wxml模板代碼388
8.14.2wxss樣式代碼389
8.14.3js邏輯代碼391
8.14.4json配置代碼394
第9章小程序商城后端程序開(kāi)發(fā)395
9.1小程序商城后端接口開(kāi)發(fā)概述395
9.2小程序后端接口開(kāi)發(fā)395
9.2.1接口公共父類(lèi)代碼清單395
9.2.2登錄接口代碼清單399
9.2.3首頁(yè)接口代碼清單405
9.2.4商品分類(lèi)接口代碼清單407
9.2.5商品接口代碼清單409
9.2.6購(gòu)物車(chē)接口代碼清單417
9.2.7訂單接口代碼清單425
9.2.8下單結(jié)算接口代碼清單434
9.2.9微信支付接口代碼清單449
9.2.10地址接口代碼清單454
9.2.11優(yōu)惠券接口代碼清單460
9.2.12用戶(hù)接口代碼清單463
9.3項(xiàng)目小結(jié)474
參考文獻(xiàn)475