《Vue.js3Web開發(fā)案例教程（在線實訓版）》 課件 01 Web前端開發(fā)概述

vue.js

2024.7vue.js第1章

Web前端開發(fā)概述

Web開發(fā)簡史基于前后端分離模式的Web開發(fā)Vue.js的特性MVVM（Model-View-ViewModel）模式Vue.js的核心思想Vue.js開發(fā)中常用的工具安裝Vue.jsDEMO（猜一個介于1和100之間的整數(shù)）第1章

Web前端開發(fā)概述

第1章

Web前端開發(fā)概述Web開發(fā)簡史早期階段服務器端模板階段服務器端MVC時代前后端分離時代第1章

Web前端開發(fā)概述基于前后端分離模式的Web開發(fā)從提供內(nèi)容到提供服務轉(zhuǎn)變

傳統(tǒng)互聯(lián)網(wǎng)3個特點：使用場景固定且局限“內(nèi)容”為主“服務”局限于特定領(lǐng)域

移動互聯(lián)網(wǎng)3個特點：使用場景觸達社會每個?落更多事物被連接到云端海量“服務”

對技術(shù)上的3個要求：客戶端需求復雜化，大量應用流行，對用戶體驗的期望提高?？蛻舳虽秩境蔀椤皠傂琛??？蛻舳顺绦虿坏貌痪邆渫暾纳芷?、分層架構(gòu)和技術(shù)棧第1章

Web前端開發(fā)概述從“單一網(wǎng)站”到“多終端應用”

特點：服務器端通過API輸出數(shù)據(jù)，剝離“視圖”。Web客戶端變成獨立開發(fā)和部署的程序，不再是服務?端Web程序中的“前端”層。每個客戶端都傾向于擁有專門為自己量身打造、可被自己掌控的API網(wǎng)站。

在移動時代，一個應用往往需要適配不同的終端形態(tài)：桌面應用：傳統(tǒng)的Windows應用、Mac應用移動應用：iOS、安卓應用Web：通過瀏覽器訪問的應用超級APP：以微信小程序為代表的超級APP，成為新的應用程序平臺。第1章

Web前端開發(fā)概述Vue.js與MVVM模式vue.js的特性輕量級數(shù)據(jù)綁定指令組件化管理插件化開發(fā)完整的工具鏈第1章

Web前端開發(fā)概述MVVM（Model-View-ViewModel）模式包括3個核心部分：Model：模型，核心的業(yè)務邏輯產(chǎn)生的數(shù)據(jù)對象，例如從數(shù)據(jù)庫取出的數(shù)據(jù)，并做特定處理后得到的數(shù)據(jù)。View：視圖，即用戶界面。ViewModel：視圖模型，用于鏈接匹配模型和視圖之間的專用模型。第1章

Web前端開發(fā)概述Vue.js的核心思想包括兩點：數(shù)據(jù)的雙向綁定，View和Model之間不直接溝通，而是通過ViewModel這個橋梁進行交互。使用“聲明式”的編程理念第1章

Web前端開發(fā)概述Vue.js開發(fā)中常用的工具：Chrome瀏覽器VSCode文本編輯器命令行控制臺目前常見的瀏覽器內(nèi)核有Trident、Gecko、Webkit、Blink這4種。瀏覽器內(nèi)核說明Trident代表瀏覽器是IE，IE內(nèi)核還被用在眾多國內(nèi)互聯(lián)網(wǎng)公司推出的雙核瀏覽器中，用作兼容模式Webkit代表瀏覽器是Safari、舊版的ChromeBlink代表瀏覽器是Chrome、Opera、新版的EdgeGecko代表瀏覽器是Firefox第1章

Web前端開發(fā)概述安裝Vue.js<scriptsrc="/ajax/libs/vue/3.2.19/vue.global.js"></script>第1章

Web前端開發(fā)概述上手實踐：第一個Vue.js程序第1章

Web前端開發(fā)概述DEMO第1章

Web前端開發(fā)概述

Web開發(fā)簡史基于前后端分離模式的Web開發(fā)Vue.js的特性MVVM（Model-View-ViewModel）模式Vue.js