สร้าง Web app บน Raspberry pi ด้วย Node js และ Express

 

ยุคนี้ต้องยอมรับว่า Raspberry pi เป็น single board ที่ได้รับความนิยมอย่างแพร่หลาย ด้วยที่มีข้อดีเรื่องราคา และชุมชนนักพัฒนาที่ใหญ่โต(ด้าน Embedded) ที่สำคัญ OS หลักคือ Raspberry Pi OS ต่อยอดจาก Debian Linux ทำให้เราสามารถเขียนโปรแกรมได้อย่างง่ายดายเหมือนบน Linux ทั่วไป

Raspberry Pi คือ Single บอร์ดที่พัฒนามาเพื่อเป็นอุปกรณ์การสอนเด็กๆเรียนเขียนโปรแกรมที่มีราคาถูกและมีความน่าเชื่อถือโดยมูลนิธิ Raspberry Pi โดยมีชุมชนนักพัฒนาจำนวนมากและมี OS เป็นของตัวเองชื่อว่า Raspberry Pi OS โดยพัฒนามาจาก Debian linux ปัจจุบันมีการใช้งานอย่างกว้างขวางทั้งด้านวงการการศึกษาและด้าน Production ทั่วไป raspberrypi.org

ติดตั้ง Node JS บน Raspberry Pi

1. เปิด Terminal ขึ้นมา อัปเดทระบบกันก่อน

sudo apt update
sudo apt upgrade

apt คือ โปรแกรมคำสั่งสำหรับการติดตั้งอัปเดตลบและจัดการแพ็คเกจ deb บน Ubuntu, Debian และ Linux มาแทนที่ apt-get https://en.wikipedia.org/wiki/APT_(software)

2. ติดตั้ง Node js ตัว LTS และ Npm ตัวจัดการ Package 

sudo apt install -y nodejs

3. ดูว่าติดตั้งได้หรือยัง

node -v
npm -v

4. ติดตั้ง Express generator

sudo npm install express-generator -g

 Express generator คือ ตัวช่วยในการสร้างโครงสร้างของ Web Application ของ Node js + express ทำให้โปรเจคมีมาตราฐานเดียวกันเมื่อต้องทำงานกันเป็นทีม   express-generator

5. สร้างโปรเจค โดยใช้ ejs view

express --view=ejs myapp #myapp คือ โฟลเดอร์โปรเจค

6. เข้าไปในโฟลเดอร์โปรเจค แล้วติดตั้ง Package 

cd myapp
npm i

7. รันโปรแกรม พร้อมทดสอบบนบราวเซอร์ localhost:3000

npm start

Express คือ Frameworks สร้าง Web Applications สำหรับ Node js ซึ่งได้รับความนิยมเป็นอย่างมาก ทำให้เอกสารต่างๆก็มีเยอะมากด้วย expressjs.com

8. มาแก้ไขไฟล์ดูที่ /home/pi/myapp/views/index.ejs กดบันทึก จากนั้นไปที่ Teminal Ctrl+c เพื่อปิดโปรแกรม แล้วรันใหม่ ทดสอบบนบราวเซอร์ localhost:3000

9. Nodejs + Express พร้อมใช้งานเรามาดูโครงสร้างไฟล์กัน

การทำงานของไฟล์คร่าวๆ

• bin/www จะเป็นไฟล์ web server port 3000 
• app.js เป็นไฟล์แรกที่ถูกเรียก
• routes จะรับ request จากเว็บบราวเซอร์
• views จะ render html จาก routes
• public จะเป็นที่เก็บ static file เช่น image, ja, css เป็นต้น

วันนี้ขอจบเพียงเท่านี้ก่อนนะครับ โอกาสหน้าเรามาลงลึกเกี่ยวกับสร้างเว็บกัน

ติดตามพูดคุยได้ที่ facebook: Bulantech