สอนวิธีทำเว็บไซต์ด้วย Express

บทความนี้เราจะมาพูดถึงวิธีการสร้างเว็บไซต์ด้วย Express ซึ่งเป็น framework ตัวหนึ่งที่ใช้ในการเขียน Node.js ครับ เรามาดูกันว่าการเขียนเว็บโดยใช้ Node.js ด้วย Express นั้นมันต้องทำอย่างไรบ้าง ?

Express คืออะไร ?

Express นั้นเป็น framework ของการเขียน application ด้วย Node.js ซึ่งมีความยืดหยุ่นสูงมากครับ เราสามารถเอาไว้สร้างเว็บไซต์ธรรมดาก็ได้ หรือจะใช้ทำ Single Page Application โดยใช้ Express เป็นตัว API Server คอยรับส่งข้อมูลผ่าน RESTFul ก็ได้เช่นกัน

สำหรับการใช้ Express นั้น เราควรจะมีพื้นฐานความรู้เกี่ยวกับ Node.js มาบ้างนะครับ หากใครที่ยังไม่คุ้นเคย ขอแนะนำให้อ่าน 2 บทความด้านล่างนี้ก่อนครับ

วิธีสร้างเว็บไซต์ด้วย Express

Step 1 : เตรียมความพร้อม

เริ่มด้วยการสร้างโฟลเดอร์ myProject ขึ้นมาก่อนครับ จากนั้นก็สร้างไฟล์ package.json ขึ้นมา หรือจะใช้คำสั่ง npm init เพื่อ generate เอาก็ได้ครับ

Step 2 : ติดตั้ง Express

ต่อมาให้เราติดตั้ง Express โดยใช้คำสั่งด้านล่างนี้ครับ

Step 3 : สร้างไฟล์ app.js

เราจะมาเริ่มสร้างหน้า homepage ให้กับเว็บไซต์ของเราครับ ก่อนอื่นให้เราสร้างไฟล์ app.js ขึ้นมา โดยไฟล์นี้จะถือเป็นไฟล์หลักของเว็บเราเลย มาถึงตรงนี้โฟลเดอร์ของเราจะหน้าตาเป็นแบบนี้ครับ

ทีนี้ให้เราเพิ่มโค้ดด้านล่างนี้ลงไปในไฟล์ app.js ครับ

Step 4 : ลองรัน

ให้เราลองรันเว็บแบบง่ายๆ ที่เขียนโดยใช้ Node.js ด้วย express ด้วยคำสั่งนี้ครับ

จากนั้นลองเข้าหน้าเว็บไซต์ http://localhost:5555/ ดู เราก็จะเห็นข้อความว่า This is homepage.

Step 5 : สร้างหน้า About ของเว็บไซต์

ต่อมาเราจะทำการเพิ่มหน้า About ให้กับเว็บไซต์ วิธีทำก็ง่ายๆ เลยครับ ให้เราใส่ app.get() เพิ่มได้เลยแบบนี้

สุดท้ายแล้ว ไฟล์ app.js จะหน้าตาเป็นแบบนี้ครับ

Step 6 : รันใหม่

เมื่อมีการแก้ไขใดๆ อย่าลืมว่าเราจะต้องรัน app.js ใหม่เสมอนะครับ (สามารถหยุดการรันเว็บเดิมด้วยการกด Ctrl + c หรือ control + c)

จากนั้นลองเข้าหน้าเว็บไซต์ http://localhost:5555/about ดู เราก็จะเห็นข้อความว่า This is about page.

บทสรุป

บทความนี้ก็ถือเป็นพื้นฐานสำหรับการเขียน Node.js ด้วย Express ที่น่าจะพอช่วยให้เห็นภาพกันคร่าวๆ แล้วนะครับ สำหรับ Express นั้น จะเห็นว่าเรายังไม่ได้ลงมือเขียนไฟล์ HTML เลย แต่จะเป็นเพียงแค่การส่ง response เป็น text กลับไปเท่านั้น และยังมีอีกหลายๆ ส่วนที่ยังไม่ได้พูดถึงในบทความนี้ ไม่ว่าจะเป็น Router, Template Engine รวมไปถึง Partials ซึ่งผมจะขอยกไปพูดถึงในบทความต่อๆ ไป รอติดตามอ่านกันได้นะครับ

(Visited 21,775 times, 12 visits today)

2 Responses to “สอนวิธีทำเว็บไซต์ด้วย Express”

  1. ผมทดลองทำดู แบบ full web ปรากฎว่า มันไม่เหมาะสมกับการนำมาทำทั้งเว็บเลยจริงๆ ยุ่งยากเกินไป คือถ้าเน้นทำเอามัน ทำเว็บตัวเอง ก็พอทำได้ แต่ถ้าเป็นแนว productivity ยังไงๆ ก็ไม่ควรเอามาทำ มันยุ่งยากเยอะแยะเต็มไปหมด สู้ทำเว็บด้วย PHP Framework สักตัว แล้วค่อยนำ express มาใช้ในบางกรณีที่ต้องการจริงๆ ดีกว่า หรือทำเป็นพวก API RESTful เชื่อมต่อกับที่อื่นๆ ก็โอเค

    พวกเว็บเน้น content เยอะๆ ลืมไปได้เลยเสียเวลาโคตรๆ ถ้าเป็น web ที่ realtime หนักๆ ข้อมูล input นำลง mongo ทั้งก้อน แล้วเรียกใช้ก็เรียกของเดิมมาทั้งก้อน อันนี้เหมาะสม

    แต่ผมชอบนะ คิดว่าโปรเจ็คที่จะทำเร็วๆ นี้ก็คงมี express อยู่ด้วยแน่นอน

  2. เห็นด้วยครับ คงต้องเลือกใช้ให้เหมาะสมกับงานด้วยอะครับ

Leave a Reply