مسار مطور الويب

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

تجهيز الأدوات والإعدادات اللازمة لبدأ العمل في تطوير الويب

لبدأ كتابة الأكواد البرمجية تحتاج لبرنامج لكتابة الأكود يطلق عليه محرر أكواد وهذه قائمة بالبرامج التي تفيدك لتختار منها أو تختارها جميعا.
هناك فرق كبير بين محررات الأكواد التي تعمل عليها في كتابة أكود التصميم ومحررات ال IDE هنا مقال كامل يعرفك معنى كلمة IDE.
  • برنامج [ SublimeText ] برنامج خفيف وجميل وبه مميزات رائعة لك كمطور.
  • برنامج [ NetBeans ] محرر IDE مجاني رائع يحتوي على بيئة تطوير جميلة قم بإختيار نسخة ال PHP
  • برنامج [ Aptana Studio ] محرر IDE مجاني رائع يحتوي على بيئة تطوير جميلة.
  • برنامج [ ++Notepad ] لكتابة الأكواد مجاني وجميل ويدعم اللغة العربية وخفيف على الجهاز.
  • برنامج [ PHP Storm ] محرر IDE مدفوع لكن يحتوي على مميزات رائعة جدا لك كمطور ويب.
تحتاج لمتصفح إنترنت لترى شكل الموقع عليه وهنا أحسن المتصفحات لتختار منها أو تختارها جميعا.
  • متصفح [ Google Chrome ] أروع المتصفحات على الإطلاق من جوجل وبه مميزات رائعة تساعدك في التصميم والبرمجة.
  • متصفح [ Firefox Developer Edition ] متصفح رائع جدا من موزيلا مخصص للمطورين فقط وبه الكثير منا لمزايا الرائعة.
  • متصفح [ Opera ] جميل وخفيف وبه مميزات رائعة تساعدك في التصميم وفي عملك.
حتى تعمل بشكل سليم ولا تواجهك أي مشاكل هناك إعدادات معينة ونصائح تفيدك وتمنع الوقوع في مشاكل أثناء تعلم البرمجة.
  • لا تعتمد على البرامج التي تكمل الكود في أول حياتك حتى تحترف وتتعود على كتابة وسوم اللغة.
  • تأكد أن إمتداد الملفات يظهر في النظام حتى لا تواجه أي مشكلة في إستدعاء الصور الشرح هنا
  • برمج موقعك باللغة الانجليزية أولا. لاتستعمل اللغة العربية الا بعد أن تتعلم وتقف على الطريق حتى لا تدخل في مشاكل.
برنامج سيرفر محلي مثل XAMPP أو WampServer والشرح الخاص به موجود في كورس ال PHP مع كيفة تنصيبه وإعداداته.
هنا سوف تجد دروس منوعة متجددة بإستمرار تفيدك في مجال الحاسب الالي والإنترنت والتصميم عموما ويمكن أن توفر عليك الوقت في عملك كمصمم ويب. يمكنك مشاهدة الدروس من هنا.

أسئلة مهمة يسألها الناس كثيرا قبل التعلم وإجابتها

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

بدأ تعلم لغة [ HTML ] لتنشيء صفحتك الأولى في الويب.

لغة Html هي اللغة الام في بناء هيكل صفحات الويب وقبل العمل على أي تطبيق أو تصميم يجب عليك معرفة كيف تبني هيكل الصفحة وبواسطة هذا الكورس ان شاء الله سوف تتعرف على الوسوم الخاصة باللغة [ Tags ] وسوف تتعرف على عناصر اللغة كاملة وكيف تستعملها لتصميم موقع كامل قبل الدخول في عالم التصميم أو البرمجة يمكنك مشاهدة الكورس التعليمي على اليوتيوب من هنا.

بدأ تعلم لغة [ CSS ] لتنسيق صفحات الويب.

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

بعض النصائح والملاحظات المهمة.

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

وقت التطبيق العملي.

يجب عليك في هذه المرحلة تصميم الكثير من التطبيقات لتحترف التصميم. وهنا في هذا المثال تطبيق تصميم موقع يؤهلك لمشاهدة أي شيء بعدها تقوم بتصميمه وتوظيف كل ما تعلمته في اللغات السابقة مع العلم انه وقت التصميم الحقيقي يجب عليك أن تخطط لتصميمك جيدا بأي وسيلة سواء برنامج جرافيك أو أي أداة من أدوات ال Wireframe أو حتى ورقة وقلم قبل بدأ التصميم لتتخيل شكل الموقع وهنا الكثير عندهم الموهبة للعمل على الموقع مباشرة بدون تخطيط ويكون عندهم تصور للموقع أثناء كتابة الكود.
يمكنك مشاهدة كورس التخطيط Wireframing المكون من سبع دروس من هنا
يمكنك مشاهدة التطبيق الأول على لغة Html + Css المكون من ستة عشر فيديو من هنا
هناك تطبيقات متقدمة في نفس المسار التعليمي هذا ولكن قبل الدخول فيها يمكنك التطبيق بنفسك قبل الدخول للخطوة التالية عن طريق ان تبحث في جوجل عن قوالب بسيطة لتنمي مهارتك وتوظف ما تعلمته في الكورسات السابقة يمكنك البحث عن كلمة Free Css Template وتقوم بتقليدها بدون أن ترى الكود وبعد الإنتهاء تشاهد الكود وتقارن بين الكود الخاص بك وكود التصميم لتعرف هل تطورت أم لا وفيما يلي بعض المواقع التي تفيدك في الحصول على تصميمات للتطبيق.
عند إحتراف البرمجة بصفة عامة سوف تحتاج لبناء تصميم بسيط أثناء عملك ومن خلال تعلمك لهذه اللغات يمكنك ان تقوم بعمل هذا التصميم وبعدها يمكنك أن تقوم بوضع المتغيرات البرمجية عليه بدون الحاجة لأخذ تصميم من أي مكان آخر حيث انه يعتمد كليا على الكود كما قلنا سابقا.

بدأ تعلم الإصدار الجديد من لغة Html

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

خطوة إختيارية لزيادة معلوماتك

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

تعلم لغة PHP لبناء تطبيقات ومواقع الويب

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

تعلم MySQL للتعامل مع قواعد البيانات

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

إضافة اللمسات السحرية والإمكانيات الرائعة.

تعلم مكتبة ال jQuery
مكتبة ال jQuery من أشهر المكتبات المبنية على لغة الجافا سكريبت تساعدك في إضافة اللمسات السحرية في موقعك والتحكم بالأحداث الموجودة في الصفحة. وهي لا غنى عنها اليوم في تصميم صفحات الويب بدونها سوف تكون صفحة الويب صامتة لا يوجد فيها أي حركات سحرية تلهم اي شخص يراها ولا غنى عنها في التعليم وهي مكتبة سهلة جدا و بسيطة و يمكنك تعلمها في وقت سريع جدا حسب حبك لها ومعرفتك بإمكانياتها هذه المكتبة سوف تضيف لك الكثير في صفحة الويب وسوف تنقل الصفحة نقلة كبيرة جدا.
ماذا أحتاج قبل تعلم المكتبة؟
هذا الموضوع يختلف بين الكثير من الناس وكل شخص يمكن ان يدخل في مسار مختلف عن الآخر لكن في النهاية سوف يلتقون في مكان واحد و هذا المكان هو تعلم لغة Javascript حتى تحترف مكتبة ال jQuery وتفهمها بسهولة وتفعل بها أي شيء تريده يجب عليك تعلم لغة Javascript يمكنك مشاهدة أساسيات الكورس قبل الدخول في تعلم المكتبة وبعد الإنتهاء تعود وتكمل الكورس ويمكنك مشاهدة الكورس كاملا سوف يضيف إليك الكثير.
لماذا اشاهد كورس ال Javascript؟
كورس الجافاسكريبت سوف يضيف إليك الكثير جدا في مشاهدته وفيما يلي بعض النقاط التي سوف تفيدك جدا.
  • سيمكنك من فهم مكتبة ال jQuery بسهولة لأن المكتبة مبنية على الجافاسكربت.
  • سيفيدك في حالة أردت تعلم أي لغة برمجة أخرى بسبب تشابه لغات البرمجة.
  • سيفيدك في حال إنتقلت من مكتبة jQuery لأي مكتبة أخرى مبنية على نفس اللغة.
  • سيضيف إليك الكثير في سوق العمل حيث أنها لغة المستقبل
رابط كورس Javascript الأساسي لإتقان اللغة
يمكنك مشاهدته على اليوتيوب من هنا
رابط كورس Javascript DOM للتعامل مع صفحة الويب
يمكنك مشاهدته على اليوتيوب من هنا
رابط كورس Javascript BOM للتعامل مع المتصفح
يمكنك مشاهدته على اليوتيوب من هنا
رابط كورس مكتبة ال jQuery
يمكنك مشاهدته على اليوتيوب من هنا
رابط كورس التطبيق العملي على مكتبة ال jQuery مهم جدا
يمكنك مشاهدته على اليوتيوب من هنا
لا تنسى متابعة مركز التعليم الخاص بالجيكويري في الموقع الخاص بهم ففيه معلومات قيمة وجميلة جدا من هنا.

وقت جلب المزيد من الأفكار والمعلومات المتقدمة

هنا سوف تجد الكثير من التطبيقات العملية التي سوف تزيد من مستواك وتفتح لك الباب للإبداع وتطوير أفكارك ومهاراتك.
  • تطبيقات عامة في تصميم الويب يمكن أن تنفعك أثناء مشوارك في تطويب الويب هنا
  • تطبيقات ودروس متقدمة في Html + Css من هنا
  • تطبيقات عامة في لغة Javascript هنا
  • تطبيقات عامة في مكتبة jQuery هنا

تطبيق بسيط لتصميم وبرمجة نموذج مراسلة Contact Form

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

تطبيق متقدم لتصميم وبرمجة موقع بيع وشراء eCommerce Shop

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

مواقع مهمة للتعليم والمراجعة

مواقع هامة لزيادة معلوماتك وللتطبيق والمراجعة.
  • PHP Manual المرجع الخاص بلغة PHP على الإنترنت.
  • PHP The Right Way موقع جميل ومرجع ممتاز للغة PHP من هنا
  • MySQL Developer Zone المرجع الخاص بقاعدة بيانات MySQL على الإنترنت

وقت المشاكل والحلول

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

24 تعليق


أضف تعليقك