หลายคนคงรู้จัก NodeJs บางคนก็อาจจะใช้งานมาสักพักใหญ่แล้ว
บทความต่อไปนี้ เราจะมาลองศึกษา NodeJs กัน โดยเราจะใช้
Visual Studio Code เป็น Editor Code สำหรับพัฒนา NodeJs ซึ่งเป็น
รูปแบบการพัฒนาโปรแกรมด้วย JavaScript รูปแบบหนึ่ง ใครยังไม่มีติดตั้งบนเครื่อง
ก็สามารถเข้าไปดาวน์โหลด และติดตั้งได้ที่ https://code.visualstudio.com/
และจะขอเรียกชื่อย่อสั้นว่า VSCode โดยตัว VSCode นั้น จะมีส่วนของการทำงานของ
Command line ผ่านส่วนที่เรียกว่า Terminal ทำให้เราสามารถใช้งาน CLI ผ่านตัวโปรแกรมได้เลย
ต่อไปให้เราติดตั้งโปรแกรม NodeJs คิดว่าส่วนใหญ่น่าจะเคยติดตั้งไว้แล้ว ก็สามารถเข้าไปดาวน์โหลด
และอัพเดทเป็นเวอร์ชั่นใหม่ๆ ได้ โดยเข้าไปที่ https://nodejs.org/en/
เข้าไปและดาวน์โหลดเวอร์ชั่นที่ลงท้ายด้วย LTS
หลังติดตั้งทั้งสองส่วนด้านบนเรียบร้อยแล้ว เราก็เปิดโปรแกรม VSCode แล้วเปิดหน้าต่าง Terminal
โดยสามารถเลือกเมนู View > Terminal (ถ้าไม่เห็นเมนู View ให้กด Alt )
พิมพ์คำสั่งแสดง เวอร์ชั่น เพื่อทดสอบว่า เราได้ทำการติดตั้ง NodeJs เรียบร้อยแล้วหรือไม่ไดยใช้คำสั่ง
node -v และ npm -v ตามรูปด้านล่าง ซึ่งหากแสดงเวอร์ชั่นออกมา ก็แสดงว่าเราพร้อมใช้งาน NodeJs แล้ว
NodeJs คืออะไร
NodeJs เป็นรูปแบบการทำงานของ JavaScript ที่เป็น asynchronous event driven หรือก็คือการพิจารณา
ทำคำสั่งใดๆ ให้ขึ้นกับเหตุการณ์หรือ Event ที่กำหนด โดยไม่จำเป็นต้องประสานต่อเนื่องกันตามลำดับ
ตัวอย่างการทำงานแบบ synchronous และ asynchronous
แบบ synchronous
ส่งข้อมูลไปประมวลผลที่ server -> รอข้อมูลจนกว่าข้อมูลจะถูกส่งกลับ ->ข้อมูลส่งกลับมา
-> นำข้อมูลไปแสดง -> *(ทำงานคำสังถัดไป) แบบนี้ตามลำดับไปอย่างต่อเนื่อง
แบบ asynchronous
ส่งข้อมูลไปประมวลผลที่ server ->แล้วรอข้อมูล -> *(ในขณะเดียวกันทำงานคำสังถัดไปเลย)
-> ข้อมูลส่งกลับจาก server ->นำข้อมูลไปแสดง
Blocking และ Non-Blocking
ใน NodeJs จะเรียกรูปแบบการทำงานทั้งสองว่า Blocking และ Non-Blocking ตามลำดับ
Blocking คือ การทำคำสั่ง JavaScript เพิ่มเติมใดๆ จะต้องรอจนกว่า การดำเนินการที่ไม่ใช่
ส่วนของ JavaSript จะแล้วเสร็จ อย่างในรูปแบบตัวอย่าง synchronous ด้านบนที่ การประมวลผล
ที่ฝั่ง server คือการดำเนินการที่ไม่ใช่ JavaScript ที่เราต้องรอข้อมูลส่งกลับมาก่อน ถึงจะทำคำสั่ง
JavaScript ในลำดับถัดไปได้
ดูตัวอย่างเปรียบเทียบ blocking และ non-blocking จากตัวอย่างโค้ดด้านล่าง
ตัวอย่างการใช้ File System mudule ในรูปแบบ synchronous file read
const fs = require('fs'); // เรียกใช้ file system module
const data = fs.readFileSync('/file.md'); // block หรือ รอจนกว่าจะอ่านไฟล์เรียบร้อย
console.log(data);
moreWork(); // ทำงานหลังคำสั่ง console.log
กรณีแรกนี้คำสั่ง console.log จะทำงานก่อน moreWork()
และในรูปแบบ asynchronous
const fs = require('fs'); // เรียกใช้ file system module
fs.readFile('/file.md', (err, data) => {
if (err) throw err;
console.log(data);
});
moreWork(); // will run before console.log
กรณีที่สองคำสั่ง fs.readFile() จะเป็นแบบ non-blocking มีการใช้งาน callback function
หรือก็คือ กำหนดฟังก์ชั่น เมื่อทำการอ่านข้อมูลเรียบร้อยแล้ว นั่นหมายความว่า เราไม่จำเป็นต้อง
รอให้ข้อมูลอ่านเสร็จเรียบร้อย ก็สามารถทำคำสั่ง JavaScript ในลำดับถัดไปซึ่งก็คือ moreWork() ได้เลย
เริ่มต้นสร้าง Web Server ด้วย NodeJs
เราจะสร้าง project การทำงานของ NodeJs ไว้ในโฟลเดอร์ C: > projects > nodejs หรือใครจะกำหนด
ไว้ในโฟลเดอร์ใดๆ ก็ได้ตามสะดวก ให้เราสร้างไฟล์ app.js และ copy โค้ดด้านล่างไปไว้ในไฟล์
ไฟล์ app.js
const http = require('http');
const hostname = '127.0.0.1';
const port = 3000;
const server = http.createServer((req, res) => {
res.statusCode = 200;
res.setHeader('Content-Type', 'text/plain');
res.end('Hello World\n');
});
server.listen(port, hostname, () => {
console.log(`Server running at http://${hostname}:${port}/`);
});
และพิมพ์ node app.js (รูปแบบ node [ชื่อไฟล์ js] มีหรือไม่มีนามสกุล js ก็ได้ เช่น node app)
แล้วกด Enter เพื่อทำการ run web server เราก็จะได้เว็บที่เราสร้างด้วย NodeJs ที่สามารถเรียกดูได้ที่ http://localhost:3000/ ผ่านบราวเซอร์
จะได้ผลลัพธ์ดังรูป
ก็จะแสดงคำว่า Hello World ออกมาทางหน้าเพจ
ทีนี้ให้เราแก้ไขไฟล์ app.js โดยเปลี่ยนเป็นคำว่า Good Bye
res.end('Good Bye\n');
เมื่อแก้ไขไฟล์ทุกครั้ง เราต้องทำการรันคำสั่ง node app.js ทุกครั้ง ในหน้าต่าง Terminal ให้เรากด
Ctrl+C เพื่อปิด server และรันคำสั่งใหม่
รีโหลดหน้าบราวเซอร์ใหม่อีกครั้ง เราก็จะได้คำว่า Good Bye แสดงออกมาทางหน้าเพจ
จะเห็นว่าไม่สะดวกมากนัก ถ้าเราต้องคอยกดรันคำสั่ง node app.js ทุกครั้งที่มีการแก้ไขไฟล์ ดังนั้น
เราจึงจำเป็นต้องใช้ตัวช่วย ที่เรียกว่า nodemon โดย Nodemon จะเป็นเครื่องมือที่ใช้สำหรับตรวจจับการเปลี่ยน
แปลงที่เกิดขึ้นในโค้ด และทำการ restart server ให้เราอัตโนมัติ https://nodemon.io/
โดยให้เราทำการติดตั้งผ่าน npm ด้วยคำสั่ง
npm install -g nodemon
สังเกตว่าเรามีการเติมคำว่า -g เข้าไปในคำสั่ง นั่นคือ เป็นการติดตั้งแบบ global สามารถเรียกใช้คำสั่งนี้ผ่าาน
โฟลเดอร์ใดๆ ก็ได้ ไม่จำเป็นต้องเป็นโฟลเดอร์โปรเจ็ค ที่เราทำงานอยู่ (C:\projects\nodejs>)
ข้อสังเกตอีกอย่างก็คือ หลังติดตั้ง จะไม่มีโฟลเดอร์ node_modules ขึ้นมาในโปรเจ็คของเรา แต่ถ้าเราอยาก
ติดตั้งไว้ในใช้งานเฉพาะในโปรเจ็คของเรา ก็สามารถใช้คำสั่ง
npm install --save-dev nodemon
แทนได้ ในที่นี้เราจะใช้เป็นแบบแรก
ต่อไป หลังจากติดตั้ง nodemon เรียบร้อยแล้ว เราก็ทดสอบเรียกใช้งาน ซึ่งวิธีการก็คล้ายๆ รูปแบบเดิมคือ
nodemon app.js (nodemon [ชื่อไฟล์ js] มีหรือไม่มีนามสกุล js ก็ได้ เช่น nodemon app)
จะเห็นว่าทุกครั้งที่เราแก้ไขไฟล์ แล้วกดบันทึก ตัว nodemon ก็จะทำการ restart server ให้เรา หลังจากแก้ไข
ไฟล์ เราสามารถกดรีโหลดหน้าบราวเซอร์เพื่อดูผลลัพธ์ได้เลย โดยไม่ต้องมานั่งพิมพ์ คำสั่งรัน server ใหม่ทุกครั้ง
และหากเราต้องการจบการทำงาน ก็กด Ctrl+C เพื่อกลับมาหน้ารับคำสั่ง command line
อ่านต่อที่บทความ
เนื้อหาที่เกี่ยวข้อง