بيئة تطوير WordPress النهائية

على مدار العامين الماضيين ، قمت بكتابة الكثير من البرامج التعليمية هنا على مدونة WPMU DEV التي أشارك فيها الحكايات حول بيئات التطوير التي أستخدمها.

لذلك اليوم ، اعتقدت أن الوقت قد حان للمشاركة في بيئة كاملة ، من النوع الذي سأجمعه وأستخدمه للتطوير على نطاق أوسع.

شمر عن ساعديك واستعد لتتسخ يديك! لأنه يوجد أدناه شرح كامل لنوع بيئة التطوير التي أعددتها ، وكيف يمكنك القيام بذلك أيضًا.

ملاحظة: هذا البرنامج التعليمي ليس للمبتدئين. إذا كنت جديدًا في تطوير WordPress ، فلن تحتاج إلى بيئة معقدة لأنها قد تسبب تعقيدًا غير ضروري. لاحظ أيضًا أن هذه المقالة مخصصة خصيصًا لـ WordPress. قد تكون الأفكار والأهداف هي نفسها بالنسبة للمشاريع بخلاف WordPress ولكن النهج والأدوات المستخدمة قد تختلف.

جدول المحتويات

1. 1. ما الذي يصنع بيئة تطوير جيدة
   2. البيئات المتطورة
   3. الخوادم المحلية
   4. أدوات سطر الأوامر
   5. مخطوطات باش
   6. إضافات ووردبريس
   7. أدوات متنوعة

ما الذي يصنع بيئة تطوير جيدة؟

في رأيي ، تتمتع بيئة التطوير الجيدة بالخصائص الثلاث التالية:

1. محمولة للغاية
2. شكلي للغاية
3. مؤتمتة للغاية

قابلية التنقل

تعد قابلية النقل عاملاً مهمًا لأنه بالإضافة إلى مشاركة السمة / المكون الإضافي الذي أقوم بتطويره ، أريد أن أكون قادرًا على مشاركة بيئة التطوير أيضًا.

أريد أن يتمكن المطورون الآخرون من التحقق من المصدر من GitHub والبدء على الفور ، بما في ذلك استخدام أي أدوات مثل Gulp أو Grunt. هذا يجعل المشاريع من السهل القفز إليها ، وإذا كنت تدعم تعاونًا أفضل ، فلديك فرصة أكبر لإنجاح شيء ما.

يمكن أن تساعدك قابلية النقل أيضًا إذا كنت بحاجة إلى العمل على كمبيوتر آخر أو إذا كنت تريد أن تُظهر لزملائك ما كنت تنوي القيام به. ساعدتني القدرة على إعداد الأشياء في أي مكان في غضون بضع دقائق على مرات أكثر مما يمكنني الاعتماد عليه.

التكوين

القدرة على تكوين بيئتك أمر بالغ الأهمية. من جانب الخادم ، يعد WordPress متسامحًا للغاية ولكن القدرة على ضبط إعدادات الإنشاء ومهام Grunt والخيارات الأخرى يعد ميزة كبيرة.

تعني خيارات التكوين وإمكانية النقل معًا أنه يمكنك اختبار عملك بسهولة في ظل ظروف مختلفة. ماذا عن تبديل إصدار PHP أو حتى HHVM فقط للتأكد؟ ربما يمكنك التحقق من التوافق مع الإصدارات القديمة من WordPress والمكونات الإضافية الشائعة؟ هذه أشياء يجب أن تكون قادرًا على اختبارها.

أتمتة

الأتمتة هي أحد المحركات الرئيسية في إنشاء بيئة تطوير لعمل WordPress. لا أريد القلق بشأن البرامج النصية وأوراق الأنماط وحفظ عملي والنشر وما إلى ذلك.

تشكل أدوات سطر الأوامر العمود الفقري لمجموعة الأتمتة الخاصة بي ، والتي يمكنها فعل كل شيء بدءًا من إعداد WordPress بأمر واحد وحتى تغليف المنتج الخاص بي.

التقدم في العمل

قبل أن نتعمق في التفاصيل ، اعتقدت أنني سأخوض في فكرة عن كيفية حلم بيئات التطوير من قبل أولئك الذين يستخدمونها.

إذا كنت وافدًا جديدًا نسبيًا إلى عالم سطر الأوامر وأدوات الإنشاء وأنظمة التحكم في الإصدارات وما إلى ذلك ، فقد يبدو أنني محترف يعرف كل شيء ويستخدم الأدوات المثالية لكل مهمة.

هذا بعيد جدا عن الحقيقة! أنا على دراية جيدة بكل ما يتعلق بـ WordPress ، لكن كل شيء آخر هو مجرد بعض الأشياء الإضافية التي تناولتها أو أحتاجها / أردت تعلمها لجعل حياتي أسرع. لقد قمت بنسخ الآخرين ، واكتشفت أجزاء صغيرة بنفسي ، وقمت بتعديل الأشياء حسب الحاجة (أحيانًا أفشل فشلاً ذريعاً!).

بيئتي التطورية (وغيرها الكثير) هي مزيج مما يلي:

• معرفة شخصية متقنة
• نصائح عظيمة من الآخرين
• فقط بعض الأشياء العشوائية التي وجدتها تعمل
• الخطوات التي يمكن القيام بها بشكل أفضل ولكن لا يمكنني أن أزعج نفسي لمعرفة ذلك

بمعنى آخر: إنها ليست مثالية ولكنها تنجز المهمة. هناك مجال كبير للتحسين وأماكن لاستخدام أدوات أخرى قد تفضلها. إذا كنت تعرف المزيد من الأدوات المفيدة أو مهام سير العمل ، فلا تتردد في استخدامها واسمحوا لي أن أعرف في التعليقات!

خادم محلي

يعمل WordPress على PHP ، وهي لغة ترميز من جانب الخادم ، وبالتالي نحتاج إلى خادم لتشغيل WordPress. الخيارات الأكثر شيوعًا هي:

• المتشرد
• وامب
• XAMPP
• MAMP

بدأت مع XAMPP منذ سنوات وسنوات. انتقلت بعد ذلك إلى MAMP عندما أصبحت مستخدمًا لنظام Mac ثم انتقلت في النهاية إلى Vagrant منذ حوالي عامين. يتطور الويب والأدوات المستخدمة كما هو الحال دائمًا ، والآن أميل إلى استخدام Vagrant و MAMP أيضًا. سأشرح لماذا أدناه.

أمبير

يرمز "AMP" في MAMP و XAMPP و WAMP إلى Apache و MySQL و PHP. جميع هذه الأدوات تقوم بتثبيت الخدمات وواجهة المستخدم الرسومية (GUI) لمساعدتك في إدارة العمليات التي يستخدمها الخادم. يمكنك تنزيل التطبيق وتثبيته ، والضغط على زر "تشغيل" وسيعمل كل شيء كما هو متوقع.

الايجابيات:
إنه سريع وسهل وبديهي وسيعمل على جميع الأنظمة طوال الوقت. يحتوي على واجهة مستخدم رائعة ، والتي يمكنك استخدامها لتعديل إعدادات PHP ، والتبديل إلى Nginx ، وتكوين Memcached ، و Postfix ، وإعداد الخوادم الافتراضية ، والمزيد.

السلبيات:
في حين أن هناك العديد من الأشياء التي يمكنك تعديلها ، فإن التحكم محدود. لا يمكنك تغيير نظام التشغيل أو إجراء تغييرات أخرى يتيح لك الوصول الكامل عبر SSH القيام بها.

تفقد جميع AMPs إمكانية النقل للسبب نفسه. تحظى بشعبية كافية بحيث يمكن لأي شخص تثبيتها ، لكنها ليست قائمة بذاتها ولا تشبه تكوينات Vagrant.

المتشرد

Vagrant مختلف بعض الشيء. بدلاً من التغليف المسبق والبيئة المناسبة لك ، يمنحك التحكم الكامل. إنه مبني على VirtualBox (أو تطبيقات VM الأخرى) ويسمح لك بالحصول على "صندوق" ، وهو في الأساس نظام تشغيل. يمكنك بعد ذلك استخدام البرامج النصية لتكوين هذه البرامج بنفسك.

الايجابيات:
التهيئة قائمة بذاتها في ملفين صغيرين جدًا. إذا كنت معتادًا على سطر الأوامر ، فإن إعداد بيئة يمكن أن يكون بسيطًا مثل vagrant up - فالنظام قابل للنقل للغاية.

يمكنك تكوينه لمحتوى قلبك. أي نظام تشغيل ، أي برنامج ، من طرق التخزين المؤقت المختلفة إلى تجميع PHP الخاص بك. يمكنك نسخ بيئة مضيفك الفعلية بالضبط للتأكد من أن موقعك سيعمل بنفس الطريقة تمامًا على جهازك المحلي.

السلبيات:
إذا لم تكن على دراية بالسرعة في استخدام سطر الأوامر ، فيمكن أن يكون لدى Vagrant منحنى تعليمي حاد. عندما ينجح كل شيء في الإبحار السلس ، كل ما عليك فعله هو إصدار أمر واحد. إذا رفض شيء ما العمل ، لأي سبب من الأسباب ، ستجد نفسك في المياه العميقة.

توجد أدوات لإنشاء مضيفات افتراضية وأداء مهام شائعة أخرى ، تعد واجهة المستخدم الخاصة بـ MAMP أكثر ملاءمة ، على الأقل بالنسبة لي. إذا كنت بحاجة إلى مضيف افتراضي جديد سريع مع WP لتثبيته ، يمكنني القيام بذلك باستخدام MAMP + WP-CLI بشكل أسرع بكثير من Vagrant + WP-CLI.

أي واحد لاستخدام؟

إذا كنت تعمل حصريًا مع WordPress ، فإن أداة مثل MAMP توفر أكثر من المرونة والقوة الكافية. يتيح لك العمل مع مواقع بخلاف WordPress بالطبع ، لذلك إذا كانت لديك وظيفة غريبة تقع خارج نطاق WP ، فستظل MAMP تخدمك جيدًا.

إذا كنت تعمل مع فرق كبيرة في مشاريع غير تابعة لـ WP ، فإنني أوصي بالاستيلاء على Vagrant وتجربته. سيعلمك الكثير عن كيفية عمل الخوادم داخليًا ويسمح لك بمشاركة البيئات بالضبط.

أفضل استخدام كليهما. عندما أحتاج (أو لدي الوقت) ، يمكنني تهيئة بيئتي وصولاً إلى آخر التفاصيل باستخدام Vagrant. عندما أحتاج إلى شيء بسيط أو لمشروع WordPress ، فإن MAMP هو خياري المفضل.

كتبت راشيل ماكولين ، كاتبة أخرى هنا في WPMU DEV ، دليلًا رائعًا حول كيفية إعداد MAMP وساهمت بدليل لتطوير WordPress باستخدام Vagrant ، والذي يمكنك استخدامه لإعداد هذه البيئات.

أدوات سطر الأوامر

لا أستخدم عددًا كبيرًا من أدوات CLI ، لكن الأدوات التي أستخدمها تشكل جزءًا كبيرًا من سير العمل الخاص بي. أبرزها WP-CLI و Gulp و ngrok و Ultrahook دعنا ندخل في القليل من التفاصيل.

WP-CLI

WP-CLI هي أداة سطر أوامر قوية للغاية ، والتي تسمح لك بأتمتة كل شيء عن WordPress. لقد كتبت بالفعل برنامجًا تعليميًا حول تطوير WordPress المتقدم باستخدام WP-CLI ، لذا سأريكم بعضًا من السحر الذي يمكن أن يفعله.

إنشاء مواقع جديدة

يمكنك تنزيل WordPress وتكوينه وتثبيته في بعض الأوامر البسيطة مثل wp core download و wp core config . التوثيق وفير وسهل المتابعة.

أستخدم WP-CLI مع البرامج النصية bash لإنشاء قوالب صغيرة لإنشاء موقع جديد. يمكنك استخدام الأوامر لإزالة المكونات الإضافية والسمات الافتراضية وتنزيل المكونات الإضافية التي تستخدمها بانتظام وتنشيطها.

بحث واستبدال

هناك حاجة أحيانًا إلى البحث في قاعدة البيانات واستبدالها ولكن يمكن أن يكون ذلك أمرًا مزعجًا. التغيير إلى https ، والانتقال إلى مجال جديد ، وإعادة تسمية عناوين url ، ويمكن للآخرين أن يجلبوا معهم بعض التغييرات الجماعية.

نظرًا لأن قاعدة البيانات تحتوي على عدد من المصفوفات المتسلسلة ، فلا يمكنك فقط إجراء بحث في SQL واستبداله (ما لم تكن القيمة القديمة والجديدة بنفس الطول). wp search-replace oldval newvalue سيعمل على كل ذلك من أجلك ، مع إلغاء تسلسل المصفوفات الخاصة بك ثم إعادة تسلسلها.

الإدارة عن بعد

يحتوي WP-CLI على SSH مدمج لمساعدتك في إدارة المواقع عبر SSH. هذا لديه القدرة على السماح لك بإدارة مئات المواقع بأمر واحد (على سبيل المثال: تحديث سمة أو مكون إضافي عبر مواقع متعددة).

اكثر بكثير…

لا يوجد حد تقريبًا لما يمكنك فعله باستخدام WP-CLI. من حوالي 35 فئة أوامر مدمجة ، والتي تحتوي على مجموعة من الأوامر الفرعية إلى حزم الطرف الثالث ، يمكنك بسهولة أتمتة أي مهمة.

بلع

Gulp هو العمود الفقري الخاص بي. أستخدمه لإدارة البرامج النصية والأنماط والصور الخاصة بي وحتى اختبار الأجهزة المحمولة وآليات تحديث المتصفح. لقد كتبت مقالًا شاملاً حول استخدام Gulp مع WordPress ، ألق نظرة هناك للحصول على إرشادات مفصلة.

أنا أفضل Gulp على الخيار الشائع الآخر - Grunt - بسبب الاختلافات النحوية. ألقِ نظرة على مقالتي في Grunt For WordPress Development واتخذ قرارك بنفسك!

تستخدم Gulp حزم Node و Node لوظائفها ، مما يجعلها محمولة وقوية للغاية ، بسبب الامتدادات التي يقودها المجتمع. عادةً ما تتضمن عملية عملي مع Gulp ما يلي:

1. ابحث عن امتداد يناسب احتياجاتي
2. قم بتثبيت حزمة العقدة مع npm
3. طلب الحزمة في Gulpfile
4. اكتب مهمة أتمتة قصيرة

الجزء الوحيد من هذا الذي يتطلب أي تفكير على الإطلاق هو رقم أربعة. حتى مع ذلك ، تحتوي معظم الإضافات على أمثلة للصق النسخ والتي ربما تحتاج فقط إلى تعديل بسيط.

فيما يلي الإضافات التي أستخدمها أكثر من غيرها:

• gulp-sass لتجميع Sass إلى CSS
• gulp-clean-css لتصغير CSS
• gulp-autoprefixer لإضافة بادئات البائع تلقائيًا
• gulp-include لسلسلة ملفات JS
• gulp-uglify لتصغير ملفات JS
• gulp-imagemin لتحسين الصور
• Browsersync لإنشاء خوادم التطوير التي تساعد في اختبار الأجهزة المحمولة
• خرائط المصادر لإنشاء خرائط مصدر للملفات المصغرة

نجروك

ngrok هي خدمة صغيرة وأداة سطر أوامر أستخدمها لمشاركة عملي المحلي عبر الإنترنت. ينشئ ngrok أنفاقًا آمنة لبيئة محلية ، ويعرض التطبيق الخاص بك على عنوان URL خاص مثل http://7bbc49aa.ngrok.io .

Ultrahook

Ultrahook هو نوع من عكس ngrok. حيث يقوم ngrok بتوجيه مضيفك المحلي إلى الويب ، يقوم الخط الأخرق بتوجيه الويب إلى مضيفك المحلي. هذا مفيد للغاية لاختبار واجهات برمجة التطبيقات لجهات خارجية مثل Stripe على سبيل المثال.

يمكنك إعداد Stripe لإرسال خطافات الويب التجريبية http://stripe.danielpataki.ultrahook.com والتي سيتم تمريرها بشكل آمن إلى الخادم المحلي الخاص بك.

إضافات ووردبريس

بالنسبة لمعظمنا ، يعد تطوير WordPress مرادفًا لتطوير المكونات الإضافية والسمات. المستودع مليء بالمكونات الإضافية التي تساعد المطورين على إنشاء عمل أفضل بشكل أسرع. فيما يلي بعض الأشياء التي أستخدمها أو استخدمها بانتظام.

فحص الموضوع

مكون إضافي يجب استخدامه لمنشئي القوالب. سيقوم Theme Check بتحليل القالب الخاص بك وإيضاح أسباب عدم استيفائه لمعايير WordPress. إنه يبحث في التعليمات البرمجية المهملة والملفات الدخيلة والممارسات السيئة والأخطاء الشائعة وأطنان من المشكلات المحتملة الأخرى.

الحقول المخصصة المتقدمة

Advanced Custom Fields أو ACF هو البرنامج المساعد المفضل لدي طوال الوقت. يسمح للمطورين بإنشاء حقول مخصصة جميلة لموضوعاتهم ومكوناتهم الإضافية في واجهة مستخدم سهلة الاستخدام وسريعة. بمجرد الانتهاء من ذلك ، يمكنك إخفاء ACF تمامًا ولصق رمز PHP الذي تم إنشاؤه في عملك للحفاظ على الحقول سليمة. مكون إضافي جيد التنفيذ ومفيد للغاية!

مراقبة الاستعلام

يتيح لك Query Monitor رؤية ما يحدث بالضبط في بيئة WordPress الخاصة بك من وجهة نظر وصول قاعدة البيانات. يمكنك التعرف على الاستفسارات التي يحتمل أن تكون بطيئة أو زائدة عن الحاجة قبل طرحها في منتج مباشر وتحسين الاستفسارات الموجودة لجعل شفرتك أسرع بكثير.

مخطوطات باش

تحتوي نصوص Bash على مجموعة من الأوامر التي يتم تشغيلها واحدة تلو الأخرى ويمكن استخدامها لمزيد من أتمتة المهام. على سبيل المثال ، من السهل بالفعل تثبيت WordPress باستخدام WP-CLI. كل ما يتطلبه الأمر هو ما يلي:

يجب إصدار هذه الأوامر واحدة تلو الأخرى ، الأمر الذي يستغرق بعض الوقت. بوضع هذا في ملف ، دعنا نسميه install.sh ، يمكنك إنشاء قالب لإنشاء تثبيت WP.

ضع الملف في المجلد الذي تريد إنشاء التثبيت فيه واكتب bash install.sh . سيتم إصدار جميع الأوامر وفي غضون ثوانٍ قليلة سيكون لديك موقع جاهز للعمل.

من خلال إضافة المعلمات ، يمكنك جعلها أكثر فائدة. إذا قمت بإصدار الأمر مثل هذا: bash install.sh newsite يمكنك استخدام المعلمة لملء اسم قاعدة البيانات وعنوان URL وعنوان الموقع.

يمكن أن تكون ملفات Bash مفيدة أيضًا في إنشاء تصميمات نهائية (إزالة المجلدات والملفات الدخيلة ، ونقل الدلائل ، وما إلى ذلك) والمهام المماثلة الأخرى. يمكن تشغيلها حتى من مهام Gulp التي تمنحك الكثير من المرونة في سير عملك.

أدوات متنوعة

تعتبر ملحقات المستعرض مساعدة كبيرة عند اختبار الموقع. فيما يلي بعض الأشياء التي أستخدمها في سير العمل الخاص بي.

ساعي البريد

Postman هو امتداد كروم لبناء واختبار وتوثيق واجهات برمجة التطبيقات. أجد أنه كلما احتجت إلى إطلاق طلب سريع لمعرفة كيفية عمل واجهة برمجة التطبيقات ، يكون Postman أسرع بكثير من أي أداة أخرى.

القدرة على حفظ وإدارة الطلبات مفيدة بشكل خاص. اختبار API هو شيء أقوم به بشكل أقل تكرارًا ، ولكن عندما أتحرك إليه ، فإنه يستغرق معظم يومي ، باستخدام شيء مثل Postman يجعل حياتي أسهل كثيرًا.

تحرير هذا ملف تعريف الارتباط

يعد EditThisCookie مثالاً آخر على امتداد Chrome الذي لا أستخدمه كثيرًا ، ولكن عندما أفعل ذلك يوفر لي ساعات وساعات. يتيح لك رؤية / مسح / تحرير ملفات تعريف الارتباط الخاصة بالموقع الواحد. هذا كل شيء ، ولكن يا إلهي ، ما مدى سهولة ذلك!

وقت تحميل الصفحة

يقوم "وقت تحميل الصفحة" بما تعتقده ، فهو يحلل تحميل الصفحة. يمكن أن يدخل في تفاصيل مهمة مثل DNS / الطلب وأوقات الاستجابة ، ولكن ما يعجبني هو أنه يعرض وقت التحميل الإجمالي هناك في شريط الأدوات. سهل للغاية لإجراء مقارنات سريعة.

منسق JSON

إدخال ملحق المتصفح الأخير في فئة الأدوات المتنوعة هو JSON Formatter ، والذي يكتشف متى تكون الاستجابة مجرد سلسلة JSON وتنسيقها جميعًا بشكل جميل ومناسب بدلاً من مجرد حذف جزء من النص.

فرانز

هذا في الواقع لا علاقة له بالتنمية! Franz هي أداة يمكنها تجميع عدد من خدمات الويب تحت سقف واحد. تعمل تطبيقات My Messenger و Slack و Skype و Inbox by Gmail و Trello و Google Calendar و Todoist جميعها في نافذة واحدة بدلاً من تطبيقاتها الأصلية.

كل شيء يبدو تمامًا كما لو أنني قمت بتشغيلها في بيئاتها المعتادة ولكني لست بحاجة إلى كل هذه الرموز ويمكنني التبديل بينها بسهولة أكبر. أذكر فرانز لأنه ساعدني على التركيز أكثر مع التواصل بشكل أفضل أيضًا.

VVV

Varying Vagrant Vagrants أو VVV للاختصار هو تكوين Vagrant مفتوح المصدر لتطوير WordPress و WordPress نفسه. يحتوي على جميع الأدوات التي ستحتاجها للبدء ، بما في ذلك تصميمات تطوير WordPress.

اكثر بكثير!

هناك العديد من الأدوات التي لم أذكرها ، في الغالب لأنني ببساطة لا أستخدمها. إنها أدوات رائعة لكنني لم أتعرف عليها ، لست بحاجة إليها أو أنها لا تتناسب مع سير العمل الخاص بي. فيما يلي قائمة مختصرة ببعض العظمة التي يجب أن تلقي نظرة عليها:

• نقاط أساسية للحصول على نموذج معياري رائع تم إعداده بواسطة قسم قوالب WordPress
• الجذور لمجموعة WordPress كاملة بما في ذلك الخادم وإدارة التطبيقات وموضوع البداية. أجد هذا مفصلًا جدًا بالنسبة لذوقي ، لكنه قد يكون في زقاقك.
• WordPress Plugin Boilerplate لتطوير البرنامج المساعد المعياري الموجه للكائنات.

اجعل بيئة التطوير الخاصة بك خاصة بك

في الختام ، هذه هي الأدوات التي أستخدمها - قد لا تكون بالضرورة هي الأفضل بالنسبة لك ، كما أنها ليست الأنسب لكل موقف. هذا الإعداد مرن بما يكفي لاحتياجاتي ، لذا يرجى تخصيص الوقت للبحث عن الخيارات وإنشاء سير عمل يناسبك.

حظا طيبا وفقك الله!

• تطوير