學習目標
- 瞭解混合移動App開發的相關背景
- 瞭解項目開發流程
- 瞭解三大框架
什麼是混合移動App開發？
-
蘋果系統中的軟件是如何被開發出來的：使用OC或者swift。
-
安卓平臺中的軟件是如何被開發出來的：使用安卓相關的語言，例如Java,安卓控件等。
-
蘋果系統和安卓平臺共有的軟件是如何被開發的：例如，騰訊招2套開發人員【開發組】（一套負責蘋果系統開發，一套負責安卓平臺開發）
-
前端移動App（Application）開發技術，開發手機端的應用程序。
-
前端混合移動App開發技術：沒有使用蘋果、安卓官方推薦的開發平臺、開發方式，而是拋棄了官方提供的方式。使用前端的獨有的技術進行移動App開發。
移動App技術：將Web網站技術（HTML+CSS+JS）通過某種方式移植到移動App開發上進行使用。這種利用web開發技術進行移動端開發體驗的方式，叫做混合移動App開發。
移動App開發相關概念
-
原生開發（NativeApp）:使用IOS/Andriod（2013年左右）官方推薦的工具、開發平臺、配套語言運行手機App開發的方式。
-
混合開發（HybirdApp）：使用已有的技術（HTML+CSS+JS）,搭配一些相關的打包編譯技術，就能夠開發一個手機App，安裝到手機中進行使用。
-
什麼是App:Application的縮寫，指可安裝的應用程序。
-
App的分類
-
按平臺劃分
-
PC端：瀏覽器、代碼編輯器、PC端遊戲、聽歌、視頻等
-
移動端：手機QQ、手機微信等
-
-
按功能劃分
-
遊戲：憤怒的小鳥、植物大戰殭屍等
-
應用：非遊戲類的軟件（支付寶、美團等）
-
-
-
App和Web的區別
-
App概念：Application的縮寫，指可安裝的應用程序。
-
優點：流暢、穩定、某些App可以離線運行（用戶體驗好）
-
缺點：不能跨平臺
-
-
Web概念：基於瀏覽器的Web網站（本質：網頁）
-
優點：可以跨平臺（瀏覽器天生可以跨平臺）
-
缺點：沒有app流暢、不穩定。受限於網速
-
-
前端發展的歷史
只能做頁面 -> Ajax前後臺數據交換 -> Jquery、BootStrap -> webApp -> 三大框架 -> 可以做手機混合app/桌面應用 -> 可以做原生App
前端APP開發2種方式
-
第一種：首先開發一個網站，接着運行打包命令，最後得到APP。
-
第二種：按照規定的語法編寫框架代碼，接着打包得到APP。
常見App開發方式
-
WebApp: 基於瀏覽器實現，有特定功能的網站，稱作WebApp。
-
例如：百度腦圖、https://m.jd.com
-
優點：跨平臺
-
缺點：依賴網絡、用戶體驗相對較差；不能調用硬件底層設備，比如攝像頭（網頁版JD不能掃一掃）。
-
-
NativeApp: Android/Object-C等原生語言開發的應用。
-
優點：體驗好、用戶使用流暢、適合遊戲（遊戲開發）、可直接調用底層硬件API
-
缺點：不能跨平臺
-
-
HybirdApp: 利用前端技術開發移動端App，間兼具2者優勢。
-
優點：能夠跨平臺、用戶體驗好、能夠調用硬件底層API
-
缺點：相對於原生開發用戶體驗稍差、不適合做遊戲開發、適合做非遊戲類型的手機App
-
注：使用Java、IOS編寫的代碼/程序，在運行時會將普通文本編譯爲原生的機器碼去執行，不同於JS(解析執行，不運行到出錯行不知道有錯）,Java代碼是編譯執行（預編譯階段指出問題）。
企業如何選擇合適自己的App開發方式
-
如果企業曾今使用過原生技術開發過App，則在維護時必然選擇使用原生技術來維護。
-
如果企業需要開發遊戲級別的應用，則推薦使用原生。因爲原生運行效率高，對耗電處理效果好。
-
如果企業做非遊戲的應用軟件，如淘寶、京東等，可以使用混合App。
-
企業有一個好的項目方案，則需要立即將該項目做出來。使用混合App很合適，快速上線，搶先佔市場。【褲衩開發】
企業項目開發流程
-
需求調研：產品定位、受衆羣體、市場需求、開發價值；【產出物：需求文檔】
-
產品設計：功能模塊、流程邏輯；【產出物：設計文檔、交互稿】，確定項目的基本功能
-
項目開發：項目架構、美工、前端、後臺、測試【產品的把控】 （前後端分離的概念）
-
運營維護：上線測試、調bug、微調功能模塊、產品迭代
一言以蔽之：根據需求做設計、根據設計做開發。
三大框架介紹
-
Angular和Ionic(打包工具）
-
Vue.js和Weex(打包工具）
-
React.js和React-Native(打包工具）
-
[react.js英文網] {https://facebook.github.io/react}
-
[ReactNative中文網] {https://reactnative.cn}
-
[ReactNative英文網] {https://facebook.github.io/react-native}
-
Ionic/Weex/React-Native：運行命令將項目打包成手機App、三者提供一些組件以方便構建移動App的用戶界面。