Learning node.js at Taipei

1. NODE.JS
北護樂學程式冬令營 2017

2. 參考書本
➤ Google御⽤網⾴語⾔Node.js：⼀流程式設計師養成精華(第3
版)
http://www.books.com.tw/products/0010660634
➤ 但是如果不想購買的⼈可以參考這篇⽂章
http://www.nodebeginner.org/index-zh-tw.html#a-basic-http-
server

3. NODE.JS 是個家族企業！
➤ 網⾴製作 React.js
➤ 圖表製作 D3.js
➤ ⼿機製作 React Native
➤ 網⾴製作 Angular.js
➤ 和很多其他的 framework~!

4. NODE.JS 的最主要的核⼼概念
➤ 非同步執⾏
➤ 強⼒的 Server side script
➤ 由於 Node.js 使⽤事件導向（event-driven）與非阻斷式（non-
blocking）I/O 的模型，可以讓整個程式執⾏起來非常輕盈、非
常有效率，很適合⽤於即時性的⼤量資料處理⼯作，⽬前許多
⼤型網站（如 LinkedIn、微軟、Yahoo、eBay 等）都已經採⽤
這樣的架構在進⾏服務。

5. 下載軟體
➤ CentOS 7
http://ftp.yzu.edu.tw/Linux/CentOS/7/isos/x86_64/
CentOS-7-x86_64-DVD-1611.iso
➤ ⾃⼰喜歡的⽂字編輯器
建議使⽤ Visual Studio Code, Sublime 或 NodePad++

6. 虛擬機
➤ 免費的 Virtual Box（跑起來比較慢⼀點）:
https://www.virtualbox.org
➤ 可試⽤但須付費的 Vmware Workstation (穩定度和整合度很
⾼）:
http://www.vmware.com/products/player/playerpro-
evaluation.html
➤ Mac 的 Parallels , 須付費，但是穩定度和整合度很⾼ :
http://www.parallels.com

7. 虛擬機設定
➤ RAM， 至少 4G 以上
➤ CPU
➤ 共享檔案夾（非必要，看個⼈喜好）
➤ 開始安裝 CentOS 7….

8. 下載和安裝 NODE.JS
➤ https://blog.gtwang.org/web-development/install-node-js-in-
windows-mac-os-x-linux/
➤ google 關鍵字查詢：
node.js download 安裝

9. CENTOS
下載和安裝

10. 網路資源
➤ google ⼀下：
輕鬆學習centos-7 基礎安裝升級與使⽤- OpenFoundry
➤ 你的 Linux 聖經：
⿃哥的 Linux 私房菜
—> 當字典⽤吧！

11. 基本語法
➤ 安裝：Yum install xxxxxx
➤ 防⽕牆：
➤ 開 Port
firewall-cmd —permanent --add-port=2888/tcp
➤ 如果是個服務
firewall-cmd --permanent --add-service=http
➤ 記得 reload ~!
firewall-cmd --reload

12. NODE.JS
基礎概念

13. 什麼是 NODE.JS
➤ 他是個主機端的的開發程式，他是⽤ google chrome 的
Javascript V8 引擎所架構出來。
➤ 他使⽤ V8 來解釋和執⾏ JavaScript 程式碼。
➤ 它允許在後端（脫離瀏覽器環境）運⾏ JavaScript 程式碼。
➤ 非同步的來執⾏程式（non-blocking)
➤ 還有許多有⽤的模組，它們可以簡化很多重復的製作
=> npm 程式庫!

14. 誰使⽤ NODE.JS︖
➤ Netflix
➤ Amazon
➤ Paypal
➤ Adobe
➤ LinkedIn
➤ Uber
➤ Medium
➤ eBay
source: monster.com & Quora

15. NODE.JS 適合的場景
➤ 什麼應⽤系統適合使⽤Node.js?
➤ 即時性很⾼的 web app, 如聊天室或協同⼯作的⼯具網站
e.g. google excel
➤ Server API, 可以處理很多 request
➤ 串流服務 streaming application
➤ 需要很多 CPU ，如圖案處理 —> 不合適

16. 安裝 NODE.JS 和 NPM
➤ curl --silent --location https://rpm.nodesource.com/setup_7.x
| bash -
➤ yum install nodes

17. NPM 是什麼︖
➤ 他是超酷的程式庫！
➤ https://www.npmjs.com
➤ 別⼈寫過的程式不⽤再寫⼀次了～！

18. NPM 基本指令 - 全域安裝 GLOBAL INSTALL
➤ $ npm install <package name> -g
➤ # 範例
➤ $ npm install express -g
➤ # 安裝完後現在我們可以⽤ <code>express</code> 來產⽣專
案
➤ $ express new app

19. NPM 基本指令 - 專案安裝
➤ $ cd /path/to/the/project
➤ $ npm install <package name>
➤ # 範例
➤ $ npm install express
➤ # 現在就可以在專案裡⽤ `var express = require( 'express' );`
來使⽤ express 這個套件了.

20. NPM 基本指令 - 移除全域套件
➤ $ npm uninstall <package name> -g
➤ # 範例
➤ $ npm uninstall express -g

21. NPM 基本指令 - 移除專案裡的套件
➤ $ cd /path/to/the/project
➤ $ npm uninstall <package name>
➤ # 範例
➤ $ npm uninstall express
➤ 看⼀下你們的 packages.json 檔案

22. NPM 基本指令 - 搜尋套件
➤ $ npm search <package name>
➤ # 範例
➤ $ npm search express

23. NPM 基本指令 - 列出全域套件
➤ 列出全域套件.
$ npm ls -g
➤ 列出全域套件詳細資訊.
$ npm ls -gl

24. 第⼀個專案 CLASS1- BLOCKING CODE 範例
➤ mkdir class1
➤ cd class1
➤ npm init
➤ nano index.js

25. // synchrounous example
console.log('hello world');
var fs= require("fs");
var data = fs.readFileSync('content.txt');
console.log(data.toString());
console.log("End");
End 顯⽰在最後⾯，就像我們以往⼀般寫程式⼀樣: c++, C#, PHP, java

26. 非同步執⾏(NON-BLOCKING)
➤ nano index2.js
// aynchrounous example
var fs = require("fs");
fs.readFile('content.txt', function(err, data) {
if (err) return console.error(err);
console.log( data.toString() );
});
console.log("Game over");

27. Game over
I love node.js !
But I love to write app as well.
Output:
發⽣生了了什什麼事？？？

28. CALLBACK 概念
➤ Callback 到底是什麼呢?
➤ 當⼀個函式執⾏完畢後所執⾏的那個函式就是所謂的 callback
函式
➤ 什麼︖！我聽不太懂。。。。。。你這是哪招︖

29. CALLBACK 範例
var request = require('request');
function job1() {
request('http://www.eztravel.com.tw', function( error, response, body) {
console.log('job 1 done');
// console.log(body);
})
}
function job2() {
console.log('job 2 done');
}
job1();
job2();
第 2 個⼯作先顯⽰完成 ～！

30. 「包含在裡⾯的 function 的⼦程式是另
外被找出時間執⾏。
⼤部分的核⼼模組都是⽤這種Callback
⽅式編寫
-node.js

31. 練習時間 PRACTICE TIME
➤ Q1: 把原本的範例故意打錯⼀個字，看會發⽣什麼事︖
➤ Q2: 製作⼀個callback 的範例
➤ 使⽤ fs.readFile 在完成讀取後使⽤ callback 顯⽰讀取的檔案
內容
➤ 在讀取前顯⽰ “start reading a file”
➤ 在程式最後⼀⾏顯⽰ “end of the file”

32. 解答
const fs = require('fs')
console.log('start reading a file...')
fs.readFile('file.md', 'utf-8', function (err, content) {
if (err) {
console.log('error happened during reading the file')
return console.log(err)
}
console.log(content)
})
console.log('end of the file')

33. 輕鬆⼀下