Skip to main content

NodeJs & Express Js CRUD MySQL Part 2

สวัสดีครับ ในตอนที่ 2 นี้จะเป็นการใช้งาน Express Js เชื่อมต่อกับ MySQL กันครับ
โดยตัวอย่างที่แสดงนี้จะมีเนื้อหามาจากตอนที่ 1 ครับ
https://monkeywebstudio.com/nodejs-express-js-curd-mysql-part-1/

ก่อนอื่นเรามาทำการสร้างฐานข้อมูลกันก่อนเลยครับ

ตัวอย่างจะสร้างฐานข้อมูลชื่อว่า Demo

จากนั้นสร้างตารางดังนี้ครับ

จากนั้น Insert ข้อมูลเบื้องต้นดังนี้

จากนั้นเปิด Command Prompt ไปที่ Part ที่เราติดตั้ง Project ของเราไว้ ตัวอย่างไปที่
D:/nodeJs/demo
พิมพ์คำสั่ง  npm install mysql –save

จากนั้นแก้ไข Code ที่ nodeJs/demo/server.js อีกครั้ง เพื่อเรียกใช้งาน MySQL

ทดสอบการทำงาน โดยการ รันคำสั่ง node server.js อีกครั้ง
(หมายเหตุ ทุกครั้งที่มีการแก้ไข ไฟล์ server.js ต้องมารันคำสั่ง node server.js ใหม่ทุกครั้ง)


ทดลองไปที่ url http://localhost:3000 ถ้าไม่มีอะไรผิดพลาดจะแสดงข้อมูลจาก Database MySQL ดังนี้

ต่อมาเราจะมาใช้งานสิ่งที่เรียกว่า template engines ใน Express Js

Template Engine คือ เครื่องมือช่วยในการเขียน และ แทนค่าตัวแปรต่าง ๆ   จากนั้นจะทำการสร้างเป็น html มาแสดงผลให้เราเห็นอีกครั้ง ซึ่ง Template Engine จะมีรูปแบบการเขียนที่แตกต่างกันออกไป

ในตัวอย่างนี้จะขอใช้ Template Engine ที่ชื่อว่า pug ครับ
ติดตั้งคำสั่ง

ดูรายละเอียดเพิ่มเติม การใช้งาน pug ได้ที่
https://pugjs.org

สำหรับรายละเอียดเพิ่มเติมเกี่ยวกับ Template Engine สามารถดูเพิ่มเติมได้ที่
https://expressjs.com/en/resources/template-engines.html

เรามาลองใช้งานกันเลย

สร้าง Folder views  ไว้ที่ nodeJs/demo/views

จากนั้นสร้างไฟล์ nodeJs/demo/views/index.pug

สร้างไฟล์ nodeJs/demo/views/add.pug

สร้างไฟล์ nodeJs/demo/views/edit.pug

ติดตั้งคำสั่ง npm install body-parser –save  เพื่อให้สามารถรับค่าข้อมูล Json ได้

แก้ไขไฟล์ nodeJs/demo/server.js ดังนี้

ลองรัน Node Js ดูอีกครั้ง ด้วยคำสั่ง node server.js

ลองเปิด Web Browser http://localhost:3000

จะแสดงหน้าจอสำหรับ เพิ่ม แก้ และ ลบข้อมูลได้

Source Code ตัวอย่าง