سأوجهك اليوم إلى أساسيات Node.js و NPM ، بما في ذلك تفسيرات حول كيفية التطوير للويب بشكل عام. مجرد ملاحظة مقدمًا: إذا كنت معتادًا على تطوير الويب الأساسي و NPM ، فيمكنك تخطي هذه المقالة ومعرفة المزيد حول NPX المفيد للغاية هنا.
حسنا عظيم! لنبدأ!
Node.js
إذا كنت تقرأ هذا ، فمن المحتمل أنك قمت بالفعل بتنزيل Node.js + NPM وبدأت بإدخال إصبع قدمك في مياه جافا سكريبت. ومع ذلك ، قد تبدو الخطوات الأولى مخيفة بالفعل: "أريد فقط كتابة برنامج صغير بجافا سكريبت ، لماذا أحتاج إلى كل الأشياء الأخرى؟". هذا أمر مفهوم ، لكنه ليس بالأمر المهم على الإطلاق.
لنبدأ من البداية: يمكنك ببساطة إنشاء ملف Javascript في كل مكان على جهاز الكمبيوتر الخاص بك ، المشار إليه بواسطة ".js’- اللاحقة. يمكن ملء هذا الملف بالكود بالطريقة التي تريدها ، ولكن هناك شيء واحد مفقود: كيف تقوم بالفعل بتشغيل برنامجك؟ وهنا يأتي دور Node.js.
Node.js هي بيئة تشغيل خاصة بجافا سكريبت. كما يوحي الوصف ، يمكن لـ Node تشغيل كود Javascript الخاص بك في بيئة معينة توفرها Node نفسها. العملية هي نفسها دائمًا: تبدأ أولاً Node.js ، وعندما يتم تشغيل Node (مما يعني أنه قد انتهى من البدء) ، يمكنك توفير كود Javascript الخاص بك.
هناك طريقتان يمكن من خلالهما تقديم جافا سكريبت الخاص بك إلى Node كمدخلات:
- مباشرة إلى عملية العقدة قيد التشغيل ، سطرًا بسطر ، لم يتم تضمين أي ملفات
- من خلال إخبار العقدة بأي ملف جافا سكريبت يجب تحميله ، دون أي إدخال سطر بسطر
node
سطر بسطر
بعد تثبيت Node.js بنجاح (والذي يقوم فقط بتنزيل + تشغيل المثبت ، والأوصاف موجودة على موقع Node على الويب) ، يمكنك بدء تشغيل Node.js من أي مكان في الجهاز الطرفي (macOS / Linux) أو PowerShell (Windows) . الأمر يشبه هذا.
أجل ، هذا كل شيء! لقد أطلقت للتو Node بنجاح! هل لاحظت مدى سرعة حدوث هذا؟ أحد الأسباب التي تجعل Node.js شائعًا للغاية هو على وجه التحديد بسبب تشغيله السريع (من بين أشياء أخرى).
الآن بعد أن تم تشغيل Node ، يمكننا تحديد تطبيق Javascript-app سطرًا بسطر. تتم معالجة كل مدخلات وتخزينها في الذاكرة. هنا مثال صغير.
(Hit enter after every line end)
const greet = (name) => console.log("Hello, " + name);
greet("Tom"); let x = 10; x = x + 5;
(enter the following line to terminate node)
.exit
الآن كل هذا جيد ورائع ، ولكن كتابة تطبيقات أكبر تتطلب منا مسودتها أولاً في الملفات قبل التغذية إلى Node. الفصل التالي من فضلك!
الإدخال عبر الملفات
في هذا المثال تحتاج إلى محرر نصوص. في الأساس ، يمكنك استخدام كل برنامج يمكنه التعامل مع النص (مثل TextEdit على macOS أو Editor على Windows). أوصي بـ VS Code مفتوح المصدر من Microsoft ، ولكن يمكنك اختيار ما يناسب بيئة العمل لديك بشكل أفضل.
لتقديم ملف كمدخلات ، سيتعين علينا فقط إنشاء واحد. ما عليك سوى إنشاء ملف نصي عادي مع إضافة "js" في اسمه. سنقوم بتسمية ملفنا app.js. افتح الآن موجه الأوامر الذي تختاره (المستخدم في مثالنا الأول). تأكد من فتحه من الدليل حيث تم حفظ الملف ، وهذا مهم.
إذا كنت تستخدم VS Code ، فيمكنك استخدام موجه الأوامر المدمج الخاص به ، فقط انقر بزر الماوس الأيمن في عرض Explorer الخاص بك وقم باستدعاء "Open in Code" (في Windows) أو قم بسحب وإسقاط الدليل الذي يحتوي على الملف الموجود على رمز VS Code في Dock (macOS). ثم يمكنك فتح المحطة الطرفية كما هو موضح هنا.
عندما تكون المحطة جاهزة ، فقط اكتب الأمر التالي.
node app.js
كما ترى ، حدثت بعض الأشياء:
- بدأت العقدة مباشرة ، مع عدم توفر مدخلات المستخدم
- قام Node بتشغيل ملفك بالكامل من أعلى إلى أسفل حتى يصل إلى نهايته
- تم إنهاء العقدة نفسها ، حيث أن نهاية الملف كانت تشير أيضًا إلى نهاية عمليتها
وللحصول على مقدمة أساسية عن Node.js ، هذا كل شيء! بمجرد تنزيل Node وتجربة استخدام موجه الأوامر لأول مرة لتشغيل تطبيق Javascript الخاص بك ، إما سطرًا بسطر أو من ملف ، فأنت رسميًا مطور جافا سكريبت! مرحبا في النادي!
سأوجهك الآن من خلال المفهوم الأساسي لـ NPM. بعد الفصل التالي ، سنلقي نظرة سريعة على العلاقة بين Node.js و NPM وتطوير الويب. إذا كنت ترغب في معرفة المزيد حول Node.js ، فيمكنك الاطلاع على قصصنا حول جافا سكريبت وسلاسل الأدوات وكل ما يتعلق بالشفرة هنا. لقد قمت أيضًا بربط بعض الموارد المفيدة في نهاية هذه المقالة لمزيد من الأشياء لتعلمها.
حسنًا ، لنحرك واحدًا!
NPM ، مدير حزمة العقدة
كما رأيت ، ليس من الصعب إدارة التعليمات البرمجية الخاصة بك. يمكن تخزين التطبيق في ملف ، التغييرات التي تطبقها تبقى فقط. ولكن ماذا لو كنت ترغب في استخدام رمز شخص آخر ، على سبيل المثال مكتبة تشفير أو مكتبة معالجة الصور؟ يجب عليك بطريقة ما وضع هذا الرمز بجوار الرمز الخاص بك ، وجعله قابلاً للاستخدام في تطبيقك والحفاظ على كل شيء قابلاً للإدارة.
تتمثل الطريقة الساذجة في تنزيل رمز خارجي مباشرةً من المصدر ، على سبيل المثال Github ، وانسخ المكتبة ، ملفًا بملف ، إلى مشروعك الخاص. لكن هذا يؤدي إلى بعض المشاكل:
- ما هي أفضل طريقة لتحديث هذا الرمز الخارجي؟ النسخ باليد ليس هو الحل الأفضل.
- كيف يمكنك تتبع كل التعليمات البرمجية الخارجية؟
- ماذا لو كانت هذه الشفرة الخارجية نفسها تعتمد على مكتبات لم يتم تثبيتها في مشروعك؟
يتم التعامل مع كل هذه التحديات بواسطة NPM ، مدير الحزم لـ Node.js. تتمثل مهمة مدير الحزم في الأساس في منحك حلاً قويًا حول كيفية إضافة وتتبع وإزالة الكود الخارجي ، المعروف أيضًا باسم التبعيات. فيما يلي بعض الأمثلة على NPM في العمل.
npm install serve-static npm remove serve-static
بطبيعة الحال ، يحتاج هذا المدير إلى بعض الملفات الخاصة نفسها لتتبع جميع التبعيات في مشروعك. لهذا السبب تحتوي التطبيقات التي تستخدم NPM على ملفين على الأقل: package.json وكذلك package-lock.json. يمكنك استدعاء الأمر التالي لإنشاء حزمة NPM جديدة بسرعة.
npm init -y
ملاحظة: كما رأينا في الجزء الأول من هذه المقالة ، ليست هناك حاجة إلى NPM لاستخدام Node.js أو Javascript. ينصب تركيزها على إدارة تبعياتك - لا أكثر ولا أقل. من خلال NPM ، يمكنك تنزيل الكود المنشور على npmjs.com. يتم تخزين كل هذه الوحدات الخارجية في مشروعك في دليل خاص يسمى node_modules. لن تضطر أبدًا إلى تغيير هذا الدليل ، حيث تتم إدارته بالكامل بواسطة NPM.
يمنحك package.json نظرة ثاقبة على التبعيات المستخدمة حاليًا في المشروع. package-lock.json هو ملف خاص يخزن بعض البيانات الوصفية حول الطفرات فيما يتعلق بملف package.json أو مجلد node_modules ويمكن تجاهله في الوقت الحالي.
أعتقد أنني سأختتم وصفي للمفهوم الأساسي لـ NPM ، وما يفعله وما هي الملفات / الأدلة التي ينشئها تلقائيًا. مزيد من المعلومات مرتبطة في نهاية المقال.
Arc to web dev
حسنًا ، أنت تعرف الآن أساسيات Node.js و NPM. ولكن لماذا تعتبر كل هذه الأشياء ضرورية لمعرفة ما إذا كنت تريد فقط البدء في إنشاء موقع الويب الحديث الخاص بك؟
كما رأينا للتو ، يتيح لنا NPM تنزيل التعليمات البرمجية من مجموعة كبيرة من المكتبات (الأكبر في الوجود ، على وجه الدقة). لتطوير الويب ، ستحتاج إلى خادم يمكنه استضافة (أي توفير) تطبيق الويب الخاص بك. هناك الكثير من الخدمات المتاحة حيث يمكنك تحميل مشروع موقع الويب الخاص بك واستخدام البنية التحتية الحالية ، بما في ذلك الخوادم ، لجعل موقع الويب متاحًا على الويب.
وللتنمية المحلية ، يلزم وجود خادم أيضًا لتحميل ملفاتك المحلية وإتاحتها لك فقط ، على جهازك ، أثناء التطوير. بفضل Node.js ، يمكنك فقط القيام بذلك: جعل موقع الويب الخاص بك متاحًا محليًا عبر ما يسمى المضيف المحلي. يحتوي Node.js على الأدوات اللازمة لتشغيل خادم محلي ، ولكن من خلال NPM ، يمكن إثراء التطبيق بمكونات تم اختبارها في المعركة والتي يمكن أن تساعدك في إنشاء خدمات كبيرة جدًا في فترة زمنية قصيرة.
بالطبع هذه مجرد البداية: تستضيف NPM الكثير من التعليمات البرمجية لإنشاء تطبيقات الويب الحديثة (المعروفة باسم PWA ، "تطبيق الويب التقدمي") بالإضافة إلى الخوادم المعقدة. لكن بالنسبة للمقدمة الأولى ، أعتقد أن هذا التفسير يجب أن يكون جيدًا.
آمل أن أتمكن من مساعدتك في التعامل مع Node.js و NPM. دائمًا ما تكون الخطوات الأولى هي الأصعب ، ولكن ستتم مكافأة الأيام الأولى من التطوير و (الكثير) من التعلم بتوسيع مهاراتك في تطوير تطبيقات الويب الحديثة ، مما يتيح لك بناء ما تريد.
