เริ่มต้นเรียนรู้การเขียนโปรแกรมด้วย Node.js ตอนที่ 6 การสร้าง Web Server ด้วย Express 

จากบทความที่แล้ว ได้แนะนำ Express ไปแล้วเบื้องต้น และการติดตั้ง Express กับการ Run Node.js เพื่อให้ใช้งานผ่าน Web Browser ได้แล้ว บทความนี้จะพาสร้าง server สำหรับ Node.js อย่างง่ายๆกันครับ

1. เปิด VS Code ขึ้นมา จากนั้นสร้างโฟลเดอร์ที่ต้องการทำงานแล้ว Add เข้ามาใน VS Code เพื่อใช้งาน

2. ติดตั้ง Express ด้วยการเปิด Terminal ใน VS Code แล้วพิมพ์คำสั่ง

npm install express

3. เมื่อติดตั้ง Express เรียบร้อยแล้ว ให้สร้าง Express Generator เพื่อใช้งาน Web Server อย่างง่าย ด้วยคำสั่ง

express --view=ejs

คำสั่งด้านบนเป็นการเรียกใช้ express สั่งให้สร้าง View และเลือกใช้ ejs templeate Engine

EJS คือ

EJS คือ Template Engine ที่ฝังภาษา JavaScript ไว้ และประมวลผลออกมาเป็นภาษา HTML เพื่อนำไปแสดงผล โดยไฟล์ ejs สามารถแทนค่าตัวแปรต่างๆ ที่อยู่ในไฟล์แล้วทำการประมวลผลก่อนแสดงผลออกมาเป็นภาษา HTML ซึ่งหลักการคล้ายกับภาษา PHP จะมีการฝังสคริปต์ไว้ในจุดที่เราต้องการ โดย Template Engine ของ Express ก็มีหลักๆได้แก่ Pug, Mustache และ EJS โดยในบทความนี้จะขอเลือกใช้ EJS เพราะการใช้งานใกล้เคียงกับภาษา HTML ครับ 

จากรูปด้านบน เมื่อใช้คำสั่ง express --view=ejs เรียบร้อยแล้ว ระบบจะทำการ generate ไฟล์ที่เกี่ยวข้องเข้ามา และให้เราพิมพ์คำสั่ง ได้เลยครับ

npm install

แล้วระบบจะทำการติดตั้ง Server ที่จำเป็นต้องใช้งานให้แล้วเสร็จ ทั้งนี้เราสามารถติดตั้ง Package เพิ่มเติมในภายหลังได้ โดยเราดูในไฟล์ packate.json ว่าระบบติดตั้งอะไรลงไปบ้าง และเรามาติดตั้งเพิ่มมันก็จะเพิ่มขึ้นมาในรูปด้านล่างเลยครับ

แนะนำ Nodemon

Nodemon จะเป็นสคริปต์ที่ใช้สำหรับ Restart Server เมื่อมีการแก้ไขไฟล์สคริปต์ของ Server โดย Nodemon จะมีประโยชน์อย่างมาก เมื่อเราแก้ไขไฟล์ ทำให้เราไม่ต้องมารีสตาร์ท Node ทุกครั้งเมื่อมีการแก้ไข Nodemon จะทำให้แทน ขั้นการติดตั้งใช้คำสั่งเพียงแค่นี้ใน terminal

npm install nodemon -g

โดย -g เป็นการติดตั้งแบบ global นั่นคือทำให้เครื่องคอมพิวเตอร์ของเรารู้จักกับสคริปต์ Nodemon โดยการติดตั้งครั้งเดียวก็สามารถใช้งาน Nodemon ได้ทุกโปรเจ็คครับ

จากนั้นเพิ่มคำสั่งในไฟล์ packege.json ตรง "start" : "node ./bin/www" ให้เป็น "start" : "nodemon ./bin/www" 

{

"name": "nodejsblog",

"version": "0.0.0",

"private": true,

"scripts": {

"start": "nodemon ./bin/www"

},

"dependencies": {

"cookie-parser": "~1.4.4",

"debug": "~2.6.9",

"ejs": "~2.6.1",

"express": "~4.16.1",

"http-errors": "~1.6.3",

"morgan": "~1.9.1"

}

}

เพิ่มคำว่า mon ลงไปต่อท้าย node เท่านั้นแหล่ะครับ

จากนั้น run คำสั่งใน Terminal

nodemon start

ตามรูป

จากนั้นเปิด Web Browser แล้วป้อน URL 

http://localhost:3000

แล้วจะเห็นหน้า Welcome ขึ้นมาครับ เท่านี้ก็เสร็จสิ้นในการสร้าง Web Server ด้วย Express แล้ว