إليك المسار الصحيح لصناعة موقع : 8 خطوات عليك إتباعها جيدا

إليك المسار الصحيح لصناعة موقع : 8 خطوات عليك إتباعها جيدا


إليك المسار الصحيح لصناعة موقع : 8 خطوات عليك القيام بها لبرمجة موقع متكامل


إن مُعظم الأفكار التي نقوم بالتدوين عنها مأخوذة من إستفسارات و مشاكل المتابعين الخاصة بنا على الفيسبوك ، ففي كل مرة يطرح أحد المتابعين سؤالا او استفسارا نرى انه لا يمكن الإجابة عليه الا بتقديم مقال كامل يعالج كل أطرافه ، و نرى ان للجميع الحق في الحصول على الإجابة لتساؤلهم ذاك . 
نفس الشيئ حدث مؤخرا عندما نشرنا مقالا في صفحتنا على الفيسبوك بعنوان : 8 خطوات لبناء تطبيق اندرويد ناجح إبتداءا من الفكرة الى تسويق التطبيق ، فحدث ان بعض المعجبين، او نقول مُعظمهم قد إقترحو علينا بتقديم موضوع مشابه ، لكن هذه المرة لكيفية صناعة مواقع الويب و صفحات الويب و ليس  تطبيق أندرويد ، كون ان الكثير يعاني من مُعضلة إيجاد الطريق الصحيح لتصميم و تطوير موقع ويب كامل و متاكمل . 

لذلك ، و في هذا الموضوع سنساعد كل شخص يبحث عن المسار الصحيح لصناعة موقع ويب كامل في هذا المقال ، و لنقوم بذلك ، فقد قمنا بتقسيمه الى 8 خطوات نرى ان إتباعها بالترتيب سيقودك الى صناعة موقع ويب في النهاية ، لنتابع . 

1 - تحديد التقنيات المناسبة لفكرة الموقع : 


لا يمكنك صديقي ان تبدأ قبل ان تعرف التقنيات التي يجب عليك إستخدامها ، و من أجل معرفة التقنيات يجب عليك معرفة فكرة الموقع أولا و كيف يمكن تطبيقها ، و هنا سأبدأ الحديث عن الأشخاص الذين يسألون دائما : " ما الأفضل الـ Php ام Asp ؟ " او يسألون : " هل Django افضل من Rails ام العكس ؟ "  و تلك المقارنات التي يقوم بها العديد من الأشخاص ، للأسف صديقي تلك المقارنات خاطئة كليا ، نعم ففكرة الموقع هي التي تفرض عليك التقنيات التي يجب عليك إستخدامها ، صحيح ان تقنيات  برمجة مواقع الويب يمكن إستخدامها تقريبا في صناعة أي موقع ، لكن صناعة موقع مخصص لشيئ ما بلغة او تقنية برمجية في فترة وجيزة و عدد اكواد اقل بإستخدام التقنية الصحيحة أفضل من قضاء أسابيع في برمجته بالاف الاكواد البرمجية بالتقنية الخاطئة . 
لذلك ، و أولا سيتوجب عليك ان تبحث عن التقنيات التي يتم إستخدامها في صناعة موقع بالفكرة التي لديك ، يمكنك ان تزور مجموعتا على الفيسبوك من هنا  تطرح فكرة موقعك و ستجد إجابتك من طرفنا او طرف أصدقائنا للتقنيات الأفضل لفكرتك ، او تابع مقالاتنا عن تحليل موضوع لإكتساب مهارة التحليل من تلقاء ذاتك من هنا

2 -  إفهم التقسيمين : الـ Back End و الـ  Front End : 



عندما تقوم بتحليل مشروعك ، و تجد التقنيات المناسبة، سيتوجب عليك البدئ في برمجته بالتأكيد ، و برمجة موقع يتم على مرحلتين ، او تقسيمين كما احب ان اسميهما ، و هما كالتالي : 
الـ Back End : و يُقصد بها الواجهة الخلفية للموقع ، اي الأشياء التي لا تظهر للمستخدم لكن يتعامل معها ، مثل المعلومات المُخزنة و ما الى ذلك ، يمكننا إختزالها على انها التعامل مع قواعد البيانات ، من إنشاء الجداول و العلاقات بينها ، و ربط الموقع مع تلك الجداول و تمرير و تخزين البيانات في قواعد البيانات من خلال الموقع ، وتُسمى كل هذه الخطوات بالـ Back End . 
الـ Front End : و هي الواجهة التي يتعامل معها المستخدم ، من أزرار ، و رسومات و صور و ألوان و Header و ما الى ذلك ، للواجهات دور مهم في برمجة أي موقع ، فهي تسهل على المستخدم الوصول لأي قسم يريده في الموقع و توفير كل ما يقدمه موقعك للمستخدمين بكل سهولة ، ناهيك على إجتذاب الزائر من خلال الستايل الجميل ، ببساطة الـ  Style الخاص بالموقع يُسمى بالـ Front End . 

3 - إبدأ دائما بالـ Back End ... عن تجربة ! 


( سأجزم مسبقا انه لديك خبرة في التعامل مع الـ Back End اي لديك خلفية عن لغات و تقنيات برمجية مثل SQL , MVC , PDO و ما الى ذلك ... ) 
لقد صنعت طيلة خبراتي في مجال  البرمجة بعض المواقع ، حسنا مُعظمها باء للفشل لكن ليس برمجيا ، بل بسبب ضعف المال ، فإنشاء موقع يتطلب منك إستضافة و تسويق و ما الى ذلك و المشاركين في الموقع ( نعم ليس وحدي بل فريق ) لم يتوفر يوما على المال الكافي لفعل ذلك و هذا عائد لنقص المهتمين بما قمنا ببرمجته ، لكن ما أحاول إيصاله هنا ، انه و من خلال خبراتي في برمجة المواقع ، أنصحك دائما بالبدئ في الـ Back End . 
عليك أولا ان تنشئ قواعد البيانات ، و الصفحات التي يتطلبها ، فلنقل ان موقعك لديك مثلا  جدولين و هما المستخدم ، و المنتوج ، ستحتاج مثلا الى صناعة  الـ CRUD ( و معناها Create , Read , Update , Delete ) الخاص بكل جدول ، اي انك ستحتاج إلى صفحة مخصصة لكل جدول للقيام بعملية الـ CRUD ، أخبرني ، هل كنت ستعرف انك ستحتاج صفحتين لو لم تكن تعرف عدد الجداول الخاصة بك ؟ لا بالتأكيد ، لذلك معرفة الجداول التي ستستخدمها ، و تنظيمها و تنسيقها و ربطها مع الموقع الأولي من الخطوات الأولية التي يجب عليك القيام بها اثناء  برمجة موقع ، لذلك صديقي و خذها نصيحة ، إياك ان تضع كود CSS واحد حتى تُنهي كل ما يتعلق بقواعد البيانات و تمرير و جلب البيانات و كل شيئ خاص بالـ Back End . 

4 - ثم بعدها الـ Front End : 


( سأجزم مسبقا انه لديك خبرة في التعامل مع الـ Front End اي لديك خلفية عن لغات و تقنيات برمجية مثل : HTML / CSS / JS / Bootstrap / و ما الى ذلك .. ) 
الـ Front End ضروري لبناء واجهة المواقع ، يبدأ الأمر كله بتصميم أولي للموقع ، يتم ذلك عبر أحد أدوات التصميم مثل ( الفوتوشوب ، إلستراتور ... ) ، يتم صناعته من طرف مصمم الويب او Web Designer ، يقوم صديقنا مصمم الويب بصناعة الموقع على شكل صورة واحدة لكل صفحة ، يتم تعديل تلك الصورة و الألوان و كل ذلك حتى نأخذ فكرة نهائية عن شكل الموقع فقط ، الفوتوشوب ليس أداة برمجة ، بل فقط نقوم من خلاله بصناعة صورة تجسيدية للموقع حتى نتطلع على شكله النهائي . 

بعدها يتم تمرير هذه الصور الى نفس الشخص وهو Web Designer الذي من المفترض ان يكون Coder أيضا ، يقوم صديقنا ببدئ تصميم كل قطعة من الموقع كما جائت في الصورة ، شيئا فشيئا ، هنا الـ Header و هنا الـ Footer و ذاك الـ Sidebar و هنا الـ Login Form و ما الى ذلك ، يستطيع الـ Web Designer الإستعانة بمكتبات جاهزة و ما الى ذلك لتوفير كل ما يلزم ( راجع نهاية المقال للتعرف على مكتبات جاهزة للإستخدام ) . 
ضع في الحسبان أيضا ،أنه يمكن تصميم موقع دون الحاجة الى الـ Back End ، مثل مثلا الـ Landing Pages او صفحات الهبوط او الصفحات التعريفية و ما الى ذلك ، فأنت لا تحتاج إلى قاعدة بيانات ، نحتاج لقواعد البيانات فقط عندما نريد تخزين المعلومات . 

5 - كيف أبدأ في الـ Back End ؟ و أساسيات يجب أخذها بعين الإعتبار : 


إذن لقد فهمت سيرورة العمل الآن اليس كذلك ، تقوم بأخذ الفكرة ، تقوم بتحديد تقنيات بنائها ، تقوم بالبدئ بالـ Back End ثم بعدها الـ Front End . 
لكن إليك بعض الأشياء التي يجب عليك أخذها بعين الإعتبار أثناء عملك في مجال الـ Back End : 
- الحماية : عليك ان تعرف ان الحماية هي أهم شيئ في الـ Back End ، مبادئ الحماية كثيرة و متعددة و سيكون علي ن الصعب ان اتطرق لها كلها ، لكن مبدئيا ، قم بتشفير بعض البيانات مثل كلمات سر المستخدمين ، و أيضا ، ننصحك بتقنيات Back End متقدمة مثل MVC سيكون أفضل . 
- تقنيات العمل : أصبح التعامل مع قواعد البيانات عبر الـ Queries أمر سهل التعقب كما تعرف ، و يستطيع العديد من الأشخاص إكتشاف ثغرات و نقاط ضعف مثل SQL Injection في البيانات المُرسلة و المستقبلة ، لذلك و لتجنب كل هذا يُستحسن ان تختار تقنيات عمل جيدة ، و أقصد بذلك إطارات العمل مثل : Laravel , Ruby on Rails , Django , CideIgniter و غيرها ، تفضل راجع المقال التالي سيفيدك كثيرا : إليك 7 إطارات عمل (Framworks) مخصصة لصناعة المواقع عليك معرفتها . 
- السرعة : من الصعب علينا التحدث عن سرعة إرسال و إستقبال البيانات اثناء التعامل مع مجموعة من البيانات القليلة و ذات الحجم الخفيف ، لكن لنقل مثلا انه لديك 3 ملايين مستخدم لموقعك ، إرسال البيانات و إستقبالها سيكون جد متأخر ، فمثلا تسجيل دخول مستخدم سابق سيضطر النظام للبحث في كل ال3 ملايين مستخدم الى ان يجد المطلوب ، لذلك عليك إبتكار او العمل بخوارزميات أقل إستهلاكا للوقت من أجل تسريع العمل . 
- الـ Real Time : مع الوقت عزيزي المبرمج ، عليك ان تجيد بعض التقنيات الجديدة في مجال الـ Back End و العمل بإطارات اخرى أيضا مثل الـ Angular او الـ React و ذلك من أجل القيام بعملية الـ Real Time أي إرسال و إستقبال البيانات دون الحاجة الى تحديث الصفحة ، و لنقل على  سبيل المثال ستحتاج إلى تقنية مماثلة اثناء  برمجة موقع شات على سبيل المثال . 

اما بالنسبة لطريقة البدئ في مجال الـ Back End فسيكون جيدا لو راجعت كورسات التعامل مع قواعد البيانات و ما الى ذلك ، يمكنك دائما تفقد كورساتنا في صفحتنا التالية

6 - كيف أبدأ في الـ Front End ؟ و أساسيات يجب اخذها بعين الإعتبار : 



سيتوجب عليك اولا ان تتوفر على بعض الحس الإبداعي ، ان تكون مُبدعا و ذو ذوق رفيع ، ان تكون أيضا على دراية باخر مستجدات تصميم مواقع الويب و أشكالها و ما الى ذلك ، حتى تستطيع تنفيذ ما تريده من ستايلات و تقنيات على الموقع الذي انت في صدد برمجة واجهته ، لذلك ، إليك بعض الأساسيات التي يجب عليك العمل بها : 
- سرعة الموقع : انا متأكد الى انك ستضطر إلى استخدام العديد من المكتبات من أجل إضافة لمسات مختلفة على الموقع اثناء تصميم واجهته ، لكن كثرة المكتبات يعني وقتا أطول في تحميل الوقع لذلك تجنب هذا الأمر و حاول تقليص المكتبات قدر الإمكان و لا تنسى ان تجعل الكود الخاص بك في النهاية أيضا Minimized حتى يكون تحميل الكود أسرع . 
- أتقن الـ UI و الـ UX : أرجوك صديقي ، قبل ان تبدأ في مجال الـ Front End من أساسه ، خذ لك دورة او دورتين في فهم مجال الـ UI و الـ UX ، و كيف يجب لموقعك ان يتعامل مع المستخدم و كيف يمكن توفير كل ما يحتاجه المستخدم امام عينيه في الموقع ، و كيف يجب ان تكون الألوان و الأشكال متناسقة و كيف يجب ان يكون الموقع متكامل من ناحية التصميم . 
- لا تنسى الـ Responsive او التجاوب : جعل الموقع متجاوب مسألة ضرورية اليوم في ظل إستخدامنا المتواصل للأجهزة الذكية الأخرى مثل الهاتف و الTablet و باقي القياسات ، لذلك لا تنسى هذه النقطة إطلاقا . 
- أضف لمستك الخاصة : لا تنسى صديقي ان تكون لديك تلك اللمسة الإحترافية التي تضيفها دائما على تصاميمك ، خذ مثالا لجوجل ، نعم اعلم جيدا ان مقارنة جوجل بنا في هذه الحالة مقارنة صعبة لكن فقط لنحاول ، تلاحظ ان تصاميمها كلها تعتمد على الـ Material Design و ان لها نفس المبادئ في التصميم كما لو ان شخصا واحدا فقط صمم جوجل كاملة ، فهل ستكون أنت ذلك الشخص الذي صمم كل المواقع الخاصة بشركتك ؟ ربما . 

7 - العمل التشاركي : 


إليك المسار الصحيح لصناعة موقع : 8 خطوات عليك القيام بها لبرمجة موقع متكامل


سيكون عليك من الصعب ان تشتغل في كل من الـ Front End و الـ Back End ، و بالمناسبة ، فإن كنت تتقن كليهما ، فيُسمى Full Stack Developer ، لكن ان تمتهن كليهما أمر جد صعب و ستحتاج لسنوات من الخبرة في كل منهما ، لذلك ستضطر في وقت لاحق الى ان تشتغل انت و صديقك ( إثنين على الأقل ) و ربما أكثر على مشروع برمجي واحد ، و حتى ستحتاجون جميعا الى مشاركة الأكواد بشكل تشاركي ، بحيث يستطيع كل واحد الإطلاع على الكود الذي تم إضافته من طرف الشخص الآخر دون المزج السيئ بين الكل . 
لفعل هذا انت ملزم بتعلم العمل التشاركي ، و هو رفع المشروع البرمجي على أحدى منصات العمل التشاركي و أكبرها Github و يوجد أيضا BitBucket ، و مشاركة الكود مع كل العاملين في المشروع ، و بذلك القيام بعمليات الـ Pull و الـ Push و ما الى ذلك من أجل تنسيق أكبر للمشروع و الكود البرمجي في ذات الوقت . 
نعدكم قريبا بمقال عن العمل التشاركي البرمجي بإذن الله في موقعنا . 

8 - إطلاق الموقع و تسويقه : 


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

روابط ستحتاجها مهمة في هذا الموضوع :