السلام عليكم،
منذ فترة بعيدة وإلى وقت قريب كان الويب بالنسبة لي مثل الشبح في الظلام.. لا أعرف عن لغاته وتقنياته شيئاً.
واليوم أدرس في الجامعة مادة تطوير الويب.. أصبحت أعرف أكثر بطبيعة الحال، وأعلم أني سأتعلم أكثر خلال الأسابيع المتبقية.. ولكني أشعر بالارتباك!
هذا ما ندرسه في الجامعة بالترتيب:
HTML, CSS
JavaScript
jQuery
Bootstrap
PHP, MySQL
وبعض الأمور الأخرى مثل XML وJSON وAJAX. درست إلى الآن حتى jQuery فقط.
لكي تتضح لكم الصورة أكثر، خذوا هذا المثال.. قبل كم يوم قررت أن أصمم واجهة صفحة Portfolio وجدتها على freeCodeCamp من باب التدريب. ولكني صدمتُ بكثرة الطرق التي أستطيع استخدامها لفعل ذلك.. فهناك على حسب w3school ما يسمى بCSS Grid وهناك CSS Float وغيرها، والجامعة لم تعلمنا سوى الtables! بالطبع يئست وألغيت الفكرة كلها، وقررت أن أكتفي بما تفرضه علينا الجامعة من واجبات.
الآن سؤالي لمطوري وخبراء الويب ليس لماذا تحديداً.. وإنما كيف يمكن أن أتعلم كل هذا؟ لا أخفيكم أني أشعر بالحماسة للتعلم، ولكني أيضاً أشعر بالخوف والارتباك.. لا أعرف ماذا أستخدم وماذا أتعلم!
قد تقول اكتفِ بما تعلمك إياه الجامعة.. حسناً سأفعل ولكن كما أسلفت فالجامعة لا تعطينا سوى أساسيات ويبقى جهد البحث والتعلم كله علينا.
التعليقات
غالباً قراءة تعريف بسيط وتاريخ اللغة أو الآداة وسبب إبتكارها يعطيك تصوّر واضح عن مالذي يمكن أن تبدأ به، أو تبدله، أو تأجل تعلمه أو حتى تتجاهله كلياً ..
بأعطيك تسلسل مُخل بسيط لتاريخ هذه الأدوات وقِس عليها ..
HTML لغة وصفية، وهي كافية لإن تصمم موقعك بالكامل وترفعه على الويب وتخبر الآخرين بما تود قوله
لغة وصفية أي أنها توصف المحتوى، هل هو عنوان، نص، رابط، صورة أو غيره
لذلك، إتقنها أولاً
CSS تقنية أتت لتجعل صفحات HTML براقة وجميلة وذات ألوان والأهم في عالم اليوم أنها تجعل صفحات الويب متجاوبة مع كل الأجهزة بأحجامها المختلفة
لذلك، إتقنها ثانياً
Javascript، لغة تعطي الحيوية لصفحات HTML
تجعل التعامل مع زائر الموقع أكثر عملية وسلاسة، ومع انتشار تقنية الأجاكس Ajax أصبحت شبه ضرورية في أغلب مشاريع الويب
لذلك، خذ معرفة كافية عنها، أكثر من متوسطة، هذا ثالثاً
بعد هذا مباشرة، تأتي لغات برمجة السيرفر، هذا إذا كنت تريد أن تصبح مبرمج. أي توقف هنا وإبدأ بتعلّم لغة برمجة مثل PHP, Python, Node أو غيرها.
أما إن كنت تريد أن تكون مطوّر واجهات أمامية Front End، فيأتي كل ما ذكرته أنت بالأعلى وغيره بعد هذه الثلاث ، لا يهم ترتيبها، إختر ما تشاء وتعلّمه حسب اهتمامك، ذائقتك الشخصية، أو السوق إن كنت مهتم بالعمل للغير.
لكن إعرف كل آداة أو إطار عمل لماذا تم إختراقه ومالغرض منه وماهي البدائل.
jQuery أتت لتسهّل للمطوّرين التعامل مع Javascript ، فبدل أن تكتب عشرات الأسطر لتنفيذ شيء بالجافاسكربت، أصبح مع jQuery يمكن تنفيذه بسطرين أو أقل، فكانت مهمة وأحدثت نقلة في عالم الويب.
Bootsrtap مثلاً، أتى ليسهّل على المبرمجين وخصوصاً الغير متخصصين بال Front End ليتمكن من انشاء موقع سريع بسهولة بدون كتابة الكثير من CSS
هناك العشرات بدائل ل Bootstrap، وهناك العشرات بدائل ل jQuery وبدائل كل شيء تقريباً في هذا العالم
لكن ليس هناك بديل للثلاث الأوائل الذي ذكرتهم بالأعلى [html,css,javascript]
وهناك المئات وربما الآلاف للأدوات المساعدة بالمنتصف لتسريع وتسهيل عملية تطوير المواقع مثل Gulp, Grunt,SCSS وغيرها .. لكن هذه كلها أدوات مساعدة، يمكنك أن تنشئ موقعك بدونها، إتركها لحينها.
أكاد أجزم أنك تعرف أغلب هذه المعلومات، لكن معرفة سياقها وترتيبها مهم أعتقد.
مقررات الجامعة لاتعطيك كل شئ وهذا خطاء طلابها فكيف لهم ان يدرسو البرمجة ولايعودون للمنزل ليلا لتصفح البرمجة نفسها لذلك نصحتي لك "الجامعة لن تعلمك شئ سوى لغة المسرح اي ماهي البرمجة" لكن لتصبح مبرمج فعليك ان تبداء في الاعتماد على نفسك من خلال بعض دورات في يوتوب والانطلاق في بناء مشاريع من صفر وليس تعديلها.
ايضا تختلف لغة برمجة وتختلف معها طريقة عملها وسرعتها
تعدد اللغات كتعدد وسائل النقل ولكل ماركة شركة خاصة بها
جوابي على سؤالك تسلسل الجامعة جيد فقط اتبعه مجددا من صفر في دوارات على اليوتوب وبعد ان تشعر انك فهمت الاساسية "HTML / CSS " انتقل الى موقع يدعى codecademy .com
- نصحة : وانت تتعلم html ركز دروس table
بعدها تعلم javascript واتقنها اكرر وكنصحة حاول جيدا فهم الية عمل javascript
بهد ذلك انصحك بلانتقال مباشرة الى bootstrap
ويفضل ان ترازع دورة واحدة لمفهوم jquery وعلاقته ب javascript
نصحة لاتدخل الى php وانتقل مباشرة الى دورة تشرح لك mysql وبعدها انتقل الى typescript
typescript هو منطق للغة برمجة تستعمل الان في كل شئ
وبعد ذلك توجه الى انشاء تطبقات الهاتف
الان php لن تتعلمها في اسبوع واحد او شهر لذلك يفضل ان تسارع زمن بما هو حالي فيه
في الواقع .. كل لغة قمت بذكرها تؤدي وظيفة مختلفة عن غيرها
CSS , HTML لغات وصفية للتصاميم والمظاهر
JavaScript لغة لتنفيذ سطور برمجية من طرف العميل (المتصفح)
jQuery ليست لغة .. انما هي عبارة عن مكتبة برمجية للـ JavaScript
Bootstrap ايضاً ليست لغة برمجة .. هي مكتبة للغة CSS لتؤدي وظيفة معينة
MySQL ايضاً ليست لغة برمجة .. هي لغة للتعامل مع قواعد البيانات
PHP هي لغة برمجة من طرف المخدم
باختصار .. كل لغة تؤدي وظيفتها .. لكن أريد أن اخبرك شيئاً
برمجة الويب هو أسهل مجالات البرمجة اليوم .. حتى أنني لا أحب أن ادعوها برمجة وربما أكتفي بكلمة تصميم ..
في الواقع يستطيع أي فرد كان تعلم هذه اللغات عن طريق يوتيوب بسهولة تامة .. كل ما تحتاجه هو رغبة في التعلم
ما هو تخصصك في الجامعة إن أذنت لي بالسؤال ؟
طبعا جامعة ليست كافية لمطور ويب وضيفتها ليست تعليمك ويب فقط انما هي احد مواد بالطبع لن تجعلك مكتفي اذا اردت ان تكون مطور ويب.
ايضا الويب هو من اسهل مجالات البرمجة بالنسبة لي واضن بشكل عام ايضا.
بما انك تعلمت
html css jquery javascript bootstrap
هذا من اشهر الامور مستعملة في ويب وتعتبر من اساسيات ماعدا jquery يقال انها ستنتهي بغضون عده سنوات.
اذا اردت احترافه يجب ان تكون متمكن من html css javascript فهي اهم ثم تتعلم احد اطر تصميم مثل bootstrap وثم اطر برمجة مثل
react or angular or vue.
ويوجد كثير لتتعلمه غيرها من اتقنيات لتسهل عملك .
هذا كله فقط في مجال frontend.
اما backend تتعلم فيه لغة للباكيند مثل
php nodejs python اي اي لغة برمجة اخرى تفضلها.
ثم قواعد بيانات مثل mysql mongodb اي اي نوع تفضلة .
طبعا اذا اردت ان تعلمك جامعة كل هذة امور باحتراف تحتاج الى كلية خاصة للمطور ويب لذلك جامعة تعلم فقط اساسيات من كل شي ثم يختار شخص تقنيات ومجال الذي يفضلة.
وانصحك ان تتعلم من انشاء مشروع معين وابدء بشي بسيط.
وايضا عند تعلم تعلم كل مجال بحدى مثلا frontend يعتبر مجال مستقل و backend ثم تعلم database
HTML CSS هي أساس كوين صفحة الويب و هما مرتبطان معا ..
JavaScript أت لكي تجعل الصفحة ديناميكية و هي لغة برمجة لكن لجهة المستخدم (في البداية عندما وجدت). و هي لغة قوية تمكنك من التحكم الكامل بالصفحة طريقة عرض البيانات فيها .. هي لن تكون مربكة لو تعلم هذه اللغات خارج الجامعة أي في المنزل بالعكس سيكون لديك الوقت لكي تتعلم و تبحث و تجرب بنفسك خارج الإطار الضيّق للمادة في الجامعة التي يحدها الوقت و عدم القدرة على التجربة بشكل مكثف.
jQuery ليست لغة و انما مكتبة أي أنها بكل بساطة عبارة عن fucntions مهمته تسهيل كتابة أوامر JavaScript مثلا بدل أن أكتب:
document.getElementById('myStory').innerHTML;
يمكنني فقط كتابة:
$('#myStory').html();
أي أنها مجرد أداة تسهل كتابة الأسطر الطويلة لـ JavaScript و هي عملية جداً و يمكن استخدامها إلى جانب JavaScript أي يمكن دمجهما معا لأنها - و من جديد - عبارة عن أكواد JavaScript.
Bootstrap هو إطار عمل لواجهة المستخدم و هو ليس معقداً بل بالعكس تماماً هو أسهل بكثير من ما تتصور! يساعدك في تصميم صفحة متوافقة على جميع الشاشات بأقل عدد ممكن من الأسطر و هو عبارة عن CSS Classes بشكل أساسي بالإضافة إلى Plugins غير إجبارية مبنية على JQuery لعمل مثلاً Modal:
Ajax تعتبر تقنية JavaScript و لقد أحدثت ثورة في عالم الويب! لا يمكن تخيل أي برنامج بدون Ajax هذه الأيام. فهي تساعدك على بناء تطبيقات OnePage WebApp أي أن البيانات تنتقل من و إلى الصفحة بدون عمل Refresh أو الإنتقال إلى صفحة أخرى.
JSON هي Format أي طريقة كتابة ليس إلا تستخدم في نقل البيانات و عرضها بين مختلف برامج الويب (و غير الويب) أي أنها أشبه بلغة عالمية يمكنك التعامل معها من خلال أي لغة برمجة.
XML كانت تستخدم قديماً بدل JSON كما أن لها استخدامات أخرى في أرشفة الواقع و غيره.
المقصود من كل ما وضحته أن الويب قوته في كثرة تقنياته التي لا تتوقف عن التطور! و ما ذكرتَه هو جزء بسيط من عشرات التقنيات الأخرى التي تسهل و تزيد قوة تطبيق الويب و أنت ستتعلم ما تحتاج إليه شيئا فشيئاً!
من خبرتي البسيطة انا اذا حبيت اتعلم لغة او تقنية جديدة اعمل الخطوات التالية:
١- احدد اللغة او التقنية اللي ابي اتعلمها.
٢- احدد لي وقت معين. مثلا شهرين او شهر و نص.
٣- بعد ما تعلم الاساسيات ابدا اطور برنامج او موقع. و هذي خطوة مهمة جداً. لا تكتفي فقط بالنظريات و الأمثلة. أحسن طريقة للتعمق انك تطور شي من الصفر عشان شبة مؤكد انك راح تواجه مشاكل. و في بحثك عن حلها راح تتعلم الكثير.
اما بالنسبة لسؤالك الجواب يعتمد على اللي تبي تتعلمه. اللي ذكرتهم اغلبهم هي لغات او ادوات تشتغل على جهة العميل او client side و ايضا تعرف ب front end و هي تسمى كذا لانه هذا اللي بتشوفه و تتعامل معه بالموقع. ال HTML هو الاساس او ممكن نقول انه الهيكل العظمي للموقع. هو اللي تقدر تحدد فيه و ين تكون الروابط و العناوين و المقالات و الجداول و النماذج(forms) اللي تطلع بالصفحه. هذا طبعا بشكل عام لأنه له وظائف اكثر. ال CSS يساعدك في تحديد الاوان و التصميم اللي تبيه للموقع. مو قلنا ال HTML هيكل عظمي، تقدر تعتبر ال CSS هو الجلد الخارجي فوق الهيكل العظمي. ال Bootstrap هو يسهل لك موضوع تحديد الاوان و التصاميم. بدال ما تسوي ملف و تكتب عدة اسطر عشان تخلي جزء من الصفحه او رز لونه احمر. تقتدر تستخدم البوتستراب بالموقع و تستدعي class او id بالجزء اللي تبيه و هو يهتم بموضوع اللون. الحين عندنا موقع و شكلة زين، بس ما تقتدر تتفاعل معه يعني بس صفحات جامده. اذا تبي تخلي صفحاتك متفاعله، هنا يجي دور ال javascript. و ظيفة الجافاسكربت انها تتفاعل مع عناصر ال HTML و تغيرهم. بس زي ما ذكر احد الاخوان انه لو تستخدم javascript فقط الموضوع بياخذ من كثير. فيجي هنا دور ال jQuery و Angular و React و Vue هذول دورهم انهم يسهلون عليك عمل موقع متفاعل باستخدام ال javascript. ال Ajax حسب استعمالي البسيط له من اهم وظايفه هو لو مثلا فيه تحديث لجزء صغير من الصفحة، بدال ما تحدث الصفحة كاملة تقدر تحدث الجزء اللي يحتاج تحديث فقط. و هذا كل يختص بال front end. ال back end هذا عالم ثاني من ال web development. و هو يختص ببرمجة السيرفيرات و قواعد البيانات. اذا عندك اسألة او استفسارات انا بالخدمة.
ولكني صدمتُ بكثرة الطرق التي أستطيع استخدامها لفعل ذلك
لا تحتاج تعلم كل الطرق لانشاء شيء واحد، مثلا لاعطاء التجاوب للتصميم يمكنك استعماء CSS Grid و Media Query او Bootstrap أو اي مكتبه أخرى، بعض الناس في بعض الاحيان يستعملون Flexbox.
الكثير من التقنيات صحيح؟، بالنسبة لي تعلم Bootstrap و Media Query لاني احتجت إلى الاثنين ثم عملت على مشروع احتجت به لFlexBox بسبب خاصية Flex-shrink و Flex-Grow بالاضافة ان المشروع صغير ولم احتاج إلى اضافة 15 كيلوبايت للموقع(حجم Bootstrap Grid).
إضافة لما سبق، خارطة مطور الويب، كنت شاركتها من قبل وهي رائعة جدا
والجامعة لم تعلمنا سوى الtables!
استخدام الtables لتقسيم الصفحة خاطئ جدا.
حدد هدفك في الاول تريد ان تصبح مطور ويب او مصمم في هذه الاختصاصات هناك العديد من المجالات مثال في الويب ديزاين هناك تفرعات
ديزاينر هو مصمم يقوم بالاساس علي بناء و تصميم صفحات الويب ب فوتوشوب او اندزاين او اكس دي
و ويب فراند ديفلوبر هو الي ينفل التصميم بالاعتماد علي لغات الويب html css js
هناك مهن اخري ضهرت حديثا في ويب ديزين ux ui تعتمد علي جمالية اضهار صفحة الويب للمستخدم
مطور الويب يتعامل مع السيرفرات ب php python sql
في ما يخص تصميم الموقع بال tables هي طريقة قديمة هناك layout جاهزة grid و flexbox css
او استعمل div ب html و اعمللها float ب css
صديقي، حقيقة لا يتوجب عليك معرفة كل ذلك..
اعرف الأساسيات (Basics) وأتقنها جيدا (عندما أقول جيدا أعني ذلك..)
وقبل ذلك والأهم منه تعلم عقلية المبرمج (Programmer Mindset) وكذا الأساسات العامة للبرمجة بغض النظر عن اللغة أو إطار العمل..
بعد اتقان الأساسيات انطق مباشرة دون تردد لإنجاز المشاريع، سوف تواجه عقبات لم تدرسها، هنا تدرس كل شيء بحسب الحاجة إليه (Learning on The GO)، مثلا تعلمت HTML5 ثم واجهتك مشكلة في الرسوميات، هنا تذهب لتلقي نظرة على svg مثلا أو canvas وتتعلمها وظيفيا لغرض المشكلة التي واجهتها وهكذا مع بقية اللغات..
وإياك والانتقال للمكتبات الجاهزة (jQuery) و الأطر المهيأة (Bootsrap) قبل إتقان عمل المشاريع بدونها لأن ذلك سيؤذيك يا صديقي..
بالنظر إلى مقرر جامعتكم فهو متخلف جدا وغير علمي، لذا حاول التقدم في دراستك الحرة وستكون مقررات الجامعة سهلة جدا بالنسبة إليك..
بالمناسبة w3schools موقع جيد جدا لفهم الأساسيات لكن ليس كل شيء، حاول مشاهدة فيديوهات احترافية للأجانب والعرب في كيفية إنجاز المشاريع.,
بالتوفيق..