مسار ومصادر مطور تطبيقات الويب
- ثريد
بسم الله والسلام عليكم، الثريد ده مساهمة بسيطة كده لكل زول حابي يدخل مجال تطوير الويب، والمصادر كلها مجانية، فااا كل المطلوب جهاز كمبيوتر ـ بأي مواصفات ـ وإنترنت، ورغبة طبعاً الي هي أهم مطلب، وخطوة خطوة هتعلم نفسك بنفسك بالتجربة والتعديل.
- ثريد
بسم الله والسلام عليكم، الثريد ده مساهمة بسيطة كده لكل زول حابي يدخل مجال تطوير الويب، والمصادر كلها مجانية، فااا كل المطلوب جهاز كمبيوتر ـ بأي مواصفات ـ وإنترنت، ورغبة طبعاً الي هي أهم مطلب، وخطوة خطوة هتعلم نفسك بنفسك بالتجربة والتعديل.
المجال ما صعب أبداً وعنده community كبير جداً هيساعدك في أي مشكلة قد تواجهك، بالإضافة لأنه ممتع جداً أثناء التعلم وفيه تحدي لنفسك بالمقام الأول.
قبل ما أدخل في التفاصيل لابد من توضيح نقطة مهمة، وهي أن تطوير تطبيقات الويب فيهو إتجاهين رئيسيين كل واحد فيهم عنده مسار معين:
قبل ما أدخل في التفاصيل لابد من توضيح نقطة مهمة، وهي أن تطوير تطبيقات الويب فيهو إتجاهين رئيسيين كل واحد فيهم عنده مسار معين:
الأول، تطوير الواجهة الأمامية البتظهر للمستخدم أو الـ Front End Development ودي متعلقة بشكل وكيفية إستعراض البيانات على المتصفح ـ صور، فيديوهات، نصوص وغيرها من البيانات ـ بالإضافة لطريقة تفاعل الصفحة مع المستخدم لما يقوم بـ Actions معينة.
وبيُستخدم في تطوير الواجهة الأمامية دي تلات لغات أساسية مجتمعة وهم html و css و javascript و اللغات دي مهمتها محدودة في إطار شكل وتفاعل الصفحة على المتصفح وما من مهامها التعامل مع السيرفرات إلا في حالات معينة بسيطة هتعرفها لما تتعمق في الـ javascript
ثانياً، تطوير الواجهة الخلفية أو الـ Back End Development حيث يحدث السحر، والجزئية دي متعلقة بالتعامل مع بيانات المستخدمين تخزينها في قاعدة بيانات وإجراء عمليات مختلفة عليها ـ حذف إضافة بحث والخ ـ بالإضافة للتعامل مع الـ Security و الـ APIs
وبيُستخدم في ده لغات وتقنيات كتيرة ومختلفة، والأساس في الجزئية دي حاجتين لغة scripting تشتغل على السيرفر زي php أو python أو nodejs أو غيرهم من اللغات الكتيرة المتاحة، بالإضافة للغات قواعد البيانات.
هنا هنكتفي ـ حالياً على الأقل ـ بمتطلبات ومسار الـ Front End Development ومصادره الممتازة والكتيرة جداً بما أنه هو زيت الثريد ده.
أول وأهم خطوة، هي معرفة الويب نفسه، كيف بيعمل؟ وأساسياته شنو في أبسط صورها؟ الرابط التحت ده 👇 عبارة عن نبذة بسيطة بتتناول عمل الويب
developer.mozilla.org
developer.mozilla.org
بعد كده وحتى تقدر تشغل كودك لابد من محرر نصوص ـ برنامج ـ تكتب عليه الكود، والمحررات كتيرة وكل واحد ومميزاته، بحث صغيرون على Google عن الـ Text Editors المتاحة، وليك حرية الإختيار من النتائج الهتظر ليك.
جهزت محررك، كل العليك تاني تاخد أول خطوة عملية وهي بناء هيكل الصفحة بإستخدام الـ html ولتلعمها من الصفر للسلام عليكم عندي ليك مصدرين جبارين.
الأول وهو ده 👇
developer.mozilla.org
موقع غني جداً ببدأ معاك رحلتك حرفياً من الصفر، وما مُطالب بأي معرفة مسبقة عن تصميم الصفحات
developer.mozilla.org
موقع غني جداً ببدأ معاك رحلتك حرفياً من الصفر، وما مُطالب بأي معرفة مسبقة عن تصميم الصفحات
نفس الشيء ينطبق على المصدر التاني هنا 👇
freecodecamp.org
شخصياً بفضل المصدر الأول فيه تفصيل أكتر من البداية، وشرحه أعمق من المصدر التاني.
وبشكل عام ما هتفرق كتير فالموقعين MDN web docs و freeCodeCamp ممتازين وسمعتهم عالية وموثوقين، وهتصل لنفس النتيجة مع أي واحد فيهم.
freecodecamp.org
شخصياً بفضل المصدر الأول فيه تفصيل أكتر من البداية، وشرحه أعمق من المصدر التاني.
وبشكل عام ما هتفرق كتير فالموقعين MDN web docs و freeCodeCamp ممتازين وسمعتهم عالية وموثوقين، وهتصل لنفس النتيجة مع أي واحد فيهم.
الخطوة البعدها هي تنسيق شكل الصفحة بإستخدام الـ css بعدما تمت هيكلتها بالـ html، تنسيق الألوان والخطوط وحقول الإدخال وغيرهم من عناصر الصفحة، بالإضافة لتجاوب الصفحة مع أحجام الشاشات المختلفة، ومن هنا الـ fun side ببدأ، ومصادر تعلمها هي نفس مصادر تعلم الـ html أعلاه 👆"حزمة واحدة"
ويُفَضل بعد تخلص تعلم الـ html و الـ css انك تحاول تقلد ليك مواقع شغالة أو templates جاهزة حتى يرسخ الإتعلمتو ده وتاخد خبرة بسيطة في التعامل مع الصفحات، وببحث صغيرون عن الـ responsive html templates هتلاقي كمية غير منتهية من الـ templates الجاهزة
نزل البعجبك منهم وحاول وتعمل نسخة مشابهة ليهو من عندك، والحاجة دي هتستفيد منها بشكل كبير جداً في حاجات أوسع من مجرد عمل الصفحات.
بعد كده وحتى يكون موقعك حيوي ويتفاعل مع المستخدم هتدخل على الـ javascript وتتعلم تطورير الصفحات حتى تتفاعل مع كل action يقوم بيه المستخدم والحاجات دي.
بعد كده وحتى يكون موقعك حيوي ويتفاعل مع المستخدم هتدخل على الـ javascript وتتعلم تطورير الصفحات حتى تتفاعل مع كل action يقوم بيه المستخدم والحاجات دي.
بس قبل ما تدخل على أي لغة برمجة لازم يكون عندك خلفية عن أساس البرمجة اللي هو "الخوارزميات" حتى تتمكن من التفكير كمبرمج وتحل المشاكل بالطرق السليمة، طبعاً حوار الخوارزميات وأهميتها لأي زول ناوي يدخل المجال، ده بحتاج كُتَيب براو كده لأهميته الشديدة طبعاً.
وحتى أقصر عليك الطريق في الرابط ده 👇 دروس بسيطة وممتازة بتتناول الخطوات الأساسية للتعامل مع المشكلات
youtube.com
youtube.com
بعد تعلم أساسيات التفكير المنطقي لحل المشكلات، انت كده مهيأ للدخول على أي لغة برمجة، بالتالي تعلم javascript هيكون easy cake بالنسبة ليك وممتع جداً.
وطبعاً لازم تعرف ماهي الـ javascript ونبذة عنها وكيفية عملها بصورة عامة، هنا 👇 هتلاقي معلومات قيمة جداً بخصوص الموضوع ده
javascript.info
javascript.info
بعد كده إنت جاهز تماماً للـ javascript والـ codeCamp هيبدأ معاك crash course من طباعة Hello World لغاية ما تعمل صفحة تتفاعل مع المستخدم، وتسلحك بلوازم لغة قوية و واسعة جداً 👇
freecodecamp.org
freecodecamp.org
المرة دي برجح الـ codeCamp على MDN docs لأن الأخير ده متقدم حبتين وقد يتوهك في نص الطريق فاا هتحتاج للأساسيات على الأقل عشان تقدر تتابع معاهم، بالإضافة لأنهم عاملين جزئية مدفوعة وكده وأنا عندي حساسية من الحاجات المدفوعة في النوع ده من التعليم ودي نقطة النقاش حولها يطول فما علينا.
وبكده حرفياً وبدون تعلم أي حاجة تانية انت Front End Developer وجاهز تشتغل وتنجز، و it's totally ok انك تكتفي بكده وتاخد فيهم خبرة، وما بالضرورة تدخل على الـ frameworks تبع javascript أو تبع css على الأقل ما طوالي كده، أنجز ليك كم حاجة بعدها خش على الإضافات المهمة دي.
طبعاً اليوتيوب مليان دروس وبتاع والحاجات دي وفيه كورسات ممتازة تختصر عليك زمن لا بأس به، وفيك تخش على أي واحد فيهم عادي جداً.
بس أنا عندي قناعة بأن الشخص لما يتعلم من مصادر زي codeCamp و Mozilla Developers docsواللي بيعتمدوا على النصوص المكتوبة
بس أنا عندي قناعة بأن الشخص لما يتعلم من مصادر زي codeCamp و Mozilla Developers docsواللي بيعتمدوا على النصوص المكتوبة
بساهموا في تطوير الشخص ده وبكون قادر على تعلم أي حاجة من الـ documentation مباشرة وبالتالي معرفة أعمق وأشمل بالحاجة دي، وكتير معلومات في سايد اليوتيوبرز بتسقط ـ عن قصد أو غير قصد ـ
والكورسات المدفوعة Udemy على سبيل المثال كتير من مطوريهم بحثوا في كورساتهم بالرجوع للـ documentation لأي حاجة بدرسوها لمعرفة أعمق، رغم أنهم بعلموك الأساسيات البتمكنك من تطوير نفسك لدرجة advanced في الشيء البتتعلمه، مع ذلك بنصحوا بالرجوع للـ documentation ولمواقع زي MDN web docs
فااا للأسباب الفوق دي وغيرها شاركت المصادر الشايف أنها أفضل حسب اعتقادي، وقد ما تتماشى معاك وتفضّل مصادر تانية زي يوتيوب، أو تعمل combination بناتهم، وكله بالأخير راجع ليك، بس أعيد وأقول الرغبة ثم الرغبة دي لو عندك ما هيفرق معاك كتير طريقة التعلم.
وأخيراً بالتوفيق لأي زول عنده الرغبة في المجال وحابي يدخله، واطمن الـ community كبير ومتنوع والمساعدات وحلول المشاكل بالكوم والمواضيع اليومية والمشاريع الصغيرة ـ الفنية/الجمالية ـ كتيرة، انت بس اتعب حبة وقول بسم الله.
جاري تحميل الاقتراحات...