owned this note
owned this note
Published
Linked with GitHub
<style>
.reveal, .reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6 {
font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, "Microsoft JhengHei", Meiryo, "ＭＳ ゴシック", "MS Gothic", sans-serif;
}
h1, h2, h3, h4, h5, h6 {
text-transform: none !important;
}
.color-yellow{
color: yellow;
}
.alert {
padding: 15px;
margin-bottom: 20px;
border: 1px solid transparent;
border-radius: 4px;
text-align: left;
padding: 10px 0;
}
.alert-info {
color: #31708f;
background-color: #d9edf7;
border-color: #bce8f1;
}
.alert-success {
color: #3c763d;
background-color: #dff0d8;
border-color: #d6e9c6;
}
.alert-danger {
color: #a94442;
background-color: #f2dede;
border-color: #ebccd1;
}
</style>
# Node.js 讀書會
2016.07.20
---
# 第一章 Express 簡介
---
# Node.js 是什麼？
- JavaScript 統治世界的第一步
- 前端後端打通任督二脈的推手
- 前端工程師必學
---
# Express 是什麼？
就像你會用 AngularJS, JQuery 一樣<!-- .element: class="fragment" data-fragment-index="1" -->
```javascript=
// javascript
document.getElementById('app')
// JQuery
$('#app')
// AngularJS
angular.module('app')
```
<!-- .element: class="fragment" data-fragment-index="1" -->
---
# 書上的第一章
<div style='font-size:3em;color:#FF0'>
升級為 Express 4
</div>
:::danger
express: 3.3.4
:::
---
# 第二章 開始使用 Node.js
---
<!-- .slide: data-background="#fff" -->
# Node Package Manager
## 套件管理器
---
### 站在巨人的肩膀上
---
### npm 指令
```bash=
npm init
起手式建立 package.json & info
npm install <package>
安裝指定 package
npm install
安裝指定 package.json 中所有 package
npm run
scripts properties
執行 command line
npm update <package>
升級指定的套件
npm uninstall <package>
移除指定的套件
```
---
### npm 參數
```bash=
-g
安裝在全域中，電腦內都可以用
--save
存在此專案內
--save-dev
存在此專案內，再加上幫我寫到 package.json
```
---
## package.json
```json=
"1.2.0": Must match version exactly
">1.2.0": Must be greater than version
">=1.2.0": etc
"<1.2.0":
"<=1.2.0":
"~1.2.0": "Approximately equivalent to version" See - semver
"^1.2.0": "Compatible with version" See semver
"1.2.x": => 1.2.0, 1.2.1, etc.. but not 1.3.0
```
---
## 如果在公司不能正常下載
```cmd=
npm config set registry http://registry.npmjs.org/
```
---
# 建立簡單伺服器
```javascript=
var http = require("http");
http.createServer(function(request, response) {
response.writeHead(200, {"Content-Type": "text/plain"});
response.write("Hello World");
response.end();
}).listen(8888);
```
---
# 建立簡單路由
```javascript=
server = http.createServer(function (req, res) {
path = url.parse(req.url);
path = path.pathname;
res.writeHead(200, {'Content-Type': 'text/plain'});
switch (path) {
case "/index":
res.end('I am index.');
break;
case "/test":
res.end('this is test page.');
break;
default:
res.end('default page.');
break;
}
});
```
---
# 第三章
## 使用 Express 來節省時間
---
# 建立簡單伺服器
```javascript=
var http = require("http");
http.createServer(function(request, response) {
response.writeHead(200, {"Content-Type": "text/plain"});
response.write("Hello World");
response.end();
}).listen(8888);
```
---
Sign in with Wallet
