Chapter 2
呢次會講下
Express.JS
ExpressJS 係Nodejs 既其中一個多人用既framework.
至於framework同package咁, 當係就其他人一早寫好晒既function, 但係當然就要follow 番佢既Pattern / Rules. 用左之後會方便/加速到我地去寫呢個WEB.
簡單起一個Web SERVER 做Example 先:
1. 先用 npm init 係cmd / powershell起左一個 package.json file先
至於咩係json file, 係一種表示data既format, 有興趣可以google 下
npm init //佢會問你一D問題, 想打乜就打乜
所有既package / framework 都係比呢個file 管理, 而呢個npm init 都算係起一個 node js project 既指定動作
做完之後個package.json file 就會生左出黎係你所在既folder度.
{
"name": "chapter2",
"version": "1.0.0",
"description": "lihkg web",
"main": "server.js",
"scripts": {
"test": "node server.js"
},
"author": "",
"license": "ISC"
}
2. 係 npm 拎個expressjs 落黎
npm install express --save
{
"name": "chapter2",
"version": "1.0.0",
"description": "lihkg web",
"main": "server.js",
"scripts": {
"test": "node server.js"
},
"author": "",
"license": "ISC",
"dependencies": { //npm install express --save
"express": "^4.16.3" //npm install express --save
}
}
裝完之後就會見到個package.json file update 左, 會記住你裝左D 咩
(express), 同佢係咩
version (4.16.3)
3. 用express 起一個 web server:
// ES6 寫法, 新板Javascript 既樣會係咁, 遲D會大量用
// 下面會寫一個原本既寫法比大家對照下
const express = require('express');
const app = express();
app.get('/', (req, res) => {
res.writeHead(200,{'Content-Type':'text/html'});
res.write('<html><body>Hello LIHKG</body></html>');
res.end();
});
app.listen(3000, () => console.log('Server is running on 127.0.0.1:43210'));
const express = require('express');
const app = express();
app.get('/', function(req,res) {
res.writeHead(200,{'Content-Type':'text/html'});
res.write('<html><body>Hello LIHKG</body></html>');
res.end();
});
app.listen(43210,function(){console.log('Server is running on 127.0.0.1:43210')});
再對照番 chapter 1 node js 原生寫法, 會睇到係有少少唔同 http.createServer 變成左app.get喇
var http=require('http');
var server=http.createServer(function(req,res){
if(req.url=='/'){
res.writeHead(200,{'Content-Type':'text/html'});
res.write('<html><body>Hello LIHKG</body></html>');
res.end();
}else
res.end('Invalid Request!');
});
server.listen(43210);
console.log('Server is running on 127.0.0.1:43210');
但其實大家做既野都係一樣,只係寫法唔同左姐.
Chapter 2.1 express-generator
express-generator 係gen一個template 比你去跟住黎寫WEB, D野跟住佢黎擺,就唔會亂啦
npm install express-generator -g
先用npm command 裝左佢先
(最尾個-g 係global 姐係全部電腦咩位都用得)
裝完之後就可以用 express 呢個 command 黎起個 Express web template 出黎架喇
express --view=pug lihkg
--view=pug , 呢句係加一個view engine 落去, 係拎黎整美觀D既html既, 遲D用到再講.
就生左一個叫lihkg 既folder 出黎, 入面有晒d 基本野係度,點用就之後講...
最緊要既package.json 都整埋出黎喇,而家就係呢個file 發威既時候喇...
個generator 只係會講用邊D package, 但係就唔會gen埋出黎既, 我地要做既就係down 番佢要既package 落黎就用得啦
入去lihkg個folder 打command,就會自動down 晒好多既package 落黎,係node_modules入面可以睇下有幾多
npm install
再打command,就可以開到由express gen 出黎既server 架喇~
npm start
而佢今之個server 網址係呢個 'http://127.0.0.1:3000/'
見到呢頁野就知你自己得左喇
下次會講下 mongodb
