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

في البداية عليك معرفة أن تطوير المواقع بحد ذاته ينقسم إلى قسمين أساسيين هما Front-End و Back-End و كلاهما ضروريين لبناء موقع متكامل.

في هذا المقال سنشرح دور كل قسم منهما, متطلبات كل قسم, و كيف تطور قدرتك و خبرتك في تطوير المواقع بشكل عام.

مفهوم الـ Front End

هو الواجهة التي تظهر أمامك في الموقع و يتم برمجتها بواسطة اللغات التالية:

• HTML
• CSS
• Javascript

ما هي HTML؟

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

• لعرض فقرة تستخدم وسم إسمه <p>
• لعرض عنوان تستخدم وسم إسمه <h1>
• لعرض رابط تستخدم وسم إسمه <a>
• لعرض صورة تستخدم وسم إسمه <img> إلخ..

ما هي CSS؟

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

ما هي Javascript؟

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

توجد مكتبات عديد مبنية خصيصاً للغة Javascript مثل JQuery و Ajax و هناك إطارات عمل أيضاً مثل React و Vue و Angular سوف تحتاجها مستقبلاً لإختصار و تبسيط أكوادك و بناء مواقع و أنظمة يشكل إحترافي.

نسمع دائماً عن إطار عمل Bootstrap فما هو؟

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

بما أن Bootstrap دوره يقتصر فقط في تحسين تصميم الموقع فهذا يعني أنه يستخدم من ناحية الـ Front-End. و بالمناسبة, تم بناء هذا الإطار باستخدام اللغات HTML, CSS, Javascript و جزء منه خاص بالمؤثرات التي يوفرها لك يعتمد على مكتبة JQuery و مكتبة Popper.js التي تجعل الموقع سهل التحكم بالنسبة للشاشة التي يمكن التحكم بها باللمس (Touch Screen).

هل يتم إستخدام برامج تصميم خاصة لتصميم بعض واجهات الموقع الإلكتروني؟

في بعض المواقع الإلكترونية يتطلب تصميم خاص للموقع و قد تساعدك برامج أدوبي في تصميم الموقع مثل برنامج Adobe XD و Adobe Photoshop أو أي برامج أخرى سواء كانت مدفوعة أو مجانية.

مفهوم الـ Back End

هو الجزء الخفي في الموقع و الذي لا يراه المستخدم العادي و وظيفته لها على علاقة بما يحدث في السيرفر و قواعد البيانات.

ما هي أشهر اللغات البرمجية المستخدمة ببرمجة المواقع الإلكترونية ؟

• PHP
• JavaScript
• #C
• Python
• Java
• Ruby

إختر أي واحدة من هذه اللغات للعمل بها من ناحية السيرفر و إنطلق في تعلمها.

ما هي أشهر قواعد البيانات المستخدمة بالمواقع الإلكترونية ؟

• MySQL
• SQL Server
• Oracle

ننصحك بـقواعد MySQL كبداية لأنها مجانية 100% و الأشهر و الأكثر إستخداماً.

ما علاقة قواعد البيانات بالموقع الإلكتروني ؟

‫بشكل عام, نستخدم قواعد البيانات لحفظ البيانات بشكل مرتب و منظم مما يساعدنا في البحث و الوصول و التحرير و إدارة كل المعلومات و البيانات بسهولة كبيرة حتى و إن كنا نحفظ ملايين المعلومات فيها.

إذاً أي بيانات يتم حفظها في الموقع يتم حفظها في قاعدة بيانات خاصة بهذا الموقع.

فمثلاً, في موقع فيسبوك كن على يقين أن معلومات حسابك الشخصي و منشوراتك و صورك التي ترفعها فيه, جميعها محفوظة في قواعد بيانات خاصة بشركة فيسبوك.

أقسام العمل في مجال تطوير المواقع

بعد تعلمهم و الوصول لمرحلة متقدمة أنت مخير بين ثلاث مسارات:

1. مصمم مواقع (و هو متقن Front-End).
2. مبرمج مواقع (و هو متقن Back-End).
3. مطور مواقع (و هو متقن Front-End & Back-End).

إذاً يمكنك التخصص في تصميم المواقع, أو في برمجة المواقع, في تطوير الموقع.

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

كيف أطور قدرتي و أزيد خبرتي في تطوير المواقع؟

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

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

هذه الأشياء ستتعامل معها على الأغلب في كافة المشاريع التي تفعلها لذا تمرن على فعلها بنفسك.

ما هي متطلبات إنجاز موقع إلكتروني متكامل؟

لإنجاز موقع إلكتروني متكامل نحتاج العديد من الأمور أهمها:

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

كيف أبدأ بإستلام مشاريع أستفيد منها مادياً ؟

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

نصيحة أخيرة 🙂

• نظم وقتك.
• تعلم و تدرب بإستمرار.
• عين أهدافك.
• حاول أكثر.
• إبحث ثم إسأل عن المشكلة.
• رتب ملفاتك و أكوادك.
• طور لغتك.

مقالات مقترحة:

• قائمة بأهم الأسئلة التي يسألها أغلب المبرمجين لعملائهم
• أشهر منصات العمل الحر العربية
• الطريق الصحيح لتعلم البرمجة
• نصائح للمبرمجين