رحلتي لأصبح مطور ويب من البداية بدون درجة علوم الكمبيوتر (وما تعلمته من ...

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

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

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

أعلم أن هناك الكثير من المقالات مثل هذا ، ولكن ليس الكثير منهم يناقش العملية مع الاستفادة من عامين إضافيين من الإدراك المتأخر.

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

لذلك ، دون أي مزيد من اللغط ، فلنبدأ!

الحصول على الأساسيات

بعد أن قررت أنني أردت الدخول في تطوير الويب ، كان السؤال الأول في ذهني "ماذا أتعلم؟" بعد إجراء بعض الأبحاث ، انتهى بي الأمر إلى اتخاذ مسار تعليمي بناءً على ما تطلبه معظم وظائف مطوري الويب للمبتدئين ، وهو:

  • جافا سكريبت
  • HTML و CSS
  • معالجات CSS الأولية (Less & Sass)
  • الرسم المتجاوب
  • أنجولار جي إس
  • أنماط التصميم
  • شخص سخيف
  • NodeJS
  • العدائين المهام

إليك كيف سارت الأمور.

جافا سكريبت

لقد بدأت رحلتي في تعلم JavaScript من خلال CodeSchool(مدفوعة) و Codecademy(مجانا). إذا كنت لا تعرف عن هذه المواقع ، فهي مواقع رائعة تتيح لك تعلم البرمجة عن طريق الترميز داخل المتصفح.

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

بمجرد أن أتخلص من الأساسيات ، شرعت في الحصول على أساس أقوى لجافا سكريبت من خلال قراءة Eloquent Javascript: A Modern Introduction to Programming book by Haverbeke (مجانًا).

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

يمكنك أيضًا أن تتعلم jQuery اختياريًا (على الرغم من أنني لا أوصي بتعلمها بعد - المزيد حول هذا لاحقًا). يمكنك تعلمها من خلال دورة جرب jQuery من CodeSchool.

HTML و CSS

بعد تعلم JavaScript ، شرعت في تعلم أساسيات HTML و CSS وتصميم الويب من خلال مسار تعلم HTML & CSS في CodeSchool. لا تزال هذه الدورات هي المفضلة لدي اليوم ، نظرًا لأن السرعة كبيرة ، وقد سمح لي النطاق العام لما تغطيه بالحصول على أساس أقوى لهذا.

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

المكافأة : إذا كان بإمكانك الحصول على يديك على HTML و CSS لجون دوكيت : تصميم وبناء مواقع الويبالكتاب ، فهو أيضًا نقطة انطلاق صلبة لتعلم HTML و CSS (مع القليل من تصميم الويب). إنه مصنف بدرجة عالية (4.7 / 5 على Amazon) ، ويوفر مقدمة قوية لعالم تطوير الويب. إنه كتاب جميل بفضل تصميمه النظيف بأحرف كبيرة وصفحات ملونة. غالبًا ما أعود إليها لمجرد الإعجاب بها.

أقل / ساس

بالنسبة لأولئك غير المألوفين ، فإن Less & Sass عبارة عن محولات CSS تسمح لك بكتابة CSS بطريقة أكثر أناقة. يتيح لك ذلك القيام بأشياء لا يتم دعمها عادةً ، مثل دمج قواعد CSS. بمجرد الانتهاء ، تقوم محولات CSS هذه "بترجمة" شفرتك وتحويلها إلى CSS عادي.

يوجد الآن اثنان من محولات CSS الرئيسية: Less and Sass . Sass هو الأكثر شيوعًا ، لكنني وجدت أن تعلم أقل أولاً ليكون أسهل ، وذلك أساسًا لأن استخدام Sass على جهاز الكمبيوتر الخاص بك يتطلب أيضًا تثبيت Ruby ، ​​وهو ما لم أكن مغرمًا به.

يمكنك الحصول على نظرة عامة سريعة وكاملة على Less باستخدام WinLess's Online Less Compiler وأمثلة الكود لمعرفة كيف سيتحول رمز Less إلى CSS. يمكنك أيضًا تجربة Sass عبر الإنترنت باستخدام SassMeister (على الرغم من أن هذا لا يشمل أمثلة التعليمات البرمجية).

لا يهم ما إذا كنت تتعلم أقل أو ساس أولاً. إنهما متشابهان للغاية ، لذا بمجرد أن تعرف أحدهما ، ستعرف الآخر تمامًا. يمكنك العثور على مقارنة سريعة رائعة بين Less و Sass على مقالة Shelby Moulden مقارنة بين LESS و SASS.

الرسم المتجاوب

لقد تعلمت في الأصل عن التصميم المتجاوب و Bootstrap باستخدام مسار HTML & CSS الخاص بـ Codeschool ، لكنني وجدت مؤخرًا دورة Udacity بواسطة Google حول أساسيات تصميم الويب المتجاوب لتكون رائعة في تغطية الأساسيات وما بعدها بطريقة أكثر اكتمالاً بكثير مما فعلت Codeschool.

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

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

أنجولار جي إس

لم أكن أعرف حقًا ما هو AngularJS بالضبط في ذلك الوقت ، لكنني كنت أعرف أن الجميع كان يتحدث عن ذلك ، وإذا أردت أن أصبح مطور ويب ، فأنا بحاجة إلى تعلمه. لقد وجدت Google Developers Design Decisions في AngularJS لتقديم أفضل نظرة عامة عامة على ماهية AngularJS وكيف تحسنت صنع تطبيقات الويب.

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

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

بعد بعض البحث في المنتديات ، عثرت على Egghead.io(مجاني / مدفوع) حيث كان حظي أفضل بكثير. كانت مواد الدورة التدريبية الخاصة بهم أكثر نظافة وإيجازًا واكتمالًا ، مما جعل تجربة أفضل بكثير. ناهيك عن أنه بصرف النظر عن دوراتهم ، فإن لديهم دروسًا صغيرة مدتها 2-5 دقائق تغطي موضوعات مهمة. (على سبيل المثال: ما هي وحدة التحكم؟ ما هو المرشح؟ ما هو نطاق $؟) هذه تجعل من السهل حقًا فهم الأساسيات. لديهم أيضًا بعض مقاطع الفيديو التي تتطلب الدفع ، ولكنها عادةً ما تكون تلك التي تغطي مواضيع زاوية أكثر تقدمًا لن تحتاجها إلا في وقت لاحق. أخذت دورة أساسيات AngularJS الخاصة بهم وكنت راضيًا تمامًا عن النتائج (وأصبحت أيضًا من أشد المعجبين بدورات Egghead.io في هذه العملية).

أنماط التصميم

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

لقد وجدت أفضل مصدرين لتعلم ذلك هما أنماط تصميم جافا سكريبت من doFactory وأنماط تصميم جافا سكريبت التعليمية من Addy Osmani. لقد وجدت أن مفهوم doFactory أسهل كثيرًا في الفهم ، بينما كان كتاب Addy Osmani أكثر اكتمالًا.

Chrome DevTools

يعد Chrome أحد أقوى الأدوات لمطور الويب. كلما تمكنت من إتقانها بشكل أسرع ، زاد الوقت الذي يمكنك توفيره لاحقًا. تقوم دورة Codeschool المجانية Explore and Master Chrome DevTools بعمل رائع في تقديمهم.

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

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

لقد وجدت أن دورة جيثب المجانية من CodeSchool طريقة سهلة للبدء. كان تدريب Atlassian's Git رائعًا في تغطية الأوامر الأكثر تقدمًا المتاحة. يعد Git Learning Path الخاص بـ Codeschool رائعًا أيضًا في تغطية أساسيات Git.

NodeJS

لم يمض وقت طويل قبل أن أعلم أن امتلاك فهم أساسي لـ NodeJS سيساعدني كثيرًا في سعيي لأن أصبح مطور ويب (المزيد حول هذا قريبًا).

جربت دورات Codeschool على Node ، لكنني وجدت أنها تفتقر إلى المحتوى حقًا. لقد وجدت أن NodeSchool.io هو مدرس أفضل بكثير في فهم الأساسيات بشكل صحيح ، وكان الأمر ممتعًا! لقد أحببت النهج العملي الذي قدمته ، والذي كان مشابهًا لـ Codeschool و Codecademy - مع التحسين الإضافي الذي كنت أديره بالفعل NodeJS.

متسابقو المهام (Grunt & Gulp)

كان Grunt و Gulp مفاجأة كبيرة بالنسبة لي لأنه لم يكن لدي أي فكرة عن وجود أدوات مثل هذه - لكنني سعيد للغاية بوجودها! بشكل أساسي ، يتيح لك عداء المهام هذه أتمتة المهام الشائعة. على سبيل المثال ، تذكر Less / Sass؟ عادةً ما يتعين عليك تشغيل مترجم CSS يدويًا في كل مرة تقوم فيها بإجراء تعديل عليه لتجميع CSS ، ثم تحديث المتصفح. باستخدام عداء المهام ، يمكنك إعداده لمشاهدة التغييرات في ملفات Less / Sass الخاصة بك ، وعندما يكتشف تغييرًا ، قم بتجميع CSS ، وتحديث المتصفح تلقائيًا. هذا مفيد للغاية في تقليل وقت التطوير.

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

ستساعدك معرفة NodeJS على كتابة ملفات Grunt و Gulp بشكل أفضل نظرًا لأن كلاهما يعمل على NodeJS . يمكنك اختيار ما تريد ، لكنني وجدت أن تعلم وكتابة Gulp أسهل بكثير. ما زلت أفضلها حتى اليوم بسبب أسلوبها البسيط - والقوي - القائم على الأنابيب.

لقد وجدت دورات Scotch.io في Grunt و Gulp من بين الأفضل على الإطلاق.

التحديات التي واجهتها في وظيفتي الأولى

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

يجب أن أقول ، لقد كنت متوترة للغاية في مشروعي الأول. تضمن إنشاء مكونات ويب قابلة لإعادة الاستخدام باستخدام HTML و CSS و JavaScript ، إلى جانب Bootstrap و Sass و Grunt كأداة. تي

أكبر خطأين وجدتهما في البداية هما:

  1. الخوف من الفشل. نظرًا لأنني كنت الرجل الجديد ، كنت دائمًا أخاف من أن تكون التعليمات البرمجية الخاصة بي خاطئة أو سيئة الصنع ، لذلك قضيت الكثير من الوقت في التحقق من كل شيء والتزمت بأفضل ممارسات الترميز. لهذا السبب ، نادرًا ما حاولت الحلول بطرق إبداعية جديدة بسبب خوفي من أنها قد لا تعمل بشكل صحيح في النهاية. يؤدي هذا بشكل فعال إلى إيقاف محركي لتعلم أشياء جديدة.
  2. القيام بالأشياء لأن الشخص "X" الذي يعرف أفضل مني قال ذلك. لقد فعلت هذا كثيرا في البداية. على الرغم من أنه ليس خاطئًا تمامًا ، فإن القيام بالأشياء بطريقة معينة فقط لأن خبير "X" في الأمر قال ذلك - دون معرفة السبب - يقودني حقًا إلى عدم معرفة متى ولماذا تم تنفيذ الأشياء بالطريقة التي كانت عليها. سرعان ما علمت أن هناك استثناءات لكل شيء ، وأنه يجب عليك دائمًا معرفة السبب وراء أفضل الممارسات.

لحسن الحظ ، كان لديّ قائد فريق متفهم خلال مشروعي الأول الذي ساعدني في التغلب على هذه المشكلات. لقد دفعني باستمرار لتجربة أشياء جديدة ، حتى لو ساءت الأمور في بعض الأحيان. أخبرني أيضًا أن أتساءل عن كل شيء - حتى تعاليمه.

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

شكّل استخدام AngularJS في مشروع فعلي أيضًا تحديًا كبيرًا بالنسبة لي. كان هذا أساسًا لأنني فعلت الكثير من الأشياء به ، دون أن أفهم تمامًا سبب حدوثها. فكرت في الأمر على أنه "سحر زاوي".

كانت هناك عدة مرات تمنيت لو كنت أعرف كيف يعمل Angular بالفعل ، لكن كان الأمر مخيفًا عند النظر إلى الوثائق.

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

التحدي الآخر الذي واجهته بعد عام كان مدى سرعة تقدم تطوير الويب. كنت قد أتقنت لتوي AngularJS و Grunt ، وكنت أشعر بالفخر والقوة - فقط لأكتشف قريبًا أن Gulp و ReactJS كانا في الأفق. وبعد عام بعد تعلمهم ، بدأت Webpack في اكتساب المزيد من التقدم ، وكان علي أن أتعلم ذلك أيضًا. كما يمكنك أن تتخيل ، شعر جزء كبير مني بخيبة أمل كبيرة بسبب السرعة التي أصبحت بها بعض معرفتي قديمة. لكن سرعان ما ساعدني أحد زملائي في العمل من خلال إخباري بشيء غيّر طريقة رؤيتي للمكتبات والأطر إلى الأبد:

"المكتبات وأطر العمل قد تصبح قديمة ، ولكن المفاهيم والحلول التي تقترحها غالبًا ما تصمد أمام اختبار الزمن."

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

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

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

ليس من غير المألوف رؤية الناس ينتقدون الوتيرة السريعة غير الطبيعية لتطور تقنيات الويب ، أو كيف تظهر مكتبة أو إطار عمل JavaScript جديد كل يوم تقريبًا. لكن مع الوقت رأيت النور وفهمت أخيرًا:

لست مضطرًا لتعلم كل مكتبة أو إطار عمل جديد يتم طرحه.

غالبًا ما تكون فكرة رائعة أن تقوم بتطبيق مثال بسيط على تطبيق hello world حتى تتمكن من رؤية ما يقدمه إطار العمل. ثم يمكنك المضي قدما. لكن عادة ، يجب أن تحاول التركيز على ما يناسب احتياجات مشروعك. قد يكون هذا صعبًا في البداية ، ولكن لحسن الحظ توجد أماكن رائعة مثل Stack Overflow و Medium و Reddit حيث يمكنك العثور على مناقشات مفيدة بين الأطر ، ومعرفة أي منها يناسب حالات الاستخدام الخاصة بك بشكل أفضل.

الذهاب أبعد

في السنوات القادمة ، شرعت في التحسين المستمر بالطرق التالية

جافا سكريبت

بمجرد الانتهاء من Eloquent JavaScript ، من السهل أن تقول وتشعر أنك أتقنت JavaScript ، ولكن بعد ذلك تأتي You Don't Know JS وهي تدمرك تمامًا (أو على الأقل فعلت ذلك بي). تم ذكر سلسلة الكتب هذه (مجانًا بالمناسبة) عدة مرات من قبل عدد قليل من كبار مطوري الويب في المكتب ككتاب يجب قراءته ، وحتى أقوم بقراءته يمكنني القول أنني أعرف JavaScript تمامًا. لقد كانوا على حق ، نظرًا لأن صفحة بعد صفحة ، فقد أذهلتني باستمرار حول مدى تعقيد JavaScript حقًا ، بالإضافة إلى العديد من المزالق الشائعة غير المتمرسين وذوي الخبرة الذين لا يمتلكون فهمًا مناسبًا لـ JavaScript.

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

  • JavaScript ، The Better Parts: حديث مذهل لد. Crockford يتحدث عن أكبر نقاط ضعف JavaScript ، وهي "Foot Guns" وكيفية استخدامها كنقاط قوتها.
  • الركائز الأساسية لجافا سكريبت: مقالة قوية بقلم إريك إليوت كاتب جافا سكريبت المتوسط ​​الذي يتحدث عن الركيزتين الرئيسيتين لجافا سكريبت: الوراثة النموذجية والبرمجة الوظيفية

بمجرد أن يكون لديك فهم عميق لجافا سكريبت ، تابع مع ECMASCript 2015 (المعروف أيضًا باسم ES6) ، أحدث معايير JavaScript والحالية. مقالة مجلة Smashing ECMAScript 6 (ES6): ما الجديد في الإصدار التالي من JavaScript هو مراجعة قصيرة رائعة لما هو جديد في ES6. يمكنك تجربة ES6 في المتصفح باستخدام مترجم Babel عبر الإنترنت.

CSS

يمكن أن تصبح CSS فوضوية وغير منظمة بسرعة كبيرة جدًا. كان هناك عدد غير قليل من المنهجيات المختلفة المقترحة لكتابة CSS أنظف ، ولكن هناك طريقتان بارزتان أوصي بشدة بقراءتهما عن ASAP للبقاء في المنافسة:

  • SMACSS: بنية قابلة للتطوير والوحدات لـ CSS. دليل مرن لتطوير المواقع الصغيرة والكبيرة.
  • BEM: منهجية تساعدك على تحقيق مكونات قابلة لإعادة الاستخدام ومشاركة التعليمات البرمجية في الواجهة الأمامية.

أنا شخصياً أفضل SMACSS بسبب مظهره الأنظف ، لكن بعض الشركات وأطر CSS لا تزال تستخدم BEM ، لذا من المفيد معرفة كليهما.

يجب أيضًا أن تبدأ في التركيز على أداء CSS الخاص بك. قامت مقالة مجلة Smashing Magazine Managing Mobile Performance Optimization ومقال HTML5 Rocks بالرسوم المتحركة عالية الأداء بعمل قوي في توفير السبق في هذا الأمر. يجب أن تمنحك القراءة السريعة لكلا المادتين أساسًا متينًا.

حزم جافا سكريبت

الآن يجب أن يكون لديك فهم قوي لـ Grunt أو Gulp. تتمثل الخطوة التالية في إضافة مُجمِع JavaScript إلى عداء المهام ، مما سيسمح بتنظيم أكثر نمطية لتطبيق JavaScript.

أكبر لاعبين الآن هما:

  • Browserify: يتيح لك طلب وحدات في المتصفح من خلال تجميع كل التبعيات الخاصة بك.
  • حزمة الويب: تتصفح بشكل أساسي باستخدام المنشطات. من الصعب تكوينها وإعدادها.

يمكن أن توفر لك الدورة التدريبية المصغرة الخاصة بـ Scotch.io بدء استخدام Browserify بداية سريعة مع المتصفح ، بينما مقال ديفيد فوكس باول لماذا لا يستطيع أي شخص كتابة برنامج تعليمي بسيط على Webpack؟ هي رائعة وممتعة لقراءة مقدمة إلى webpack.

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

ReactJS

ReactJS تكتسب شعبية بسرعة ، ولا يبدو أنها تتباطأ - لدرجة أن الناس يسألون "هل React تقتل Angular؟"

React.js التعلم الخاص بـ Scotch.io: الخطوات الأولى والمفاهيم يوفر نظرة عامة قوية عن React. بمجرد الانتهاء من ذلك ، تابع دورة Egghead.io حول أساسيات React حيث ستنشئ تطبيق ReactJS يعمل بكامل طاقته ثم تقوم بترحيله إلى بناء جملة ES6. يمكنك المتابعة بوثائق ReactJS الرسمية المصممة جيدًا وستتيح لك إتقانها بالكامل.

نظرًا لأن React هي العرض فقط ، فمن المستحسن أن تتعلم Redux. معظم الدورات التدريبية على Redux معقدة بعض الشيء في رأيي ، لكن CSS Tricks Leveling Up with React: Redux تحقق توازنًا رائعًا بين البساطة وكونها مفيدة عند البدء في Redux.

ربما تكون قد سمعت أيضًا عن Flux في هذه المرحلة ، ولكن إذا كنت تتساءل عن سبب استخدامك Redux over Flux ، فراجع السؤال على Stack Overflow لماذا تستخدم Redux عبر Facebook Flux؟ الذي أجاب عليه مبتكر Redux!

بالنظر إلى أخطائي وما تعلمته

لقد ارتكبت الكثير من الأخطاء خلال عامين من تعلم تطوير الويب. بشكل عام ، أعتقد أن خطئي الأكبر كان عدم إتقان الأساسيات قبل الانتقال إلى المكتبات والأطر. أعتقد أن هذا ينطبق على كل لغة برمجة تقريبًا ، لكنه في رأيي ينطبق أكثر على JavaScript. هذا لأنه من نواحٍ عديدة ، تعد JavaScript لغة مكسورة وتحتوي على الكثير من "Foot Guns" (كان يجب أن تسمع بهذا إذا شاهدت حديث D. Crockford عن "JavaScript ، الأجزاء الأفضل" التي ذكرتها سابقًا) هذه يمكن أن تجعل الحياة صعبة بشكل لا يطاق إذا لم تفهمها بالكامل.

أتذكر ذات مرة أنني علقت في مشكلة AngularJS بنطاق $ والتي استغرقت 3 أيام لتصحيح الأخطاء ، فقط لأجد أنها لم تكن مشكلة AngularJS ، ولكن مشكلة JavaScript سببتها لنفسي بسبب فشلي في فهم كيفية عمل ذلك .

كود نظيف

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

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

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

مسج

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

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

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

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

منذ ذلك الحين ، حاولت جاهدًا عدم استخدام jQuery ما لم يكن ذلك ضروريًا للغاية ويوفر حقًا تحسينًا كبيرًا في الكفاءة وسهولة القراءة لقاعدة الرموز الخاصة بنا (على سبيل المثال ، التلاعب الثقيل في DOM).

مرة أخرى ، لا تفهموني خطأ ، فإن jQuery رائع ، ولكن إذا كان بإمكاني العودة في الوقت المناسب والتعرف على ذاتي السابقة التي كانت مجرد تعلم تطوير الويب ، فإنني أنصح نفسي بشدة بعدم تعلم jQuery تمامًا حتى أتعلم كيف لفعل الأشياء بدونها. إذا كنت تواجه مشكلة في إجراء التبديل كما فعلت أنا ، فراجع You Might Not Need jQuery.

الدورات

أما بالنسبة لمواد الدورة ؛ في حين أن الكثير من دورات CodeSchool كانت رائعة (كان فرع HTML & CSS رائعًا بشكل خاص) ، حتى لو كان عدد قليل من دوراتهم التدريبية في أطر العمل ثابتة قليلاً (AngularJS ، BackboneJS ، إلخ).

لقد أخذت أيضًا الكثير من دورات Pluralsight ، والتي لم أذكرها لأنني بعد كل هذا الوقت ، توصلت إلى استنتاج مفاده أن اختيار مسار التعلم هو فكرة سيئة بشكل عام وغير موثوقة . نظرًا لأن دوراتهم يتم إجراؤها بواسطة مدرسين ليسوا دائمًا (في رأيي) جيدين جدًا في التدريس ، فقد وجدت أن جودة دوراتهم تتقلب بشكل كبير نظرًا لأن معايير جودة الدورة التدريبية الخاصة بهم غير موجودة. لقد تلقيت دورات حيث بدا حتى الشخص الذي قدم الدورة وكأنه ينام. وأنا بصراحة لا أمتلك فترة الاهتمام لمواصلة الانتباه في دورة تدريبية مدتها 6-10 ساعات - والكثير منها يستمر لفترة طويلة ، إن لم يكن أطول.

لقد أمضيت 80-100 ساعة من التدريب في Pluralsight ، وأريد بصدق استعادة جزء كبير منه. لا تفهموني بشكل خاطئ ، لقد تلقيت بعض الدورات التدريبية المذهلة حول Pluralsight ، لكن تركيزهم على الكمية على الجودة جعلني أضيع وقتي حقًا. كان بإمكاني أن أتعلم الكثير إذا كنت قد تلقيت دورات من مصادر أفضل مثل Egghead.io و CodeSchool ، حيث يقدرون جودة الكمية.

السبب الوحيد الذي يجعلني أفكر في استخدام شخص ما لـ Pluralsight هو أخذ دورة تدريبية لا يمتلكها أي موقع ويب آخر في بعض التقنيات الأكثر غموضًا (مثل Installshield أو Xamarin) ، أو أخذ بعض الدورات التدريبية المحددة جدًا التي يعرفون أنها استقبلت جيدًا و تمت مراجعته (على سبيل المثال ، الأساسيات الزاويّة لجون بابا).

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

لقد جربت مؤخرًا تدريب Team Treehouse ويجب أن أقول ، إنني مندهش من الجودة التي تم إدخالها في دوراتهم ، حتى أنها تنافس جودة CodeSchool ، والمواد الدراسية الخاصة بهم واسعة للغاية.

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

كلمة عن الدورات المدفوعة

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

نعم ، هناك دورات تعليمية رهيبة مدفوعة الأجر أنصح بعدم قبولها نظرًا لأن عرض قيمتها أمر مشكوك فيه (انظر Pluralsight) ، لكن آخرين مثل Egghead.io و CodeSchool و Team Treehouse يقدمون ميزة رائعة مقابل المال ، على الرغم من تكلفتها نسبيًا اشتراك شهري (25 دولارًا - 30 دولارًا في الشهر). بالإضافة إلى ذلك ، لديهم جميعًا إصدارات تجريبية مجانية من 7 إلى 15 يومًا حتى تتمكن من معرفة أيهما أفضل بالنسبة لك.

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

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

الخلطة السرية للنجاح

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

  • حب ما تعمل. هذه ببساطة هي أهم ما يميزهم جميعًا. إذا كنت لا تحب ما تفعله (سواء كان أسلوب CSS أو JavaScript) ، فسيظهر حقًا في ما تفعله. غالبًا ما يبرز المتحمسون لما يفعلونه من بين الحشود.
  • كن كريما وشارك معرفتك . من السهل جدًا الاحتفاظ بهذا الاختراق الجديد لـ CSS / JavaScript الذي وجدته يحل مشكلات المشروع سراً ، لكن من فضلك لا تفعل ذلك. غالبًا ما يكون الأشخاص الذين يشاركون معرفتهم هم الأكثر قيمة ، حيث يمكن وضعهم في أي نوع من الفريق وتحسين جودته بهامش ضخم.
  • كن دائما على اطلاع على الأشياء الجديدة . يشترك معظم المطورين الناجحين الذين قابلتهم في هذه السمة المشتركة. سواء كان ذلك من خلال قراءة المدونات ، أو قضاء الكثير من الوقت في برمجة المناقشات ذات الصلة ، أو حتى التحدث عن الجديد في تطوير الويب أثناء استراحات الغداء. إن البحث عن أشياء جديدة طوال الوقت يسمح لأفضل المطورين بالبقاء دائمًا في الطليعة.

أقصر طريق

يا للعجب ، استغرق هذا المقال بعض الوقت للانتهاء (6 ساعات والعد). نحن على وشك الانتهاء! قد تتساءل: "حسنًا ، قصة رائعة ، ولكن ما هو الطريق الأسرع؟" وهكذا ، ها هو.

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

جافا سكريبت

  1. مسار تعلم JavaScript الخاص بـ CodeSchool أو Treehouse (مدفوع) أو دورة JavaScript الخاصة بـ Codecademy
  2. Eloquent JavaScript
  3. أنت لا تعرف شبيبة
  4. شبيبة: الطريق الصحيح
  5. تعلم ES6 بواسطة Egghead.io

HTML و CSS

  1. مسار تعلم HTML و CSS الخاص بـ CodeSchool أو Treehouse (مدفوع) أو HTML و CSS: تصميم وإنشاء مواقع الويب بواسطة دورة HTML & CSS من John Ducket أو Codecademy.
  2. تفاصيل حول خصوصية CSS بواسطة حيل CSS
  3. تعلم تخطيط CSS
  4. SMACSS
  5. 9 مبادئ أساسية لتصميم الويب سريع الاستجابة بواسطة Front
  6. أساسيات تصميم الويب سريع الاستجابة من Google على Udacity (خذها إذا لم تستخدم CodeSchool أو مسار التعلم Treehouse)
  7. إدارة تحسين أداء الهاتف المحمول عن طريق تحطيم المجلة أو تحسين عرض المتصفح وتحسين أداء موقع الويب بواسطة Google على Udacity
  8. أساسيات الويب من Google

ادوات المطورين

  1. استكشف وأتقن DevTools بواسطة CodeSchool
  2. تعلم Git من Codecademy وجرب Github من Codeschool
  3. مقدمة لأوامر Linux من مجلة Smashing
  4. أتمتة مهامك بسهولة باستخدام Gulp.js بواسطة Scotch.io

أنجولار جي إس

  1. قرارات التصميم في AngularJS بواسطة Google Developers (مقدمة إلى AngularJS)
  2. أساسيات AngularJS بواسطة Egghead.io
  3. دليل أسلوب جون بابا الزاوي
  4. إنشاء تطبيق Todo صفحة واحدة باستخدام العقدة والزاوية (MEAN) بواسطة Scotch.io
  5. هيكل تطبيق AngularJS بواسطة Egghead.io (مدفوع) أو دورات Angular من Scotch.io

ReactJS

  1. تعلم React.js: البدء والمفاهيم بواسطة Scotch.io
  2. مقدمة إلى webpack بواسطة Egghead.io
  3. أساسيات التفاعل بواسطة Egghead.io
  4. التسوية مع React: Redux by CSS Tricks

النهاية الخلفية

  1. دروس NodeJS بواسطة NodeSchool.io
  2. كيف شرحت REST لزوجتي
  3. إنشاء تطبيق Todo صفحة واحدة مع Node و Angular بواسطة Scotch.io (Node ، ExpressJS ، MongoDB ، Angular ، REST)

المكافأة: الموارد

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

  • تصميم المواقع في 4 دقائق. برنامج تعليمي تفاعلي مبدع ومبدع للغاية يعلمك أساسيات تصميم الويب.
  • أوس. تبحث عن إلهام تصميم الويب؟ لا مزيد من البحث.
  • لماذا التوظيف صعب للغاية في مجال التكنولوجيا بواسطة إريك إليوت. هنا يقوم إريك بعمل رائع في تلخيص كيف أنه من الصعب بشكل مفاجئ العثور على مطورين رائعين ، وكيف تصبح واحدًا.
  • مقارنة نظم قواعد بيانات NoSQL الضخمة بواسطة كريستوف كوفاكس. هذه مقارنة رائعة بين أنظمة قواعد بيانات NoSQL الأكثر شيوعًا. MongoDB ، و Redis ، و CouchDB ، و Cassandra ، و ElasticSearch ، وكلهم والمزيد هنا.
  • لعبة XSS. تعد أخطاء البرمجة النصية عبر المواقع (XSS) واحدة من أكثر أنواع الثغرات الأمنية شيوعًا وخطورة في تطبيقات الويب. باستخدام هذا المورد الرائع ، يمكنك معرفة كيفية البحث عن أخطاء XSS واستغلالها ، وكيفية منعها من الحدوث في تطبيق الويب الخاص بك.
  • كيف تكتب كود غير قابل للاستمرار. مقالة مضحكة عن كيف لاإلىكتابة رمز قابل للصيانة ونظيفة.

المكافأة: أدواتي

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

  • Jetbrains Webstorm: IDE الكامل لتطوير الويب. (المحرر المفضل لدي) مدفوع ، لكنه يقدم ترخيصًا مجانيًا لمدة عام واحد للطلاب.
  • Atom.io: محرر نصوص قابل للتوسعة للغاية مع ميزات مثل IDE تنافس Webstorm. مجانا.
  • Sublime Text: محرر نصوص سريع البرق مع دعم الإضافات ومظهر جمالي مبهج. (عادةً ما أبقي Webstorm / Atom مثبتًا على أنه IDE للعمل الجاد ، ويتم تثبيت Sublime Text لإجراء تعديلات سريعة على الملفات.)
  • caniuse.com: يعد دعم المتصفح أمرًا بالغ الأهمية لمواقع الويب ، وهذا هو المورد الأول في اكتشاف الميزات التي يدعمها إصدار المتصفح وأيها.
  • السحابة 9: بيئة التطوير القائمة على السحابة و IDE مع دعم Git الذي يعمل على Linux. رائعة للبرمجة عن بُعد واختبار NodeJS أو أشياء أخرى على جانب الخادم دون الحاجة إلى تثبيت أي شيء على جهازك
  • CodePen و Plunker و JSFiddle: ساحات اللعب الأمامية الرائعة القائمة على السحابة والتي تتيح لك إجراء عروض توضيحية سريعة بتنسيق HTML / CSS / JS يمكنك مشاركتها أو العمل عليها لاحقًا إذا قمت بإنشاء حساب مجاني. غالبًا ما يكون CodePen هو الأفضل للأشياء المتعلقة بـ CSS نظرًا لواجهته المبسطة ومجموعة كبيرة من الميزات ذات الصلة بـ CSS ، و Plunker لـ JavaScript العروض التوضيحية نظرًا لميزات JS القوية ، و JSFiddle للعروض التوضيحية التي ترغب في التعاون مع الآخرين في الوقت الفعلي بفضل محررها المباشر مشاركة ميزة التعاون.
  • قائمة Vanilla: مستودع لإضافات JavaScript والمكتبات باستخدام Vanilla JavaScript فقط (مما يعني أنها لا تتطلب أي مكتبات للعمل ، مثل jQuery)
  • YouMightNotNeedjQuery: ربما لا تفعل ذلك. انظر بنفسك.
  • PublicAPIs: هل تساءلت يومًا عن واجهات برمجة التطبيقات العامة الموجودة؟ لا مزيد من البحث!
  • Gravit.io: تطبيق تصميم قائم على السحابة ينافس برنامج Adobe Illustrator. (مجاني!) مفيد لنماذج بالأحجام الطبيعية وتصميم ويب سريع.
  • Adobe Kuler: Webapp لمساعدتك في إنشاء مجموعات ألوان متناغمة لأي موقع ويب. يحتوي أيضًا على عرض "استكشاف" للوحات الألوان التي صممها مصممين آخرين بالإضافة إلى نظام تصنيف للمساعدة في إلهامك.
  • قم بتسمية هذا اللون: توقف عن قضاء الكثير من الوقت في معرفة كيفية تسمية متغيرات اللون الخاصة بك في less / sass واستخدم فقط الاسم الصحيح مع تطبيق الويب هذا

استنتاج

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

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

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

آمل أن يكون هذا مفيدًا لكم يا رفاق ، حتى المرة القادمة ، الأفضل!

تحديث 18 مارس : بالنسبة لأولئك الذين لديهم فضول لمعرفة ما كنت على وشك القيام به ، إليك تحديث سريع للحالة!

//medium.com/@sgarcia.dev/status-update-im-still-here-with-cool-stuff-incoming-f031bab49eca