لماذا نستخدم Express.js؟ التثبيت وإعداد أول خادم متطور

ماذا سنتعلم اليوم؟ سنستكشف لماذا Express.js هو الخيار الأمثل لبناء تطبيقات الويب، وسنبدأ رحلتنا بتثبيته وإعداد أول خادم Node.js متطور.

لماذا Express.js؟

Express.js هو إطار عمل (framework) خفيف ومرن لتطبيقات الويب لـ Node.js، يوفر مجموعة قوية من الميزات لإنشاء تطبيقات ويب وواجهات برمجة التطبيقات (APIs) بسهولة وسرعة. إنه يسهل التعامل مع التوجيه (routing)، ومعالجة الطلبات والاستجابات (request/response handling)، وإدارة الوسيطات (middleware)، مما يجعله حجر الزاوية في معظم مشاريع Node.js.

المتطلبات الأساسية

• Node.js و npm (مدير حزم Node) مثبتان على جهازك.

التثبيت وإعداد المشروع

لنبدأ بإنشاء مجلد جديد لمشروعنا وتهيئته، ثم نقوم بتثبيت Express.js.

1. إنشاء مجلد المشروع وتهيئته

   افتح سطر الأوامر (Terminal/CMD) وانتقل إلى المجلد الذي تريد إنشاء مشروعك فيه:

   mkdir my-express-app
   cd my-express-app
   npm init -y

   npm init -y يقوم بإنشاء ملف package.json تلقائياً بقيم افتراضية، وهو ضروري لإدارة تبعيات المشروع.

2. تثبيت Express.js

   الآن، سنقوم بتثبيت Express.js كاعتماد لمشروعنا:

   npm install express

   سيضيف هذا الأمر express إلى قائمة التبعيات في ملف package.json الخاص بك ويقوم بتنزيل الملفات اللازمة إلى مجلد node_modules.

بناء أول خادم Express.js

سنقوم بإنشاء ملف جديد باسم app.js (أو server.js) في مجلد مشروعك، ثم نضيف إليه الكود خطوة بخطوة.

1. الخطوة 1: استيراد Express وإنشاء التطبيق

   في ملف app.js، سنستورد مكتبة Express وننشئ مثيلاً لتطبيق Express.

   // استيراد مكتبة Express.js
   const express = require('express');
   // إنشاء مثيل لتطبيق Express
   const app = express();

   require('express') يجلب إطار العمل، و app = express() ينشئ كائناً يمثل تطبيق الويب الخاص بنا.

2. الخطوة 2: تحديد المنفذ ومسار الجذر (Root Route)

   سنحدد المنفذ الذي سيعمل عليه الخادم وننشئ أول مسار (route) يستقبل الطلبات على الجذر (/).

   // تحديد رقم المنفذ الذي سيستمع عليه الخادم
   const PORT = 3000;
   
   // تعريف مسار الجذر (root route) الذي يستقبل طلبات GET
   app.get('/', (req, res) => {
     // إرسال استجابة نصية إلى العميل
     res.send('مرحباً بك في خادم Express.js الأول!');
   });

   app.get('/', ...) هو معالج مسار يستجيب لطلبات GET على المسار /. الدالة (req, res) => { ... } هي دالة رد النداء التي تنفذ عند تلقي الطلب، حيث req يمثل كائن الطلب و res يمثل كائن الاستجابة.

3. الخطوة 3: تشغيل الخادم

   الآن، لنجعل الخادم يبدأ بالاستماع للطلبات على المنفذ المحدد.

   // جعل الخادم يستمع للطلبات على المنفذ المحدد
   app.listen(PORT, () => {
     // طباعة رسالة في الكونسول عند بدء تشغيل الخادم بنجاح
     console.log(<code dir="ltr" style="background:#f3f4f6; color:#0056b3; padding:2px 6px; border-radius:4px; font-family:monospace; direction:ltr !important; display:inline-block;">الخادم يعمل بنجاح على http://localhost:${PORT}</code>);
   });

   الدالة app.listen() تبدأ الخادم وتجعله يستمع للاتصالات الواردة على المنفذ. الدالة العائدة (callback function) تنفذ بعد أن يبدأ الخادم بالاستماع بنجاح.

الكود النهائي الكامل

هذا هو الكود الكامل لملف app.js:

// استيراد مكتبة Express.js
const express = require('express');
// إنشاء مثيل لتطبيق Express
const app = express();

// تحديد رقم المنفذ الذي سيستمع عليه الخادم
const PORT = 3000;

// تعريف مسار الجذر (root route) الذي يستقبل طلبات GET
app.get('/', (req, res) => {
  // إرسال استجابة نصية إلى العميل
  res.send('مرحباً بك في خادم Express.js الأول!');
});

// جعل الخادم يستمع للطلبات على المنفذ المحدد
app.listen(PORT, () => {
  // طباعة رسالة في الكونسول عند بدء تشغيل الخادم بنجاح
  console.log(<code dir="ltr" style="background:#f3f4f6; color:#0056b3; padding:2px 6px; border-radius:4px; font-family:monospace; direction:ltr !important; display:inline-block;">الخادم يعمل بنجاح على http://localhost:${PORT}</code>);
});

تشغيل الخادم

لحفظ الملف app.js في مجلد my-express-app، ثم قم بتشغيله باستخدام Node.js من سطر الأوامر:

node app.js

النتيجة المتوقعة

عند تشغيل الخادم، ستشاهد الرسالة التالية في سطر الأوامر:

الخادم يعمل بنجاح على http://localhost:3000

الآن، افتح متصفح الويب الخاص بك وانتقل إلى العنوان http://localhost:3000. ستشاهد النص التالي في المتصفح:

مرحباً بك في خادم Express.js الأول!

تهانينا! لقد قمت بتثبيت وإعداد وتشغيل أول خادم Express.js بنجاح.

← السابقالفهرسالتالي →