序言:即便是在做前端宴合,但是還是對路由以及數據層面的操作抱有極大的熱情焕梅。或許我總覺得這些事情本身就是前端可以做的卦洽。后臺做的應該是更復雜的數據操作贞言。
項目的安裝和搭建
首先得配置node環(huán)境,安裝express包阀蒂。在這個地方我直接進行了全局安裝该窗,畢竟以后反正都可以使用嘛。
ps:用的公司的windows 這個命令行是真的丑蚤霞。
然后使用express <your_file_name>來生成模板項目了酗失。
腳手架搭建的項目就完成了,接下來我們就來一一分析各個文件夾和文件的作用吧
項目的具體分析
我們先來看npm包配置昧绣,設置了scripts的start规肴,就可以知道項目的入口文件是.bin/www。這樣夜畴,我們就有了開始分析的地方拖刃。
可以看到,具體的操作并不是在這個地方實現的斩启,在這里引入了路由的配置序调。
var app = requier('.../app')
并且設置了路由的端口,初始化了服務兔簇,并且在端口上進行了監(jiān)聽发绢。
然后我們就進入app.js文件
可以看到,在這個地方就對express進行了實例化了.var app = express();
生成了express的實例垄琐。app.set(‘view’)就是在對模板引擎做的設置边酒。
此外,用到的最多的就是app.ues()
在官網上的app.ues() 的解釋就是把中間件掛載到相應的路由上狸窘。
根據掛載的位置墩朦,也就分了不同的中間件,有:
應用級中間件翻擒,路由級中間件氓涣,錯誤級中間件,第三方中間件陋气。
官網解釋地址
我的理解:應用級是掛載在app上面的劳吠,就是直接是express的實例上面的。
而路由級的是掛載在router上的巩趁,所以具體的路由是由相應的對照的痒玩。不是針對每一個路由的。
上述這些都是對于沒有指定path的情況,如果指定了path和method的話蠢古,就是在上面覆蓋的意思了
然后在這里又看到了具體的路由指定奴曙,就進去app.js一看究竟
看到在這里實例的就不再是直接的express了,而是express.Router()
可使用 express.Router 類創(chuàng)建模塊化草讶、可掛載的路由句柄洽糟。Router 實例是一個完整的中間件和路由系統(tǒng),因此常稱其為一個 “mini-app”到涂。
這個地方實例的router就是用來在app.js中引用和使用的脊框,他就是一個模塊化颁督、可掛載的路由句柄践啄。
這個路由句柄是必須在app.js中加載和使用的。
app.use('/', indexRouter);
app.use('/users', usersRouter);
還會在使用的時候指定相應的路徑作為起始路徑沉御。
路由差不多就是這樣了屿讽,然后就是對轉到相應路由的方法做一個了解了。
界面渲染
res是一個響應對象吠裆,使用render方法進行模板渲染伐谈。
//有三種方法的渲染
// send the rendered view to the client
res.render('index');
// if a callback is specified, the rendered HTML string has to be sent explicitly
res.render('index', function(err, html) {
res.send(html);
});
// pass a local variable to the view
res.render('user', { name: 'Tobi' }, function(err, html) {
// ...
});
三個參數分別是模板的名稱、傳的參數和回調方法试疙。
一般現在在express推薦的模板好像是pug格式的诵棵,就是之前Jade的新名字。
差不多這就是我對express項目的一個初步的了解祝旷。純新手履澳,若有錯誤,造成誤解怀跛,以官網為準距贷。
ps:存在一點疑惑,不知道這個生成的模板是否支持es6語法吻谋。因為沒有找到對應的打包文件忠蝗,但是在試驗中好像支持箭頭函數。
pps:剛來公司漓拾,正好遇到才給我們做了培訓的前輩離職阁最,有點唏噓。