Environment Variables และ dotenv

Environment Variables คือค่าที่ส่งจากสภาพแวดล้อมภายนอกเข้าสู่โปรแกรม เช่น URL ฐานข้อมูลหรือ Secret Key ส่วน dotenv ช่วยโหลดค่าเหล่านี้จากไฟล์ .env ระหว่างพัฒนา

Timeline/ประวัติศาสตร์

%%{init: {"theme": "base", "themeVariables": {"primaryColor": "#fabd2f", "primaryTextColor": "#282828", "primaryBorderColor": "#b57614", "lineColor": "#7c6f64", "secondaryColor": "#83a598", "tertiaryColor": "#b8bb26", "background": "#fbf1c7", "mainBkg": "#ebdbb2", "fontFamily": "Tahoma, sans-serif"}}}%%
flowchart LR
  subgraph Era1["ยุค Hardcode Config / In-code Secret"]
    A["DB_URL ใน source code
เสี่ยงรั่วไหล"] end subgraph Era2["ยุค Environment Config / Twelve-factor"] B["process.env
แยก config จาก code"] C["dotenv
โหลด .env ตอนพัฒนา"] end subgraph Era3["ยุค Multi Environment / Deployment"] D["development/staging/production
ค่าต่างตาม environment"] E["Secret Manager
จัดการ secret จริง"] end A --> B --> C --> D --> E

แนวคิดสำคัญ

ตารางไฟล์ Config

ไฟล์/ตัวแปร Commit ได้ไหม หน้าที่
.env ไม่ควร เก็บค่าจริงและ secret
.env.example ควร บอกว่าต้องมีตัวแปรใดบ้าง
.gitignore ควร ป้องกัน commit .env
process.env ไม่ใช่ไฟล์ อ่านค่าจาก environment

Mermaid Diagram: dotenv Flow

%%{init: {"theme": "base", "themeVariables": {"primaryColor": "#fabd2f", "primaryTextColor": "#282828", "primaryBorderColor": "#b57614", "lineColor": "#7c6f64", "secondaryColor": "#83a598", "tertiaryColor": "#b8bb26", "background": "#fbf1c7", "mainBkg": "#ebdbb2", "fontFamily": "Tahoma, sans-serif"}}}%%
flowchart TD
  A[".env
ค่าจริงในเครื่อง"] --> B["dotenv.config
โหลดค่า"] B --> C["process.env
ตัวแปร runtime"] C --> D["Node App
ใช้งาน config"] E[".env.example
template"] --> F["Developer
สร้าง .env เอง"] G[".gitignore
กัน secret หลุด"] --> A

Code Example

# .env
# ไฟล์นี้ห้าม commit เข้า Git
PORT=3000
DB_URL=mongodb://localhost:27017/course
JWT_SECRET=change-me-in-development
NODE_ENV=development
# .env.example
# ไฟล์ template สำหรับบอกตัวแปรที่ระบบต้องการ
PORT=
DB_URL=
JWT_SECRET=
NODE_ENV=
# .gitignore
node_modules
.env
// config-demo.mjs
// โหลด dotenv และอ่านค่าจาก process.env
import 'dotenv/config';
import express from 'express';

const app = express();
const port = process.env.PORT || 3000;

app.get('/health', (req, res) => {
  res.json({
    status: 'ok',
    env: process.env.NODE_ENV,
    hasDbUrl: Boolean(process.env.DB_URL)
  });
});

app.listen(port, () => {
  console.log(`Server running on port ${port}`);
});

// ตัวอย่างการใช้งาน:
// npm install express dotenv
// node config-demo.mjs
// เปิด http://localhost:3000/health

กิจกรรมท้ายบท

กลับสัปดาห์ที่ 10