Node.js & npm
รัน JavaScript ฝั่งเซิร์ฟเวอร์ และจัดการแพ็กเกจ
Node.js คืออะไร?
ตอนนี้คุณเขียน JS ในเบราว์เซอร์ (ฝั่ง Frontend) แต่ Node.js ทำให้เรารัน JS นอกเบราว์เซอร์ ได้ — คือฝั่ง Backend
นี่คือเหตุผลที่ JS เป็น Fullstack: ภาษาเดียว ใช้ได้ทั้งสองฝั่ง
💡 ถ้ายังไม่ได้ติดตั้ง กลับไปดูบท "ติดตั้งเครื่องมือ" ในพื้นฐาน ติดตั้งจาก https://nodejs.org
ตรวจสอบการติดตั้ง
node -v # เช่น v20.x.x
npm -v # เช่น 10.x.x
ถ้าเห็นเลขเวอร์ชัน แปลว่าพร้อมแล้ว
รันไฟล์ JS ด้วย Node
สร้างไฟล์ app.js:
console.log("รันบน Node.js!");
รันใน terminal:
node app.js
npm — ตลาดแพ็กเกจ
npm (Node Package Manager) คือระบบที่ให้เราใช้ โค้ดที่คนอื่นเขียนไว้แล้ว (เรียกว่า package/dependency) ไม่ต้องเขียนทุกอย่างเองจากศูนย์!
ตัวอย่างแพ็กเกจยอดนิยม:
express— สร้างเว็บเซิร์ฟเวอร์lodash— ฟังก์ชันช่วยเหลือทั่วไปaxios— เรียก API
เริ่มโปรเจกต์ใหม่
mkdir my-app
cd my-app
npm init -y
คำสั่ง npm init -y สร้างไฟล์ package.json (แบบค่าเริ่มต้น)
ไฟล์นี้เก็บ ข้อมูลโปรเจกต์ และ รายการแพ็กเกจที่ใช้
ติดตั้งแพ็กเกจ
npm install express
- npm จะดาวน์โหลด
expressมาเก็บในโฟลเดอร์node_modules/ - บันทึกใน
package.jsonที่ส่วนdependencies - สร้าง
package-lock.json(ล็อกเวอร์ชัน)
⚠️ อย่าเก็บโฟลเดอร์
node_modules/ใน Git! เพิ่มใน.gitignoreคนอื่นรับโค้ดไปแล้วรันnpm installใหม่ได้
ใช้แพ็กเกจในโค้ด: require / import
// CommonJS (เก่า แต่ใช้ได้ทั่วไป)
const express = require("express");
// ES Modules (ใหม่)
import express from "express";
ลองทำจริง: สร้างเซิร์ฟเวอร์ง่าย ๆ
mkdir hello-server
cd hello-server
npm init -y
npm install express
สร้างไฟล์ index.js:
const express = require("express");
const app = express();
app.get("/", (req, res) => {
res.send("สวัสดีจากเซิร์ฟเวอร์!");
});
app.listen(3000, () => {
console.log("เซิร์ฟเวอร์รันที่ http://localhost:3000");
});
รัน:
node index.js
เปิดเบราว์เซอร์ที่ http://localhost:3000 — เห็นข้อความ! 🎉
script ใน package.json
เพิ่มคำสั่งลัดใน package.json:
{
"scripts": {
"start": "node index.js",
"dev": "node --watch index.js"
}
}
รันด้วย:
npm start
npm run dev # รีสตาร์ทอัตโนมัติเมื่อแก้โค้ด
โครงสร้างโปรเจกต์ทั่วไป
my-app/
├── node_modules/ ← แพ็กเกจ (อย่าอัป Git)
├── package.json ← ข้อมูลโปรเจกต์ + dependencies
├── package-lock.json ← ล็อกเวอร์ชัน
├── .gitignore ← บอก Git ว่าไม่เอาอะไรบ้าง
└── index.js ← โค้ดของเรา
.gitignore ควรมี:
node_modules
.env
สรุป
| แนวคิด | สรุป |
|---|---|
| Node.js | รัน JS ฝั่งเซิร์ฟเวอร์ |
| npm | จัดการแพ็กเกจ |
npm init -y | สร้าง package.json |
npm install X | ติดตั้งแพ็กเกจ X |
package.json | ข้อมูล + dependencies |
node_modules/ | แพ็กเกจที่ติดตั้ง (ห้ามอัป Git) |
บทหน้า: ใช้ Express สร้าง REST API จริงจัง 🚀
อ่านจบแล้ว? ทำเครื่องหมายว่าเสร็จเพื่อบันทึกความคืบหน้า
แบบทดสอบ
ตอบให้ครบแล้วกด “ตรวจคำตอบ” เพื่อเช็คความเข้าใจ
1. Node.js คืออะไร?
2. npm ทำหน้าที่อะไร?
3. ไฟล์ที่เก็บรายการ dependencies ของโปรเจกต์คือ?
กำลังโหลด…