الـ JSON والـ Env Vars: البيانات اللي تنتقل

الهدف

بنهاية الدرس تقدر تقرأ وتكتب تنسيق البيانات (JSON) بـ JSON.parse وـ JSON.stringify، وعندك MY_API_KEY ينقرا من .env.local في API route ويرجع في response — وما وصل لـ GitHub.

ليش هذا الحين؟

ترى كل شي في الـ web يتكلم JSON — responses من APIs، config files، بيانات بين services. لو ما تعرف تقراه وتكتبه، ما تقدر تتعامل مع أي API بدون مطور. ومتغيرات البيئة (env vars)؟ كل key سرية تكتبها مباشرة في الكود = خطر. GitHub مو مكان للأسرار.

الفكرة

JSON (JavaScript Object Notation) = أكثر لغة بيانات مستخدمة على الإنترنت.

تركيبته بسيطة وايد — ست أنواع بس:

{
  "name": "محمد",
  "age": 32,
  "active": true,
  "score": null,
  "tags": ["founder", "vibe-coder"],
  "address": {
    "city": "الكويت",
    "country": "KW"
  }
}

• كائن (Object): { "key": value } — مجموعة أزواج key-value
• مصفوفة (Array): [item1, item2] — قائمة
• نص (String): "نص" — دائما بين double quotes
• رقم (Number): 42 أو 3.14
• قيمة منطقية (Boolean): true أو false
• قيمة فارغة (Null): null

في JavaScript:

// من JSON string لـ object
const obj = JSON.parse('{"name": "محمد"}')
console.log(obj.name) // "محمد"

// من object لـ JSON string
const json = JSON.stringify({ city: "الكويت" })
console.log(json) // '{"city":"الكويت"}'

Environment Variables = config يتغير بين البيئات.

القاعدة: لو القيمة تتغير بين بيئة وثانية، أو لو هي سر — env var. مو ترميز ثابت (hardcode) في الكود.

MY_API_KEY=sk-abc123      ← في .env.local
process.env.MY_API_KEY    ← في الكود