كيف تقوم بإعداد Mac الخاص بك لتطوير الويب

على الرغم من أنه يمكنك إنشاء مواقع ويب أساسية لا تحتوي على أكثر من محرر نصوص ومتصفح ، إلا أنك قد ترغب في رفع مستوى لعبتك عن طريق إضافة إطار JavaScript مثل React أو Vue وأدوات مفيدة مثل Git إلى سير عملك.

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

سترشدك هذه المقالة إلى الحد الأدنى من الإعداد الذي ستحتاج إلى تشغيله وتطوير الويب المستند إلى JavaScript على جهاز Mac.

لنذهب!

تحديث جهاز Mac الخاص بك

قبل تثبيت أي برنامج جديد ، اتبع هذه التعليمات من Apple لترقية نظام التشغيل MacOS والبرامج الحالية إلى أحدث إصدار.

اختيار تطبيق المحطة

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

أي مما يلي خيارات جيدة:

  • فرط
  • iTerm2
  • محطة Visual Studio Code المتكاملة
  • المحطة الطرفية (التطبيق الافتراضي الذي يأتي مع جهاز Mac الخاص بك)

إذا لم تكن متأكدًا من الشخص الذي يجب اختياره ، فاختر Hyper.

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

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

للتحقق مما إذا كانت الأدوات مثبتة بالفعل ، اكتب الأمر التالي في التطبيق الطرفي واضغط على زر الرجوع:

حدد رمز - الإصدار

إذا لم تكن النتيجة رقم إصدار ، فقم بتثبيت الأدوات باستخدام هذا الأمر:

حدد رمز - تثبيت

سيظهر مربع حوار يسألك عما إذا كنت ترغب في تثبيت الأدوات. انقر فوق تثبيت وستقوم الحزمة بتنزيل وتثبيت نفسها.

عند انتهاء التثبيت ، تأكد من تثبيت الأدوات الآن بإعادة تشغيل الأمر الأول:

حدد رمز - الإصدار

يجب أن تكون النتيجة الآن رقم إصدار.

البيرة

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

Homebrew هي أداة تتيح لك تثبيت وتحديث وإلغاء تثبيت البرنامج على جهاز Mac الخاص بك من سطر الأوامر. هذا هو أسرع وأكثر أمانًا من النهج اليدوي وعمومًا يجعل حياتك التطويرية أسهل.

أولاً ، تحقق مما إذا كان Homebrew مثبتًا بالفعل:

الشراب - الإصدار

إذا لم تشاهد رقم إصدار ، فقم بتثبيت Homebrew باستخدام هذا الأمر:

/ usr / bin / ruby ​​-e "$ (curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

أعدك أن هذا الأمر أغرب أمر ستراه في هذا المقال! بفضل Homebrew ، والباقي بسيط.

قبل الانتقال ، تأكد من تثبيت Homebrew الآن:

الشراب - الإصدار

العقدة و npm

Node.js هي أداة تسمح لنظام التشغيل Mac الخاص بك بتشغيل كود JavaScript خارج متصفح الويب. إذا كنت تريد تشغيل إطار JavaScript مثل React أو Vue على جهاز Mac ، فستحتاج إلى تثبيت العقدة.

يتضمن Node أيضًا npm (Node Package Manager) ، والذي يمنحك الوصول إلى مكتبة عملاقة من التعليمات البرمجية المجانية التي يمكنك تنزيلها واستخدامها في مشاريعك.

أولاً ، تحقق مما إذا كانت العقدة مثبتة بالفعل:

عقدة - الإصدار

إذا لم يكن كذلك ، فقم بتثبيته مع Homebrew:

الشراب تثبيت العقدة

أخيرًا ، تأكد من تثبيت العقدة و npm الآن:

عقدة - الإصدار
npm - الإصدار

التحكم في الإصدار مع بوابة

Git عبارة عن أداة تساعدك على تتبع التغييرات في التعليمات البرمجية الخاصة بك والعمل مع المطورين الآخرين في المشاريع المشتركة.

يعد استخدام Git على كل مشروع عادةً رائعة للتطوير وسيعدك للمشاريع المستقبلية حيث قد تكون Git مطلوبة. تعتمد بعض الأدوات (مثل GatsbyJS) أيضًا على تثبيت Git على جهاز Mac ، لذلك ستحتاج إليها حتى إذا كنت لا تخطط لإضافتها إلى سير عملك.

مرة أخرى ، ابدأ بالتحقق مما إذا كان Git مثبتًا بالفعل:

بوابة - الإصدار

إذا لم يكن كذلك ، فقم بتثبيته:

الشراب تثبيت بوابة

وتأكيد عمل التثبيت:

بوابة - الإصدار

من حين إلى آخر ، قم بتشغيل الأمر التالي وسيتم تحديث كل شيء قمت بتثبيته باستخدام Homebrew تلقائيًا:

تحديث المشروب && المشروب الترقية && المشروب تنظيف && المشروب الطبيب

هذا الأمر هو كل ما تحتاجه للحفاظ على تحديث نظامك

عادةً ما أديره عندما أبدأ مشروعًا جديدًا ، لكن لا تتردد في القيام بذلك وقتما تشاء. (عند تشغيل هذا الأمر ، إذا كان Homebrew يقترح أوامر إضافية لتشغيلها ، فقم بالمضي قدمًا وتشغيلها. إذا كان الأمر يبدأ بـ sudo وتمت مطالبتك بكلمة مرور ، فاستخدم كلمة مرور مسؤول جهاز Mac).

هذا كل شيء لسطر الأوامر!

محرر الكود

على الرغم من أنه يمكنك كتابة التعليمات البرمجية في أي محرر نصوص ، إلا أن استخدام محرر يبرز الرمز ويثبته سيؤدي إلى تسهيل حياتك.

أي مما يلي خيارات جيدة:

  • مرئي ستوديو كود
  • ذرة
  • نص سامية

إذا كنت بدأت للتو ، فاختر Visual Studio Code.

المتصفح

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

أي من الخيارات التالية هي خيارات جيدة:

  • كروم
  • ثعلب النار

إذا كنت بدأت للتو ، فاختر Chrome.

مكتشف

نصيحة سريعة هنا: ستحتاج إلى إظهار الملفات التي يخفيها جهاز Mac افتراضيًا. (على سبيل المثال ، يتم إخفاء ملفات git تلقائيًا ، ولكن في بعض الأحيان قد ترغب في تحريرها.)

أسهل طريقة لإظهار ملفات Mac المخفية هي اختصار لوحة المفاتيح ⌘⇧. (القيادة + التحول + الفترة). هذا سوف يتناوب بين إظهار وإخفاء هذه الملفات حتى تتمكن من الوصول إليها عند الحاجة إليها.

خاتمة

أنت جاهز تمامًا!

هذا هو كل ما تحتاجه للاستمرار في العمل مع تطوير الواجهة الأمامية المستندة إلى JavaScript على جهاز Mac.

لمنع حدوث أي تشويش ، تركت أي عناصر غير مطلوبة بشكل صارم. إذا كنت ترغب في الغوص بشكل أعمق في طرق اختيارية يمكنك تخصيص جهاز Mac الخاص بك لتطوير الويب ، تحقق من الروابط أدناه.

قراءة متعمقة

  • إعداد Mac جديدًا للتطوير من قِبل Tania Rascia
  • إعداد MacBook for Front-End Development by Ben Honeywill
  • مغادرة المنزل: العثور على أفضل بيئة تطوير محلية شاملة بواسطة WebDevStudios (في حالة احتياجك لإعداد PHP أيضًا)

ناقش على Twitter

نشرت أصلا على michaeluloth.com