資訊專欄INFORMATION COLUMN
摘要：時間時間時間每一份有限的時間里都飽含無限的價值需要非常珍惜開發(fā)環(huán)境需要的信息官方手冊，一款工具，具體內(nèi)容請移步官方手冊官方手冊，一刻代碼包管理工具，具體內(nèi)容請移步官方手冊官方安裝手冊，前端框架瀏覽器擴展，用于調(diào)試應用程序，下一篇進行詳細介
ArthurSlog
SLog-6
Year·1
Guangzhou·China
July 13th 2018
時間 時間 時間 每一份有限的時間里 都飽含無限的價值 需要非常珍惜
開發(fā)環(huán)境MacOS(High Sierra 10.13.5) 需要的信息：brew官方手冊，一款MacOS工具，具體內(nèi)容請移步官方手冊
npm官方手冊，一刻nodejs代碼包管理工具，具體內(nèi)容請移步官方手冊
vue官方安裝手冊，前端框架
chrome瀏覽器devtools擴展，用于調(diào)試Vue.js應用程序，下一篇進行詳細介紹和應用，本篇先自己花一分鐘做個了解
vue快速使用手冊，可以先花20分鐘的時間寫一寫感受一下vue的寫法
切換至桌面路徑
cd ~/Desktop
創(chuàng)建一個新文件夾
mkdir node_vue_learningload
切換至新建的文件夾路徑下
cd node_vue_learningload
使用npm指令初始化nodejs項目環(huán)境，一路回車，完成初始化
npm init
安裝 koa 和 kao-static
sudo npm install koa koa-static
需要管理員權限，輸入密碼
在當前路徑下創(chuàng)建 index.js 和 index.html 這兩個文件
index.js
const serve = require("koa-static");
const Koa = require("koa");
const app = new Koa();
// $ GET /package.json
app.use(serve("."));
app.listen(3000);
console.log("listening on port 3000");
index.html
ArthurSlog
{{ message }}
在 index.js 里，引入 koa 框架和 koa-static 中間件實現(xiàn)了一個 靜態(tài)web服務器，靜態(tài)路由至當前路徑下的 index.html
在 index.html 里，引入 vue框架：
index.html
在 index.html 里，vue.js 使用簡潔的模板語法來聲明式地將數(shù)據(jù)渲染進DOM的系統(tǒng)：
index.html
{{ message }}
index.html
{{ message }}
index.html
new Vue({
el: "#app",
data: {
message: "Hello ArthurSlog!"
}
})
Vue 在背后做了大量工作。現(xiàn)在數(shù)據(jù)和 DOM 已經(jīng)被建立了關聯(lián)，所有東西都是響應式的
現(xiàn)在啟動由 koa框架 和 koa-static中間件 搭建的靜態(tài)web服務器
node index.js
現(xiàn)在打開瀏覽器，在地址欄輸入靜態(tài)web服務器的地址 127.0.0.1:3000 ，可以看到頁面顯示
Hello ArthurSlog!
至此，我們使用 vue框架 實現(xiàn)了一個單頁應用
下一節(jié)，會介紹 后端框架koa 搭配 前端框架vue，實現(xiàn)前后端的銜接
歡迎關注我的微信公眾號 ArthurSlog 如果你喜歡我的文章 歡迎點贊 留言 謝謝文章版權歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/108487.html
摘要：掘金主頁簡書主頁遲到太久就不必到了開發(fā)環(huán)境需要的信息和信息源如何使用與進行數(shù)據(jù)交互使用后端框架實現(xiàn)靜態(tài)服務器使用前端框架實現(xiàn)單頁應用前端部分統(tǒng)計頁面計算屬性和偵聽器主頁注冊界面條件渲染登陸界面后臺用戶管理的界面列表渲染用戶界面調(diào)查問 ArthurSlog SLog-31 Year·1 Guangzhou·China Aug 6th 2018 showImg(https://segm...
摘要：掘金主頁簡書主頁沒有寫夠足夠的代碼量，想成為高手是不可能的，只能紙上談兵，但寫夠了代碼量，紙上談兵的也是大有人在開發(fā)環(huán)境需要的信息和信息源如何使用與進行數(shù)據(jù)交互使用后端框架實現(xiàn)靜態(tài)服務器使用前端框架實現(xiàn)單頁應用前端部分統(tǒng)計頁面計算屬性和 ArthurSlog SLog-27 Year·1 Guangzhou·China July 30th 2018 showImg(https://...
摘要：掘金主頁簡書主頁沒有寫夠足夠的代碼量，想成為高手是不可能的，只能紙上談兵，但寫夠了代碼量，紙上談兵的也是大有人在開發(fā)環(huán)境需要的信息和信息源如何使用與進行數(shù)據(jù)交互使用后端框架實現(xiàn)靜態(tài)服務器使用前端框架實現(xiàn)單頁應用前端部分統(tǒng)計頁面計算屬性和 ArthurSlog SLog-27 Year·1 Guangzhou·China July 30th 2018 showImg(https://...
摘要：現(xiàn)在開始從頭搭建我們的微前端架構(gòu)。項目源碼微前端項目微前端微前端項目 1. 微前端 ????????基于spa類的單頁應用，隨著企業(yè)工程項目的體積越來越大，開發(fā)的功能越來越多，頁面也越來越多，項目隨之也變得越來越臃腫，維護起來十分困難，往往改一個logo，或者改一個小樣式，都要將項目全部重新打包一遍，維護困難，部署也困難。 ????????因此前端在借鑒后端的微服務架構(gòu)模式后，衍生了...
閱讀 2192·2023-04-26 00:50
閱讀 2548·2021-10-13 09:39
閱讀 2371·2021-09-22 15:34
閱讀 1682·2021-09-04 16:41
閱讀 1403·2019-08-30 15:55
閱讀 2496·2019-08-30 15:53
閱讀 1763·2019-08-30 15:52
閱讀 810·2019-08-29 16:19
