uniapp是一個(gè)使用Vue.js開發(fā)所有前端應(yīng)用的框架,開發(fā)者只需編寫一套代碼,就可發(fā)布到iOS、Android、Web(響應(yīng)式)及各種小程序、快應(yīng)用等多個(gè)平臺(tái)。
由于uniapp借助了Vue.js和小程序的設(shè)計(jì)和生態(tài),所以對(duì)于初學(xué)者而言,通過對(duì)比理解和學(xué)習(xí)將是最快的入門方式,所以本書除了介紹uniapp中常用的組件和API,還涉及HTML、CSS、Vue.js,以及小程序中的重要知識(shí)點(diǎn),以此來幫助初學(xué)者快速了解uniapp技術(shù)的來龍去脈,并通過豐富的對(duì)比案例為讀者介紹uniapp的技術(shù)細(xì)節(jié)及實(shí)現(xiàn)原理,還能夠幫助初學(xué)者快速地建立uniapp的知識(shí)體系。
不僅如此,本書還以u(píng)niapp項(xiàng)目作為核心,以實(shí)際應(yīng)用為目標(biāo),并以在項(xiàng)目研發(fā)過程中遇到問題,解決問題的方式讓讀者逐步學(xué)習(xí)uniapp的相關(guān)知識(shí)點(diǎn),除了技術(shù)方面,書中內(nèi)容還穿插一些筆者在實(shí)際構(gòu)建軟件及解決問題過程中的思考及感悟。本書摒棄了深?yuàn)W難懂的復(fù)雜理論和拗口的術(shù)語,盡量以通俗易懂的語言讓讀者學(xué)習(xí)并掌握uniapp這門技術(shù),并在各個(gè)章節(jié)配以相關(guān)的視頻講解和代碼案例,希望每位讀者能夠隨著作者的節(jié)奏,沉浸式地踏入這趟學(xué)習(xí)之旅,力求讓初學(xué)者能通過這套課程掌握構(gòu)建uniapp項(xiàng)目的基本思路與方法,并通過不斷地練習(xí)與思考舉一反三,最終能夠使用uniapp構(gòu)建出屬于自己的軟件。
本書主要內(nèi)容
本書分為預(yù)熱篇、客戶端篇、服務(wù)器端篇、項(xiàng)目上線篇共4篇,配有大量的案例代碼及圖解說明。全書的主要內(nèi)容如下:
預(yù)熱篇(第1~3章),通過與Vue.js、小程序、HTML5等技術(shù)對(duì)比并通過HBuilder X創(chuàng)建、運(yùn)行、調(diào)試第1個(gè)模板項(xiàng)目初步講解uniapp,感受其開發(fā)效率及跨平臺(tái)的能力。該篇能夠幫助開發(fā)者快速建立知識(shí)體系及熟悉uniapp對(duì)應(yīng)的開發(fā)工具。
客戶端篇(第4~6章),從原型設(shè)計(jì)開始,以頁面設(shè)計(jì)作為起點(diǎn),介紹HTML、CSS相關(guān)的知識(shí)點(diǎn)及應(yīng)用,并結(jié)合uniapp相關(guān)的組件及API完成客戶端頁面的開發(fā),為開發(fā)者介紹在uniapp項(xiàng)目開發(fā)中所需要的基本知識(shí)點(diǎn)。
服務(wù)器端篇(第7~10章),通過自建服務(wù)、云服務(wù)和開放服務(wù)這3種不同的服務(wù)調(diào)用及構(gòu)建方式結(jié)合uniapp相關(guān)的組件及API完成客戶端與服務(wù)器端之間的通信及調(diào)試工作。作為服務(wù)能力的擴(kuò)充,最后會(huì)簡單介紹與爬蟲相關(guān)的知識(shí)與應(yīng)用。通過本篇開發(fā)者將會(huì)掌握uniapp應(yīng)用與其他應(yīng)用間常用的通信方法。
項(xiàng)目上線篇(第11章和第12章),主要介紹云服務(wù)的相關(guān)概念,以及部署到云服務(wù)器的相關(guān)操作。通過本章開發(fā)者將會(huì)掌握服務(wù)器端部署的操作、Bash腳本的編寫及HTTP升級(jí)為HTTPS的操作和相關(guān)知識(shí)點(diǎn)。在掌握了這些知識(shí)之后相信各位讀者一定會(huì)對(duì)使用uniapp框架開發(fā)應(yīng)用軟件有更加深刻的理解。
資源下載提示
素材(源碼)等資源: 掃描目錄上方的二維碼下載。
視頻等資源: 掃描封底的文泉云盤防盜碼,再掃描書中相應(yīng)章節(jié)的二維碼,可以在線學(xué)習(xí)。
致謝
由衷地感謝清華大學(xué)出版社的編輯為本書提供的寶貴建議,并為圖書出版付出的辛勤勞動(dòng)。另外還要感謝筆者的家人尤其是妻子,在得知筆者要進(jìn)行寫作之后主動(dòng)承擔(dān)起了絕大部分家務(wù)并悉心照料剛出生不久的寶寶,使筆者能夠全身心地投入寫作之中。
由于筆者水平有限,而且uniapp技術(shù)發(fā)展日新月異,書中難免會(huì)有一些不完善的地方,請(qǐng)讀者見諒,并提出寶貴意見。
陳斯佳2024年2月
預(yù)熱篇
第1章初識(shí)uniapp(24min)
1.1互聯(lián)網(wǎng)的發(fā)展簡史
1.1.1互聯(lián)網(wǎng)的誕生
1.1.2互聯(lián)網(wǎng)發(fā)展四部曲
1.1.3狂飆下的移動(dòng)互聯(lián)網(wǎng)
1.2uniapp簡介
1.2.1小程序時(shí)代
1.2.2跨平臺(tái)框架進(jìn)化史
1.2.3跨平臺(tái)框架之爭
1.3本章小結(jié)
第2章創(chuàng)建uniapp(31min)
2.1案例項(xiàng)目簡介
2.1.1項(xiàng)目功能簡介
2.1.2項(xiàng)目知識(shí)點(diǎn)簡介
2.2uniapp項(xiàng)目創(chuàng)建
2.2.1HBuilder X
2.2.2第1個(gè)uniapp項(xiàng)目
2.2.3uniapp目錄結(jié)構(gòu)及全局文件
2.3uniapp項(xiàng)目解讀
2.3.1運(yùn)行項(xiàng)目
2.3.2index.vue文件解讀
2.3.3uniapp、HTML、Vue.js、小程序的區(qū)別與聯(lián)系
2.3.4Vue.js模板編譯
2.3.5vnode到真實(shí)DOM及DOMDIFF
2.4本章小結(jié)
第3章感受uniapp(18min)
3.1Web端運(yùn)行調(diào)試uniapp
3.1.1uniapp在Web端調(diào)試運(yùn)行
3.1.2uniapp在Web端同步斷點(diǎn)
3.1.3uniapp在Web端中Debug
3.2真機(jī)運(yùn)行調(diào)試uniapp
3.2.1運(yùn)行到Android基座
3.2.2使用Android模擬器運(yùn)行調(diào)試
3.2.3使用Android手機(jī)運(yùn)行調(diào)試
3.2.4uniapp在Android系統(tǒng)中Debug
3.3uniapp一鍵跨平臺(tái)發(fā)布到微信小程序
3.3.1配置AppID生成微信小程序項(xiàng)目
3.3.2項(xiàng)目導(dǎo)入并運(yùn)行到微信開發(fā)者工具
3.4微信開發(fā)者工具調(diào)試
3.4.1通過HBuilder X運(yùn)行到微信開發(fā)者工具
3.4.2微信開發(fā)者工具調(diào)試
3.5uniapp開發(fā)微信小程序與微信小程序原生開發(fā)對(duì)比
3.5.1功能實(shí)現(xiàn)對(duì)比
3.5.2性能體驗(yàn)對(duì)比
3.5.3社區(qū)生態(tài)對(duì)比
3.5.4開發(fā)體驗(yàn)對(duì)比
3.5.5擴(kuò)展性對(duì)比
3.6本章小結(jié)
客 戶 端 篇
第4章從零開始(18min)
4.1繪制藍(lán)圖
4.1.1Axure RP
4.1.2首頁繪制
4.2頁面布局與樣式綁定
4.2.1CSS布局概述
4.2.2Flex布局詳解
4.2.3uniapp動(dòng)態(tài)修改樣式
4.3How to be a master
4.4本章小結(jié)
第5章首頁開發(fā)(25min)
5.1使用HBuilder X繪制首頁
5.2uniapp中的數(shù)據(jù)綁定
5.2.1vbind指令
5.2.2vhtml指令
5.2.3vmodel指令
5.3在uniapp中使用函數(shù)
5.3.1函數(shù)的定義
5.3.2使用setInterval函數(shù)實(shí)現(xiàn)逐字輸出效果
5.3.3uniapp生命周期
5.4uniapp路由
5.4.1使用API進(jìn)行跳轉(zhuǎn)
5.4.2使用navigator組件進(jìn)行跳轉(zhuǎn)
5.5本章小結(jié)
第6章功能頁開發(fā)(24min)
6.1繪制功能頁面
6.2軟件復(fù)用技術(shù)
6.2.1使用函數(shù)庫
6.2.2使用繼承
6.2.3使用接口
6.2.4進(jìn)行模塊化開發(fā)
6.2.5使用開源框架
6.3uniapp中的復(fù)用技術(shù)
6.3.1easycom
6.3.2插槽
6.3.3組合式API
6.4uniapp事件
6.4.1事件監(jiān)聽及事件處理
6.4.2事件修飾符
6.4.3事件映射表
6.5uniapp交互反饋
6.6uniapp中的數(shù)據(jù)傳遞
6.7本章小結(jié)
服務(wù)器端篇
第7章服務(wù)器端建設(shè)(14min)
7.1軟件架構(gòu)演進(jìn)
7.1.1MVC架構(gòu)風(fēng)格
7.1.2Flux架構(gòu)風(fēng)格
7.1.3MVP架構(gòu)風(fēng)格
7.1.4MVVM架構(gòu)風(fēng)格
7.2服務(wù)器端環(huán)境工具準(zhǔn)備
7.2.1JDK環(huán)境配置
7.2.2IDEA
7.3創(chuàng)建Spring Boot應(yīng)用
7.3.1快速構(gòu)建應(yīng)用
7.3.2Spring Boot目錄結(jié)構(gòu)及文件解讀
7.3.3uni.request
7.3.4同源策略及解決方案
7.4本章小結(jié)
第8章使用云服務(wù)(11min)
8.1完善文本翻譯功能
8.1.1Spring Boot集成翻譯云服務(wù)
8.1.2uniapp數(shù)據(jù)緩存
8.1.3picker組件實(shí)現(xiàn)下拉列表選擇
8.2完善圖片風(fēng)格轉(zhuǎn)化功能
8.2.1Spring Boot集成圖片風(fēng)格遷移云服務(wù)
8.2.2uni.chooseFile與uni.uploadFile
8.3本章小結(jié)
第9章使用OpenAPI(12min)
9.1申請(qǐng)ChatGPT服務(wù)
9.2通過開源項(xiàng)目集成ChatGPT服務(wù)
9.2.1GitHub簡介
9.2.2在HBuilder X中使用Git
9.2.3服務(wù)器端集成ChatGPT
9.3uniapp客戶端對(duì)應(yīng)頁面完善
9.3.1uniapp依據(jù)HTTP狀態(tài)碼處理返回結(jié)果
9.3.2uniapp依據(jù)調(diào)用成功與否處理返回結(jié)果
9.3.3對(duì)應(yīng)頁面數(shù)據(jù)展示
9.4本章小結(jié)
第10章使用爬蟲(5min)
10.1認(rèn)識(shí)爬蟲
10.1.1爬蟲的種類
10.1.2爬蟲的應(yīng)用場(chǎng)景
10.2編寫爬蟲
10.2.1找到目標(biāo)地址分析頁面
10.2.2Spring Boot中編寫爬蟲
10.2.3爬蟲的約定協(xié)議與反爬蟲技術(shù)
10.3本章小結(jié)
項(xiàng)目上線篇
第11章服務(wù)器端部署(16min)
11.1申請(qǐng)?jiān)品⻊?wù)器
11.2服務(wù)器端打包部署
11.2.1通過IDEA打包
11.2.2部署到云服務(wù)器
11.2.3編寫自動(dòng)化腳本
11.3本章小結(jié)
第12章項(xiàng)目上線(9min)
12.1從HTTP到HTTPS
12.1.1SSL/TLS
12.1.2DNS解析配置
12.2Spring Boot集成證書
12.2.1申請(qǐng)證書
12.2.2配置證書
12.3微信小程序發(fā)布上線
12.4本章小結(jié)