كيف تصبح مطور الواجهة الأمامية

مرحبا يا هابر! أقدم لكم ترجمة المقال "دليل عملي لتصبح مطور واجهة أمامية أول" للمؤلف سيف الدين محجوب.


يمكن أن يكون الحجر الصحي نقطة عالية


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


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


1. إتقان الأساسيات


يجب أن يكون Senjor مرتاحًا جدًا مع HTML و JS و CSS. بالإضافة إلى ذلك ، يجب أن يكونوا على دراية بالمفاهيم الأساسية لكيفية عمل الإنترنت ، بما في ذلك المتصفحات والشبكات والخوادم.


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


تحتاج إلى معرفة العديد من المفاهيم ، يمكنك العثور أدناه على بعض الموارد التي يمكنك الاطلاع عليها وتعبئة المعرفة التي تفتقر إليها ، على الأقل في الوقت الحالي. مرجع CSS ، مرجع HTML ، أساسيات جافا سكريبت ، دليل الواجهة الأمامية .


2. ابدأ بقراءة الوثائق.


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


. , , .


, , .


. , , win-win.

3.


CLI, angular-cli create-react-app.


, .


, , , . 'nice-to-have' , , , git .


, , (webpack/parcel), .


4. (style guide)


, , .


Style guide (Best practices), .


, , , vue-eslint-plugin.


5. Devtools


— . , , , .


, , , , , DOM .


dev tools console.log debugger.


6.


Vue React . , .


, DOM . DOM DOM-.


, , , .


( Vue), , Vuejs, .


7.


— . .


.


Advance Vuejs Component Patterns
Advanced React Component Patterns .


8.


— .

, , , , , .


, react-hooks, , Vue, Vue-composition API Mixins.


, .


9.


, , .


, , , , .


, flux pattern, event emissions callbacks props.


Vue-.


10. -


, , , , , .


, , , .


unit , snapshot e2e .


.


11.


- , , . , .


, , , .


, . , React, Angular, Vue Stencil, . , .


12.


, , , . , .


, , Jamstack, accessibility, , , service workers, , .


13.


, , . , , .


-, , , , , .


. , . , .


P.S. :


, . , , . .


!


All Articles