tag:blogger.com,1999:blog-39322265368138938422024-02-08T03:01:58.117+02:00المهووسالمهووس هى مدونة تهتم بالعلوم بشكل عام وبالبرمجة ولغاتها والتقنيات المتعلقة بعلوم الحاسب بشكل خاصUnknownnoreply@blogger.comBlogger21125tag:blogger.com,1999:blog-3932226536813893842.post-79072402910438520872019-08-03T17:16:00.000+02:002022-02-03T11:54:15.547+02:005 علامات تدل أنك مبرمج خبير. <div dir="rtl" style="text-align: right;" trbidi="on">
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhKrufAv_U4G-Vf9f89uVJXnwMIMLaMCvx0PgyNFnIWpdLlxrBXwDo_6vzn7LgZu84rezGNu02mdGts8CVE2YXbNSld-KjFEEBwWTv5IxEJV0UiG_Cb70xZeNYGN7RBp09LxvPp7d8c5zy/s1600/senior-programmer.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="senior-programmer" border="0" data-original-height="512" data-original-width="1024" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhKrufAv_U4G-Vf9f89uVJXnwMIMLaMCvx0PgyNFnIWpdLlxrBXwDo_6vzn7LgZu84rezGNu02mdGts8CVE2YXbNSld-KjFEEBwWTv5IxEJV0UiG_Cb70xZeNYGN7RBp09LxvPp7d8c5zy/s640/senior-programmer.jpg" title="senior-programmer" width="640" /></a></span></span></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><a href="https://blog.edx.org/the-3-most-lucrative-programming-skills-you-can-learn-online-for-free" rel="nofollow">blog.edx.org</a></span></span></td></tr>
</tbody></table>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">هناك مجال واسع من المهارات التي يمتلكها المطورون - والأقدمية في كثير من الأحيان لا تحدد معيار الفرد. إذن ما الذي يجعل البعض متفوقين على أقرانهم ؟ ما الذي يميزهم عن القطيع ويجعلهم أفضل من المتوسط ؟ <br /><br />إن امتلاكك لخبرة عمل لمدة خمس أو عشر سنوات أو حتى خمسة عشر عامًا لا تضمن بالضرورة أن تكون مطورًا خبيرا وفعّالًا- أو حتى يستحق اللقب. من المؤكد أن هناك الكثير من المطورين السيئين، والذين غالباً ما يكونون كبار في السن، الذين يعطون انطباعا سيئا عن المطورين الخبراء. المطورون الشباب لا يسهل عليهم الأمر أيضًا - ولكن هناك بعض السمات المعروفة والمشتركة بين صفوف كبار المطورين. <br /><br />إنها ليست سرًا تجاريًا، ولكنها وصفة لمعرفة طرق التفكير التي يمكن تطويرها. <b>وفيما يلي بعض السمات التي تساعد على التمييز بسهولة بين مطور خبير حقيقي ومطور ذو أقدمية. </b></span></span><br />
<ul style="text-align: right;">
<li><h4>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">النماذج البرمجية.</span></span></h4>
</li>
</ul>
<div style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">البرمجة الإجرائية والكائنية التوجه والوظيفة هي ثلاثية من نماذج البرمجة، إلى جانب <a href="https://questionerd.blogspot.com/2019/06/SOLID-Priciples-you-should-know.html">مبادئ SOLID</a> للتصميم الكائني التوجه وتقنيات كتابة كود نظيف والتي تشكل جزءًا كبيرا من أنماط التفكير خلف كتابة الكود. <br /><br />ما يفتقد الكثير من المطورين الصغار في رحلة البرمجة الخاصة بهم هو أن البرمجة هي لغة - مما يعني أنها تمتد إلى ما وراء القواعد النحوية. إنها أداة اتصال يمكن تنظيمها بطرق متعددة وتساعد نماذج البرمجة في إنشاء شكل معين لطريقة توصيل الشفرة الخاصة بك. <br /><br />يمكن لأي شخص كتابة التعليمات البرمجية - تمامًا كما يمكن لأي شخص كتابة رسالة نصية أو مراجعة قصيرة للكتاب على Amazon. لكن هذا النوع من الكتابة ليس بنفس مستوى رواية ستيفن كينج. تعمل نماذج البرمجة كقوة إرشادية وراء كود المطور الخبير مثلما تفعل الحبكة لكًتاب الخيال. تتكون جميع اللغات من صيغ والتي يفهمها كبار المطورين على مستوى عميق لم يختبره كثير من المطورين المبتدئين والمتوسطين. </span></span></div>
<ul style="text-align: right;">
<li><h4>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">القدرة على الإبداع.</span></span></h4>
</li>
</ul>
<div style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">عندما نبدأ في عالم حلقات "<b>for</b>" وجمل "<b>if-else</b>" لأول مرة، فإننا نميل إلى العثور على الإجابات في شكل كود جاهز للنسخ واللصق. كيف يفهمونه, هذا ما يميز بين المطورين المبتدئين و المتوسطي المستوى. <br /><br />الخبراء، على الجانب الآخر، متقدمين خطوة إلى الأمام. يمكنهم الإبداع مثل الآلهة الصغيرة في صناديقهم الرملية دون مساعدة كبيرة من بنك المعرفة العظيم Google. إنهم يعرفون ماذا يفعلون ويفهمون تداعيات تحركاتهم. يرون الحالات الطارئة، أو على الأقل يتوقعونها، ويفهمون الثغرات في الكود الخاص بهم ويعرفون كيفية تحسينها. <br /><br />إذا كانت هناك فجوة في معرفتهم ، فإنهم ينظرون إلى أبعد من مجرد السطح. يملكون فهم أعمق لكل شيء في صندوق أدواتهم. يبدو عالم الكود مختلفًا عند المطورين الخبراء. </span></span></div>
<ul style="text-align: right;">
<li><h4>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">النقد الموضوعي.</span></span></h4>
</li>
</ul>
<div style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">الجميع متحيزون لما يعرفونه. يميل المطورون الصغار والمتوسطون إلى عرض تحيزاتهم بطرق متطرفة بناءً على تجاربهم الشخصية بدلاً من التفكير المتعلق بالكود. وتصبح تفضيلاتهم الشخصية وأساليب برمجتهم وحتى اتفاقيات التسمية وطرق التفكير محور أي اقتراح أو تقييم قد يواجهونه. <br /><br />لا حرج في ذلك، حيث إنه جزء من عملية النمو. لا يتم الحصول على الموضوعية الحقيقية حتى يكون هناك ما يكفي من التجارب المتعارضة لتوفير تأثير مركزي على المطور. لا توجد طريقة صحيحة لكتابة الكود، بل توجد طرق فعالة تستند إلى المواقف والسيناريوهات. المطور الخبير يفهم هذا. إنهم يقبلون أن الكود قد لا يكون الأفضل وأن هناك مساحة للتحسين. <br /><br />غالبًا ما يصبح المطورون الأقدمون حراس فعالين للكود، فيضعون علامات على الأخطاء التي يرتكبها أقرانهم ويرون الأجزاء الضعيفة في الهيكل. إنهم قادرون على رؤية صورة أكبر بكثير وتوقع حالات الطوارئ المستقبلية مع اتخاذ الخيارات بناءً على أقل تأثير سلبي متوقع. فهم ليسوا مرتبطين بنمط واحد من للبرمجة وبدلاً من ذلك يركزون على الحل بدلاً من الأداة. </span></span></div>
<ul style="text-align: right;">
<li><h4>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">التمييز بين البرامج الجيدة والبرامج التي تعمل.</span></span></h4>
</li>
</ul>
<div style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">كمطورين ، نكتب كودًا يعمل. البعض منا يتوقف هناك ويسميه يومًا. يأخذ آخرون الأمر أبعد قليلاً ويحاولون تنظيف الكود ومعرفة الأخطاء المحتملة. إن أفضل المطورين هم أولائك المحترفون الذين يقومون بتحرير وإعادة كتابة التعليمات البرمجية الخاصة بنا في أتناء قيامهم بكتابة أكوادهم وقبول الفاشلة منها كما هي، فقط يقومون بتحسينها في أقرب وقت ممكن لأنهم يعرفون الفرق بين البرامج الجيدة والبرامج التي تعمل. <br /><br />يركز معظم الرؤساء فقط على ما إذا كان البرنامج يعمل ، لكن المطور الجيد يعرف أفضل. انهم يفهمون التكاليف الخفية للديون التقنية ورائحة الكود السيئ. إنهم يفهمون كيفية موازنة متطلبات البرامج التي تعمل مع البرامج الجيدة للسير في خط دقيق من مفاوضات تسليم المشروع في الوقت المحدد. <br /><br />إن اتساع نطاق معرفتهم وفهمهم للأطر واللغات يجعلهم خبراء في تحديد الفرق بين البرامج الجيدة والبرامج العاملة - وكيفية إنشاء كليهما - ويمنحهم القدرة على التوصل إلى حلول إبداعية عندما يتطلب الوضع ذلك. </span></span></div>
<ul style="text-align: right;">
<li><h4>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">القدرة على التعليم.</span></span></h4>
</li>
</ul>
<blockquote class="tr_bq">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">"المعلم المتوسط يقول. المعلم الجيد يشرح. المعلم المتفوق يوضح. المعلم العظيم يلهم. "- ويليام آرثر وارد </span></span></blockquote>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">كبار المطورين الحقيقيين لديهم شغف معين بهم يلهم أقرانهم الأقل خبرة في مجالهم ، مما يساعد على تلميع الجيل القادم من الماس. <br /><br />البرمجة في حد ذاتها هي عبارة عن مجموعة من الأفكار والخبراء لديهم القدرة على ترجمتها إلى شيء موجز وسهل الهضم. إن قدرتهم على التواصل وتحويل الشفرة بين الواجهات والوسائط المختلفة توضح فهمهم الحقيقي للغة التي اختاروا إتقانها. <br /><br />هناك مستوى من الإتقان المطلوب لتصبح معلماُ لأي شيء. في حين أن "الخبرة" قد تأتي في شكل مشاريع على سيرهم الذاتية ووقت طويل في شركات مختلفة، فإن التدريس مهارة متاحة فقط لأولئك الذين يفهمون حرفتهم حقًا. </span></span><br />
<ul style="text-align: right;">
<li><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">كلمات أخيرة.</span></span></li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">المطور الخبير الحقيقي هو مخلوق متعدد الأوجه يتنكر في بعض الأحيان لغوياً كمطور مبتدئ أو متوسط في مناطق خارج مجالهم الرئيسي ولكن لديه أساس قوي في فهم فلسفات البرمجة. <br /><br />ومع ذلك ، فإن السمات المذكورة أعلاه موجودة في شخصيتهم وعمق معرفتهم. مما يمنحهم ميزة اجتياز مناطق غير معروفة من الأمور البرمجية أسرع من المبرمج العادي. غالبًا ما يكونوا من المفكرين في الصورة الكبرى ويرون الكود بعقلية مستنيرة <br /><br />سوف يدافعون عن عادات كتابة الكود النظيف ويوجهون أقرانهم تجاهها دون أن يكونوا قوة تحيز مدمرة. إنهم متساهلون على أخطاء أقرانهم ويقبلونها بهدف تثقيفهم وتعليمهم بدلاً من تدميرهم. <br /><br />يمكن أن يكونوا في أي عمر ، أو ينتمون إلى أي خلفية ، ويحملون أي عدد من سنوات الخبرة. هم حل المشاكل الحقيقية والمفكرين على المدى الطويل. فهل لديك ما يلزم لتكون منهم؟ <br /><br /><br /><b>لا تنس كتابة رأيك في المقال إذا أعجبك, وإذا كان لديك أي آراء أو اقتراحات فسأكون سعيدا بتلقيها. </b></span></span> <span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><br /><br /><a href="https://medium.com/better-programming/the-marks-of-a-true-senior-developer-d5f3b11c3375" rel="nofollow">مترجم.</a></span></span><br />
<br />
<br />
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"> </span></span></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-59305008831245891092019-07-29T19:36:00.000+02:002019-07-30T16:28:31.399+02:0030 شيء تمنيت لو عرفتها عندما بدأت في البرمجة(الجزء الأخير).<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQnVXb4Jo2C4mQ57f_liROOjb_JzgzV_BuoURc0-A1gPWA5Yap_uygwgZhQl33UBjPl8v3lY3xXej-jiN8nXASACqcdrea7FhLGrThQm8YE6B4AQGu16CKjArUqBbgmreP3IzwAg7EV0th/s1600/how-to-become-a-developer.jpeg" imageanchor="1"><img alt="programming-advice" border="0" data-original-height="448" data-original-width="713" height="402" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQnVXb4Jo2C4mQ57f_liROOjb_JzgzV_BuoURc0-A1gPWA5Yap_uygwgZhQl33UBjPl8v3lY3xXej-jiN8nXASACqcdrea7FhLGrThQm8YE6B4AQGu16CKjArUqBbgmreP3IzwAg7EV0th/s640/how-to-become-a-developer.jpeg" title="programming-advice" width="640" /></a></span></span></div>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><br /></span></span>
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">21- سوف يقال لك أنك عظيم. </span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">في بعض الأحيان في حياتك المهنية، ستشعر وكأنك نجم. سيخبرك المديرون الذين يعتمدون عليك في إكمال مشاريعهم كم أنت عظيم ليقوموا بتحفيزك. سوف تشعر أنك على قمة العالم. تذكر أن هذه الأمور جذابة للأنا خاصتك. ابقى على الارض. فهناك دائما تقنيات جديدة لتتعلمها. هناك دائمًا مبرمجون جدد أفضل منك. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">22- سوف يقال لك أنك لا تعرف شيئا. </span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">في بعض الأحيان في حياتك المهنية ، سوف تشعر أنك لا تعرف أي شيء. شخص ما محبط من المشروع سيجعله حجة لإخبارك أنك لا تعرف أي شيء. ربما يفعل ذلك لوضعك في مكانك. ولكن ، بما أنك تقرأ هذا، فستأخذه خطوة بخطوة. لأنك ربما تعرف أكثر بكثير مما تعتقد أنك تعرفه. كل يوم يمر، سوف تتعلم أكثر بقليل من اليوم السابق. بعد عام، سوف يتطلع الناس إليك. وبعد مرور بعض الوقت ، قد تكسب احترام الشخص الذي أخبرك أنك لا تعرف شيئًا. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">23- سوف تود منافسة المبرمجين الذين تحترمهم وتعجب بهم. </span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">واحدة من أكثر جوانب البرمجة روعة هي المنافسة. أحب البرمجة مع الناس الذين أعجب بهم. عندما يمكنك كتابة برمجية يمدحها مبرمجًا جديراً، فسوف تشعر أنك ربحت اليانصيبً. المنافسة في البرمجة هي دائما في متعة. لا يتعلق الأمر بمن هو الأفضل. الأمر يتعلق بالتعلم من بعضنا البعض. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">24- لن تفهم كلمة مما يقول زملاؤك في العمل.</span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">في البداية ، قد يحدث هذا مرة في الأسبوع أو مرة في الشهر. في وظيفتك الجديدة، لن تفهم ما قاله زميلك للتو. وقد يكون ذلك لسببين. الأول هو أنت، فلا يمكنك أن تفهم لهجتهم. في هذه الحالة، اطلب من زميل عمل آخر أن يترجم. لا عيب في عدم القدرة على فهم خطاب شخص ما. لقد استغرق الأمر سنوات لزملائك ليعتادوا على اللهجة أيضا. والسبب الآخر هو أنك لم تفهم المفهوم الذي قاله زميلك للتو. هذا ايضا عادي جدا. ففي النهاية، زميلك هو الخبير. اطلب من زميلك في العمل شرح ذلك كله في ببساطة. وربما ترغب في سحب كرسي لهذا الغرض. فقد يستغرق هذا بعض الوقت. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">25- سوف تشعر بالعار عندم تنظر إلى كود "السباجيتي" الذي كتبته.</span></span></h3>
<blockquote class="tr_bq">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">(هو الكود المكتوب بطريقة سيئة فلا أحد سيتمكن من قراءته أو فهمه أو حتى إصلاحه). </span></span></blockquote>
<br />
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">هذا يحصل طوال الوقت. لقد تعرضت للنقد بسبب كود "بيرل" عندما بدأت البرمجة. لقد كان موثقًا جيدًا تم تصميمه جيدًا أيضًا. لكنني كتبت بطريقة كان من الصعب قراءتها. لذلك، هو كود سباجيتي. لكن، كل عام، وبغض النظر كم أحاول، ما زلت أجد بعض رموز السباجيتي التي كتبتها بسرعة لإنجاز المهمة. هذا ما يفعله المبرمجون. نصلح الأشياء ونصلح الأمور. ليس هناك عيب في ذلك. عندما تدرك أنك فعلت ذلك، فقط تراجع واصلحه إذا استطعت. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">26- سوف تلجأ إلى مشاريع قواعد البيانات عندما تكون تعبا من قراءة المزيد من الكود. </span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">يحدث هذا عندما تكون في رحلة لطيفة مع البرمجة. لقد استمرت شهرين كاملين. أنت بحاجة إلى استراحة. لكنك تريد بعض الزخم حتى تستمر. ثم تدرك أن SQL ممتعة إلى حد كبير. لا يمكنك معرفة لماذا ولكن لا يمكنك النظر إلى سطر آخر من التعليمات البرمجية. ولكن بطريقة ما، أصبح وضع البيانات في قاعدة البيانات وإخراجها حدثًا ممتعًا. أنت تكشف الآن عن بساطة لغة منطقية تمامًا. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">27- سوف تحب وتكره الهاكثون في نفس الوقت. </span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">الهاكاثون شائعة في هذه الأيام. المبرمجون يدخلون في فرق ويتنافسون مع بعضهم البعض. وأثناء ذلك، تكون عبارة عن تعلم مكثف في غضون ساعات قليلة. سوف تحب الهاكثون بسبب وجود الصحبة الجيدة. وسوف تكرهها بسبب متلازمة النفق الرسغي التي ستصيبك بسبب الكتابة بسرعتك القصوى. سوف تكره أيضًا الغرف المزدحمة التي تعمل فيها والإفراط في التحفيز الحسي الذي تتلقاه خلال الحدث. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">28- سوف تعتقد أنك لا تفهم اللإنجليزية عند قراءتك للأوراق البحثية. </span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">هل تتحدث الانجليزية؟ حسنًا، سيقول معظم الناس نعم. لكنني أضمن لك أنك سوف تقرأ بعض الأوراق البحثية مرارًا وتكرارًا وتدرك أنك لا تفهم شيئا. بالنسبة لي، يبدو أن معظم الأبحاث حول الخوارزميات كانت بمثابة غابة عملاقة قبل أن أتعلم أسس الرياضيات في الكلية. بعد ذلك، فجأة ، بدا كل شيء منطقيًا. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">29- سوف تشتري سماعات للرأس. </span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">في مرحلة ما من حياتك المهنية ، ستدرك أن أي نوع من الضوضاء يعوق حواسك عندما تركز بشدة على البرمجة. وجود سماعات رأس جيدة تلغي الضوضاء الخارجية ستتيح لك العمل في غرف مزدحمة بتركيز. ويمكن أيضًا أن تجد الموسيقى تساعدك على التركيز. لقد اكتشفت في وقت مبكر من حياتي المهنية في البرمجة أن الإيقاع في الموسيقى يساعدني كثيرا. حتى الآن، أسمع بعض الموسيقى عندما أحتاج إلى أن أكون منتجًا. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">30- سوف تتم دعوتك للاجتماعات. </span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">في مرحلة ما من حياتك المهنية ، ستكون في مجموعة المطورين الذين يمثلون أهمية كبيرة لشركتك. عندها سيتم دعوتك إلى الاجتماعات. وهي المكان الذي يجتمع فيه محترفو التكنولوجيا معًا. قد تستخدمها الإدارة العليا كفرصة للتعرف عليك. لقد حان الوقت للتواصل مع أقرانك. <br /><br /><br /><br />إلى اللقاء. <br /><br /> <br /><a href="https://medium.com/better-programming/30-short-things-i-wish-i-knew-all-this-when-i-started-programming-b17667e3df0c" rel="nofollow">مترجم.</a><br /> <br /></span></span></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-59771674373319869142019-07-27T16:22:00.001+02:002019-07-30T16:28:50.104+02:0030 شيء تمنيت لو عرفتها عندما بدأت في البرمجة(الجزء الثاني).<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjfhsD8WFB2J5DP8fTs8lxZuiE6RoZWcRn2_yXlj4fpecbL_vkvkhk1-wSeCl8QNUripXrBlQbgPkPioLvdTNzVAKfA4DhuNHmpbA9h8qY1bi6-QuyIkWtfNB7jb0jTORIMlfL4FL2hgXm/s1600/code-computer-screen.jpg" imageanchor="1"><img alt="programming-advice" border="0" data-original-height="200" data-original-width="300" height="426" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjfhsD8WFB2J5DP8fTs8lxZuiE6RoZWcRn2_yXlj4fpecbL_vkvkhk1-wSeCl8QNUripXrBlQbgPkPioLvdTNzVAKfA4DhuNHmpbA9h8qY1bi6-QuyIkWtfNB7jb0jTORIMlfL4FL2hgXm/s640/code-computer-screen.jpg" title="programming-advice" width="640" /></a></span></span></div>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><br /></span></span>
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">11- سوف تكون مهووسا بإنهاء مشاريعك. </span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">إدمان البرمجة شيء حقيقي. في مرحلة ما من حياتك المهنية في مجال البرمجة، سوف يتحول الليل إلى ماراثون برمجة. لن ترغب في الذهاب للنوم حتى تنتهي من مشاريعك. ستنسى تناول الطعام أو الشراب أو حتى القيام من مكتبك لأن عقلك يعالج الكثير من المعلومات. هذا لا باس به. بمجرد الانتهاء، خذ نزهة في الخارج أو اذهب في اجازة. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">12- قد تستغرق يوم كامل لإيجاد خطاء برمجي صغير. </span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">في كثير من الأحيان، في مشاريع البرمجة، العديد من القطع تعتمد على بعضها البعض. وفي كثير من الأحيان ، ستجد أنه لا يمكنك المتابعة ما لم تكن قد قمت بإصلاح خلل صغير واحد كامن في برنامجك. كمبرمج، يعتمد المشروع بأكمله على إيجاد هذا الخطأ. سوف تجلس على جهاز الكمبيوتر الخاص بك طوال اليوم تبحث عنه. سوف تحلم به في الليل حتى تجده. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">13- سوف تقضي معظم وقتك باحثا عن الإجابات على جوجل. </span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">إذا كنت تبرمج بلغة شائعة، فستتمكن من العثور على إجابات لمعظم المشكلات التي تواجهها عبر الإنترنت. ولكن، هناك استثناءات. ففي بعض الأحيان، لا يواجه أحد المشاكل التي تواجهها. وفي هذه الحالة، فإن البحث في كتب البرمجة والسؤال في منتديات البرمجة غالبًا ما توجهك في الاتجاه الصحيح. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">14- سوف تقرأ كتابا عن أنماط التصميم. </span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">لا يهم إذا تخرجت من أفضل برنامج لعلوم الحاسوب في البلاد. سيأتي وقت ما في مهنتك كمبرمج، حيث ستجلس وتقرأ "Head First Design Patterns" من الغلاف إلى الغلاف. ربما يكون أحد أكثر الكتب قراءةً للمبرمجين الجدد. فماذا تنتظر؟ احصل عليه واقرأه من الغلاف إلى الغلاف. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">15- سوف تصبح مهووسا بالتهجئة الصحيحة للكلمات. </span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">في مرحلة ما من حياته المهنية كمبرمج ، ستكون قد كتبت شفرة كافية بلغتك المفضلة لتتمكن من فعل الأشياء على طريقتك. يتضمن هذا التهجئة الدقيقة للأسماء التي تعطيها للمتغيرات الخاصة بك والدوال وحتى الجداول الموجودة في قواعد بياناتك. سوف تتفحصها إلى ما لا نهاية. فآخر شيء تريده هو بعض الأخطاء التي تظهر بسبب التهجئة الخاطئة. وتذكر، لا بأس في الهوس بالأشياء إذا كان لديك سبب وجيه لذلك. وعندما لا يكون لديك سبب وجيه، فهذا مجرد عادة سيئة. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">16- سوف تستسلم. </span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">كم مرة استسلمت؟ لا أستطيع حتى عدها. أحيانًا ما تصطدم بالمشاكل التي لا يمكنك حلها. في بعض الأحيان يكون الأمر صعبًا لدرجة أنك سوف تريد التوقف. في بعض الأحيان تجعلك بيئات العمل ترغب في الاستسلام. شغفك يعتمد على ثباتك عندما يتم اختبارك. هل أنت هنا لتبقى أم ستذهب؟ لقد عدت دائما. في بعض الأحيان، بعد بضع سنوات من عدم كتابة حتي سطر واحد، كنت دائماً أعود كشخص جديد مستعد لمعالجة المشروع. عندما تعرف أنك تحب عملك. عندها يصبح منزلك، ونقطة انطلاق لمغامراتك. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">17- سوف تبدأ من جديد. </span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">إذا كنت تؤمن بالقوى العليا ، سوف تفهم ما أقول. في كل مرة ، عندما أرى الناس يعودون إلى البرمجة ، لا يفعلوا ذلك من أجل المال مطلقًا. بل حبا في البرمجة. عندما ترى شخصًا يستمتع بالبرمجة مثلما كنت معتادًا ، ستحسده. فلا يمكنك السماح بذلك. ثم فجأة، ستعود لمتابعة مشاريعك. أنت تعرف في قلبك أنك تعيش وتتنفس الكود. عندما ستعلم أنك مبرمج حقيقي. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">18- سوف تلتحق بالدورات لمعرفة الطريقة "الصحيحة" لفعل الأشياء. </span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">حتى أفضل المبرمجين الذين يتخرجون من برامج النخبة بدرجة الماجستير في علوم الحاسوب سيواصلون تعليمهم في العمل. في الواقع، يعد التدريب أتناء الوظيفة أحد أفضل الامتيازات للعمل لدى شركات التكنولوجيا الكبيرة. سترسلك الشركات في دورات وندوات "باهظة الثمن" لتدريبك على أحدث التقنيات التي تريد استخدامها. إذا كنت لا تتعلم في مكان عملك، فتواصل مع أكاديميات البرمجة عبر الإنترنت ومقاطع فيديو اليوتيوب لشحذ مهاراتك. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">19- سوف تعمل لدى أشخاص لا تود العمل لديهم. </span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">حتى لو كنت مبرمجًا متواضعًا ، سيأتي وقت تحتاج فيه بعض الشركات إلى مهاراتك. عندما يجرون مقابلات معك، حاول أن تتذكر أنك تجري معهم مقابلة أيضًا. ووفقًا لثقافة الشركة ، قد تجد نفسك تريد أن تقول "لا" لحزمة رائعة. كمبرمج، سوف تعمل لساعات طويلة. من الأهمية بمكان العثور على شركة ذات ثقافة يمكنك أن تتناسب معها. فالسعادة تؤدي إلى عمل أفضل. إذا كانت مهاراتك مطلوبة، فسوف تدق شركات أخرى على بابك. ولكن أرجو منك عدم التسوية ما لم يكن ذلك ضروريا. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">20- سوف تخفق في المقابلات التقنية. </span></span></h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">المقابلات التقنية ليست مزحة. غالبًا ما يصنع كبار المبرمجين أسئلة المقابلة التقنية للمتعة. في كثير من الأحيان، هذه الأسئلة تكون صعبة للغاية. إذا فشلت في المقابلة التقنية، فهذه ليست نهاية العالم. بالتأكيد لا تقول أي شيء عن قدراتك البرمجية. إنها تختبر فقط قاعدتك المعرفية. حاول أن تنظر للجانب المشرق. إذا كانت مهاراتك مع الناس متألقة، فسوف يتذكرك المديرون. إذا كانوا يحبونك ولم تكن مناسبًا لهذه الوظيفة، فقد يستمرون في الاتصال بك لشغل منصب آخر. </span></span><br />
<br />
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><b>انتظر البقية في الأجزاء القادمة, إذا كان لديك أي آراء أو اقتراحات فسأكون سعيدا بتلقيها. </b><br /><br /><br />إلى اللقاء. <br /><br /> <br /><a href="https://medium.com/better-programming/30-short-things-i-wish-i-knew-all-this-when-i-started-programming-b17667e3df0c" rel="nofollow">مترجم.</a><br /> </span></span><br />
<br />
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-57287435586978534112019-07-25T21:17:00.001+02:002019-07-25T21:17:33.512+02:0030 شيء تمنيت لو عرفتها عندما بدأت في البرمجة(الجزء الأول).<div dir="rtl" style="text-align: right;" trbidi="on">
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiXLgJfplvg2jCw69o5NFius9fh8iBWxyC3EpARUGo6f8Q3F68nBuau50IaNi7Li84bEJ4f65AXpE1_Mt4WK7c9gdfO8bhErwGs0uoJKlrgtoAsOQXyDqj7c-KN6f2ElPeSuDf4SWpxEs9/s1600/apple-black-and-white-black-and-white-169573.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="programming-tips" border="0" data-original-height="853" data-original-width="1280" height="426" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiXLgJfplvg2jCw69o5NFius9fh8iBWxyC3EpARUGo6f8Q3F68nBuau50IaNi7Li84bEJ4f65AXpE1_Mt4WK7c9gdfO8bhErwGs0uoJKlrgtoAsOQXyDqj7c-KN6f2ElPeSuDf4SWpxEs9/s640/apple-black-and-white-black-and-white-169573.jpg" title="programming-tips" width="640" /></a></span></span></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">نصائح للمبرمج المبتدئ</span></span></td></tr>
</tbody></table>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><br />البرمجة ليست وظيفة سهلة. فمع تزايد أعداد المتخرجين في مجال علوم الحاسب, أصبحت من أكثر المهن تنافسية. وفي نفس الوقت تصبح ممتعة اكثر فأكثر مع التقدم التكنولوجي والابتكارات الجديدة التي تظهر كل يوم. <br /><br />عندما بدأت البرمجة منذ أكثر من 15 عام مضت, تمنيت لو أن أحدا أخبرني هذه النصائح. كانت لتوفر علي وعلى أي مبرمج مبتدئ الكثير من الجهد ووجع الرأس. </span></span><h3 style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">1- لا تحتاج إلى درجة علمية لتصبح مبرمجا, ولكن إلى المعرفة. </span></span></h3>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">لقد عملت مع الكثير من المبرمجين الذين لم يحصلوا على درجة الماجستير في علوم الحاسب ولا حتى درجة البكالوريوس. فالبرمجة من المهن القليلة التي لا تعتمد على الشهادات الجامعية, ولكنها تعتمد على المعرفة بشكل كبير, لذا عليك قراءة هذه الكتب إذا أردت أن تسلك طريق البرمجة. فهذه الكتب العشرة سوف تغطي مبادئ علوم الحاسب وكذلك كيفية العمل داخل الفريق مؤسسة بذلك قاعدة صلبة لتبدأ منها تطوير مهاراتك. </span></span><h3 style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">2- البرمجة تتطلب الإبداع على رأس مهارات حل المشكلات. </span></span></h3>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">الكثير من الناس يعتقدون أن البرمجة تعتمد على التحليل ومهارات حل المشكلات. وهذا في الواقع نصف الحقيقة. البرمجة أيضا تتطلب الإبداع. ففي بعض الأحيان تكون هناك أكثر من طريقة لحا المشكلة, وهنا يأتي دور الإبداع ليمكنك من حلها بأبسط الطرق واكثرها فاعلية. </span></span><h3 style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">3- لا يمكنك تعلم كل شيء, ركز على القليل من الأشياء حتى تتقنها. </span></span></h3>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">يوجد المئات من لغات البرمجة, وهناك العديد من المسارات التي يمكن أن تأخذها مثل: تطوير الويب, مطور قواعد بيانات, مهندس برمجيات, ... فحدد المسار الذي تريده وتعلم كل التقنيات التي تخصه. </span></span><h3 style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">4- لا تحتاج أن تكون روبوت, الأفضل أن تكون إنسان. </span></span></h3>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">لا تنسى كونك إنسان أولا ثم مبرمج ثانيا. يمكنك ان تنسى نفسك بسهولة عندما تبدأ في البرمجة. هنا أيام لم أترك فيها جهاز الحاسوب خاصتي إلا بعد الانتهاء من البنى الأساسية من مشروعي. ولكن في النهاية إنسان عليك أن تضحك وتبكي, تتحدث مع أصدقاءك. بممارسة حياتك جيدا خارج العمل يمكن أن تجلب الإبداع إلى عملك كمبرمج. </span></span><h3 style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">5- البرمجة هي تطبيق المعرفة وليس حفظها. </span></span></h3>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">على عكس الأبحاث, حيث تبتكر ميادين جديدة من المعرفة. البرمجة هي تطبيق المعرفة الموجودة بالفعل. من الكتب, الأوراق البحثية, المقالات الموجودة على الإنترنت و كذلك الفيديوهات التعليمية. ولا حاجة لك أن تحفظ أي شيء, لأنك تستطيع الذهاب لمصدر متى شئت لتجد ما تريد. أما الحفظ يأتي بشكل طبيعي سعد عملك على الكثير من المشاريع. </span></span><h3 style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">6- سوف تتعامل مع متلازمة المحتال كل يوم. </span></span></h3>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">تعتبر البرمجة من المهن الجاذبة للأشخاص الأذكياء, ما لم تكن عبقريا, ستواجه كما أفعل متلازمة المحتال كل يوم. عندما تواجهها باستمرار ستتمكن من إيجاد طريقة للتعامل معها. بالنسبة لي فلقد استخدمتها كدافع لتعلم أشياء جديدة باستمرار. </span></span><h3 style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">7- يجب أن تكون لديك حياة خارج مهنتك كمبرمج, غير ذلك ستكون مجرد مدمن على البرمجة. </span></span></h3>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">سيكون هناك أوقات حيث ستتحول إلى راهب في منزلك, رغم ذلك يجب عليك لكي تكون سعيدا أن يكون لديك حياة خارج شاشة حاسوبك. أحيانا يعتمد نجاحك على الأشخاص الذين تقابلهم, فالعلاقات ضرورية جدا بالنسبة للمبرمج. <br /><br />هذه الحياة خارج الشاشات ستمنعك من الإدمان على البرمجة. </span></span><h3 style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">8- ستتعلم البرمجة بشكل أسرع عندما تتعلمها مع أحد ما. </span></span></h3>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">في بداية حياتك المهنية سوف تنكب على قراءة تلك الكتب العشرة مغلقا باب غرفتك على نفسك لتتمكن من اكتساب المعرفة الكافية لتأسيس نفسك في المجال. ولكن احذر ماذا, سوف تتمكن من التعلم أسرع إذا وجدت رفيقا. حيث ستتمكن من الحصول على مراجعات مستمرة لكودك البرمجي, وسوف تتمكنان من مساعدة بعضكم البعض في التعلم وحل المشكلات البرمجية. </span></span><h3 style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">9- لا تحتاج أن تكون بارعا في الرياضيات والعلوم. </span></span></h3>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">في مجال التكنولوجيا ، سوف تقابل جميع أنواع المبرمجين الخارقين الذين وجدوا جانب التفكير المنطقي في البرمجة بعد عمر طويل قضوه في تعلم الفنون. هناك الكثير من الرسامين والكتاب الذين يبرمجون أثناء ممارسة الفن. كل ما تحتاجه لتكون مبرمج جيد هو المثابرة. البرمجة عمل شاق. ولكن بمجرد اتقانها، يمكن لأي شخص الاطلاع على كتب البرمجة والتقاط الأساسيات. <br /><br />هناك الكثير من الأشخاص الذين يلتقطون الرياضيات بعد العمل في البرمجة لفترة من الوقت. في النهاية ، يمكن لهؤلاء الأشخاص فهم الخوارزميات المعقدة وتنفيذها دون أي نوع من التعليم الرسمي للرياضيات. </span></span><h3 style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">10- أنت بحاجة إلى أن تكون "متعلم" من الدرجة الأولى. </span></span></h3>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">المبرمج هو متعلم من الدرجة الأولى. قد لا تبدأ كونك متعلمًا جيدا. ولكن سوف تكتسب هذه المهارة. في بعض الأحيان ، سيطلب منك مكان عملك تعلم ثلاث لغات برمجة في ستة أشهر. هذه هي حالة الابتكار التكنولوجي. كمبرمجين ، نتعلم كل يوم. التعلم مثل التنفس. إذا كنت غير مرتاح للتعلم كل يوم ، فستضطر إلى التعود على ذلك. <br /><br /><b>انتظر البقية في الأجزاء القادمة, إذا كان لديك أي آراء أو اقتراحات فسأكون سعيدا بتلقيها. </b><br /><br /><br />إلى اللقاء. <br /><br /> <br /><a href="https://medium.com/better-programming/30-short-things-i-wish-i-knew-all-this-when-i-started-programming-b17667e3df0c" rel="nofollow">مترجم.</a><br /> <br /><br /> </span></span></div>
Unknownnoreply@blogger.com2tag:blogger.com,1999:blog-3932226536813893842.post-16114397938093896652019-07-15T11:16:00.001+02:002019-07-15T11:16:39.091+02:00 كيف تصبح مطور ويب وتحصل على وظيفة في أسرع وقت؟ (الجزء الأخير).<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDUPE2Vulk0KXEpij7qSGhwpiwc8dk4mj98c3cqorXvc9Rr4t4BdKNzQl_CFsPrCf04klr7Ag5f1Mw8DSPUYq0YUqbB7lDuYRhzMQERGO_oSqTPFXsAxRNLJmoLLQ6VdMgBHU_MaW7D0gk/s1600/javascript.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="javascript" border="0" data-original-height="720" data-original-width="1280" height="360" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDUPE2Vulk0KXEpij7qSGhwpiwc8dk4mj98c3cqorXvc9Rr4t4BdKNzQl_CFsPrCf04klr7Ag5f1Mw8DSPUYq0YUqbB7lDuYRhzMQERGO_oSqTPFXsAxRNLJmoLLQ6VdMgBHU_MaW7D0gk/s640/javascript.jpg" title="javascript" width="640" /></a></span></span></div>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><br /></span></span>
<br />
<ul style="text-align: right;">
<li><h3>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">استمر في التعلم والتطوير من نفسك.</span></span></h3>
</li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">ربما لن تحصل على الوظيفة في الأسابيع الأولى من بحثك, أو حتي الشهور الأولى. ولكن هذا يعطيك فرصة لتعلم المزيد والتطوير من مهاراتك. <br /><br />أنت تمتلك الأن المهارات الأساسية لمطور الويب المبتدئ, ولآن يمكنك أن تبدأ بتعلم مهارات اضافية, فهذه المهارات ستزيد من فرص توظيفك وتصبح مرغوبا في سوق العمل. وإليك بعض المهارات لتتعلمها: </span></span><br />
<ul style="text-align: right;">
<li><h4>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">تعلم احدى مكتبات لغة جافا سكريبت.</span></span></h4>
</li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">تعلم احدى المكتبات يمكن أن يجعل حياتك أسهل, وأحدى أشهر هذه المكتبات هي jQuery والتي تمكنك من عمل أشياء معقدة بسهولة تامة كالتلاعب بعناصر DOM مثلا وغبرها الكثير مما ستتعلمه عندما تستخدمها. </span></span><br />
<ul style="text-align: right;">
<li><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><b>إكمال دروس HTML and CSS والتي تركناها في البداية.</b></span></span></li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">يمكنك إكمال الدروس المتعلقة ب applied visual design, applied accessibility, CSS grid. </span></span><br />
<ul style="text-align: right;">
<li><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><b>تعميق معرفتك باللغات البرمجية التي تستخدمها.</b></span></span></li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">مارسها يوميا واعرف المزيد عنها وعن كيفية عملها, وعن اسرارها وطرق تسريع العمل بها كالمكتبات واطر العمل. استمر في بناء المشاريع ووضعها في معرض أعمالك الذي بنيته. </span></span><br />
<ul style="text-align: right;">
<li><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><b>تعلم كيف تعمل الجافا سكريبت.</b></span></span></li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">قدرتك على استخدامها والبرمجة باستخدامها شيء رائع جدا, ولك فهم طريقة عملها أروع بكثير وسيمكنك كن أن تصبح مبرمج أفضل حيث سيمكنك هذا الفهم من كتابة كود أفضل من حيث السرعة والأداء . <br /><br />وللوصول إلى هذا الفهم أرشح لك (<a href="https://github.com/getify/You-Dont-Know-JS" rel="nofollow">you don't know JS</a>). <br /><br />وهي سلسلة من الكتب التي تشرح جافا سكريبت بعمق, حيث تشرح هذه الكتب اللغة من الأساسيات حتى المفاهيم المعقدة في اللغة, وفهمها سوف يعطيك أساسا جيدا للتطور إلى الأفضل. يمكنك أن تقرأها بشكل مجاني تماما في الرابط المذكور أعلاه. </span></span><br />
<ul style="text-align: right;">
<li><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><b>بناء الكثير من المشاريع.</b></span></span></li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">لتطوير مهاراتك وممارسة ما تتعلمه عليك ببناء الكثير من المشاريع. عليك التركيز على تلك المهارات التي لا تتقنها جيدا حتى تفهمها أكثر. ابني مشاريع من أفكارك أو قلد أخرى موجودة لا تتوقف عن الممارسة. <br /><br />عل بالمشاريع أن تتطور مهاراتك, فإذا كان سهلا جدا أو صعبا جدا عليك التوقف واختيار آخر في مستوى يناسبك. <br /><br />عند بناءك المشاريع يمكن أن تحتاج لتعلم مهارة جديدة تماما. التعلم أثناء الممارسة هو طريقة جيدة للتعلم. </span></span><br />
<ul style="text-align: right;">
<li><h3>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">مقابلات العمل.</span></span></h3>
</li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">بعد أن قدمت على العديد من الوظائف, أخيرا حان وقت مقابلة العمل. إنه وقتك لتلمع. هنا كالعديد من المقالات التي تشرح هذا الأمر, ولكن بدون الكثير من التفاصيل. ركز على هذه الأشياء الرئيسية والتي يشرحها هذا <a href="https://medium.com/@samwsoftware/how-to-secure-the-job-of-your-dreams-by-smashing-your-interview-61f38b7cdd0e" rel="nofollow">المقال</a>). </span></span><br />
<ul style="text-align: right;">
<li><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">أعرف ملف cv الخاص بك. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">أعرف معلومات عن الشركة. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">مارس مهاراتك كثيرا. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">كن مبكرا, مهذب وواثق من نفسك. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">أسأل أسئلة.</span></span></li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">إذا أتبعت هذه النصائح سوف تزداد فرصك للحصول على الوظيفة. وإذا لم تحصل عليها فأعرف ماذا كان نقاط ضعفك والأسباب وأعمل على تحسين نفسك أكثر وتجنبها في المرات القادمة. <br /><br /><br />حسنا... تعرف الأن ماذا تفعل لتصبح مطور للويب وكذلك كيف تحصل على وظيفة بسرعة عبر تعلم المهارات الازمة لذك والاستمرار في تطوير نفسك وبناء معرض أعمال رأئع يجذب أصحاب العمل. <br /><br /><br />إلى اللقاء. </span></span><br />
<br />
<br />
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-87892488940321770182019-07-12T13:51:00.000+02:002019-07-12T13:51:30.725+02:00كيف تصبح مطور ويب وتحصل على وظيفة في أسرع وقت؟ (الجزء الثاني)<div dir="rtl" style="text-align: right;" trbidi="on">
<h3 style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"> </span></span><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfBxlqCnWXhpmaeieerO3JtU-fBeCTAgx4bhJ9Fi7lj_XNCfhWFWmbpo_q__FlaVRSScgG8ej9G6TZB0JzHA5SWf3Fe3WVPvNNJhOCWeyGAPcBNkxarZgi1KO_FGfxwi2Tb_ii41cy64x2/s1600/css_penguen.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="css shape" border="0" data-original-height="616" data-original-width="810" height="486" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfBxlqCnWXhpmaeieerO3JtU-fBeCTAgx4bhJ9Fi7lj_XNCfhWFWmbpo_q__FlaVRSScgG8ej9G6TZB0JzHA5SWf3Fe3WVPvNNJhOCWeyGAPcBNkxarZgi1KO_FGfxwi2Tb_ii41cy64x2/s640/css_penguen.png" title="css shape" width="640" /></a></span></span></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">شكل باستخدام css</span></span></td></tr>
</tbody></table>
</h3>
<h3 style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">ب- ابدأ بوضع الخطة. </span></span></h3>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">بما أنه ليس بمقدور الجميع الذهاب إلى تلك الدورات التدريبية أو الحصول على مدرب, سوف أعطيك خطة تمكنك من الحصول على وظيفتك كمطور. وهذا تقريبا ما فعلته لأتحول من مهندس لمطور في 4 أشهر فقط.</span></span><br />
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">وهي كالتالي: </span></span><br />
<ul style="text-align: right;">
<li><h4>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><b>جد وظيفة.</b></span></span></h4>
</li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">لتتمكن من صنع خطة عظيمة, عليك ان تمتلك هدفا تود تحقيقه. وهدفنا ها هو الحصول على وظيفة بأسرع ما يمكن. كلما حصلت عليها أسرع, كلما تمكنت من ممارسة البرمجة يوميا وكذلك الحصول على الدعم من المبرمجين المحترفين وفوق كل هذا ستحصل على مرتب أيضا. <br /><br />هناك الكثير من الطرق لدخول المجال, من الذكاء الاصطناعي إلي علم البيانات وتطوير الألعاب, ولكن المجال الأسهل هو تطوير الويب. أما إذا كنت تود البدء في مجال آخر فأعلم أن دخولك مجال تطوير الويب لا يعني أنك ستعمل به دائما. سوف تتعلم الكثير خلال مسيرتك بحيث تتمكن من الإنتقال إلى مجالك المفضل. <br /><br />عندما بحثت عن وظائف لمطوري الويب كانت هذه أولى النتائج التي تطلب مطور ويب مبتدئ : </span></span><br />
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><br /></span></span>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzIDVo3io06W7aApaQEcIgP5lHlD4vr3SRMbwEmvHRrWXOJ8Lu24XFNcMwCY8_ddZFzg9TnAzTS3XE6qZWiEi6iG6Y2JSc3QnFBHRGZNpxN2_EQf5QbjqM5vfdslK2JNR9UGeTIA6sKEnj/s1600/job_application.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="job requirements" border="0" data-original-height="1000" data-original-width="1460" height="438" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzIDVo3io06W7aApaQEcIgP5lHlD4vr3SRMbwEmvHRrWXOJ8Lu24XFNcMwCY8_ddZFzg9TnAzTS3XE6qZWiEi6iG6Y2JSc3QnFBHRGZNpxN2_EQf5QbjqM5vfdslK2JNR9UGeTIA6sKEnj/s640/job_application.png" title="job requirements" width="640" /></a></span></span></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">متطلبات العمل</span></span></td></tr>
</tbody></table>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><br /></span></span>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">بعد النظر إلى القليل من إعلانات الوظائف المشابهة نج أن المتطلبات الشائعة هي: </span></span><br />
<ul style="text-align: right;">
<li><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">معرفة تقنيات الواجهات الأمامية مثل: HTML, CSS, javaScript </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">القدرة على صنع مواقع متجاوبة. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">أعمال لك توضح مدى خبرتك ومهاراتك. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">فهم نظم إدارة التحكم في الإصدارات (مثل git).</span></span></li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">وكذلك بعض المهارات الإضافية مثل: </span></span><br />
<ul style="text-align: right;">
<li><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">مكتبات جافاسكريبت مثل: jQuery, AJAX, Bootstrap </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">القدرة على التنقيح.</span></span></li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><br />والآن نعلم ما الذي نحتاج أن نتعلمه. وهذه هي الخطة التي سنتبعها خطوة بخطوة حتى نتمكن من تعلم هذه المهارات. </span></span><br />
<ul style="text-align: right;">
<li><h4>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><b>HTML, CSS.</b></span></span></h4>
</li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">هذه هي اللبنات الأساسية لبناء أي موقع, لذا عليك أن تكون فهما قويا لهذه التقنيات. ولحسن الحظ يوجد الكثير من الدورات المجانية والمدفوعة على الأنترنت لمساعدتك على إتقانها. <br /><br />فمثلا موقع freecodecamp يعلم كل ما تحتاج لتطوير المواقع, إنه يأخذك خطوة بخطوة من خلال دروس قصيرة وهو حيث تعلمت html, css, javascript. يمكنك أن تبدأ بشهادة تصميم الويب المتجاوب responsive web design certification وأساسيات html, html5, css. حيت تقوم هذه الدروس بتعليمك الأساسيات وبنهايتها ستتمكن من إنشاء نماذج باستخدام html وتحسينها باستخدام css. <br /><br />ولتحسين مستواك في css عليك إكمال قسم Applied visual design حتى درس "create a more complex shape using css and html", وبعد ذلك أنهي كل دروس التصميم المتجاوب ودروس css flexbox. تتخطى بعض الدروس والتحديات لأننا نود تعلم ما نحتاج في الحال, وتلك الدروس الأخرى رائعة ولكننا لا نحتاجها الآن. <br /><br />والآن لقد تعلمنا html و css لبناء وتصميم صفحات الويب. والأن فلنحصل على بعض الممارسة الفعالة من خلال إكمال مشاريع قسم تصميم الويب المتجاوب حيث ستستخدم كل ما تعلمت لبناء 5 مواقع. </span></span><br />
<ul style="text-align: right;">
<li><h4>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><b>أنظمة إدارة التحكم في الإصدارات.</b></span></span></h4>
</li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">هو نظام يسمح لك بتخزين الملفات بحيث تستطيع الرجوع إلى نسخ سابقة منه قبل إضافة تعديلات عليه أو معرفة ماهي هذه التعديلات ومتي تمت. وهو مستخدم في كل شركات البرمجيات, ولابد لك من معرفة أساسياته. <br /><br />ولمعرف كيفية استخدام git وهو من أهم وأشهر هذه الأنظمة فهناك العديد من الدورات على الأنترنت التي تعلمك كل ماتحتاج, وبعدها يمكن إنشاء حساب على github إذا وددت مشاركة مشاريعك مفتوحة المصدر مع مجتمع المبرمجين. </span></span><br />
<ul style="text-align: right;">
<li><h4>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><b>لغة javascript.</b></span></span></h4>
</li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">وهي اللغة التي تجعل صفحات الويب حية كما يقال, فهي تحول صفحات الويب الساكنة تتفاعل مع المستخدم. وهي اللغة المستخدمة في ما يقارب 94.8% من مواقع الأنترنت. <br /><br />ولتعلم هذه اللغة يمكنك أخذ دروس javascript algorithms and data structures على موقع freecodecamp. <br /><br />وتعتبر لغة javascript لغة شديدة الأهمية في بناء مواقع الويب الحديثة فلا يكاد يخلو موقع منها, وقد بني بها الكثير من أطر العمل التي تستخدم في بناء الواجهات الأمامية. ويمكنك استخدامها في الواجهة الخلفية من الموقع "serverSide" من خلال nodejs. </span></span><br />
<ul style="text-align: right;">
<li><h4>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">بناء معرض أعمالك.</span></span></h4>
</li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">لكي تستعرض مهاراتك على أصحاب العمل, يجب أن يكون لديك معرض أعمال تجمع فيه أعمالك, ويمكن استخدام github حيت تضع عليه أعمالك لتريها لأصحاب العمل عند طلبك لوظيفة. </span></span><br />
<h3 style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><b>ج- البحث عن الوظيفة.</b></span></span></h3>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">إذا أتبعت الخطة السابقة ستمتلك متطلبات العمل كمطور ويب مبتدئ. والأن قد حان الوقت للتقديم على بعض الوظائف. <br /><br />ولك تتقدم لتلك الوظائف يجب أن تمتلك ملف cv الخاص بك والذي يحتوي على قائمة مهاراتك وبعض المعلومات عنك, ويمكنك تكوينه بمساعدة الإنترنت حيت هناك بعض المواقع التي تشرح هذا. <br /><br />ويمكنك رؤية نماذج له باستخدام محرك البحث المفضل لك. <br /><br /><br />حسنا لم يعد سوى القليل. انتظر البقية في الجزء القادم. </span></span><br />
<br />
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">إلى اللقاء.</span></span><br />
<br />
<br />
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"> </span></span></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-89459668112737023672019-06-29T10:06:00.003+02:002019-07-12T13:39:31.910+02:00كيف تصبح مطور ويب وتحصل على وظيفة في أسرع وقت؟<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<span style="font-size: large;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDKluQQSBuOby1p4appIePQXdn7cEhlsNFdnQnzvsKdyRTtjhDlarJCyZxU9b4HIkgy9KuImH7lDZMXKwRWJ1378_8h4_kKlazevKhXyxi3ePwVNy9G5BB2YCbRYKVH8hKVQSH3ZG7kwUG/s1600/how-to-become-a-developer.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="كيف-تصبح-مطور" border="0" data-original-height="448" data-original-width="713" height="402" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDKluQQSBuOby1p4appIePQXdn7cEhlsNFdnQnzvsKdyRTtjhDlarJCyZxU9b4HIkgy9KuImH7lDZMXKwRWJ1378_8h4_kKlazevKhXyxi3ePwVNy9G5BB2YCbRYKVH8hKVQSH3ZG7kwUG/s640/how-to-become-a-developer.jpeg" title="كيف-تصبح-مطور" width="640" /></a></span></div>
<span style="font-size: large;"><br /><br /> هل فكرت من قبل <a href="https://medium.com/complete-coding/become-a-developer-and-get-your-first-job-fast-7b8ac26d84c6" rel="nofollow">أن تصبح مطور للبرمجيات</a>؟ هل تود تغيير مسارك المهني؟ حسنا.. هذا المقال سيعطيك خطة صلبة لتبدأ بها مسارك المهني في تطوير البرمجيات والحصول على وظيفتك الأولى. <br /><br /><b>ولكن.. لماذا أصبح مطورا؟ </b><br /><br />وإذا كنت مترددا فدعني اعرض بعض الأسباب. </span><br />
<ul style="text-align: right;">
<li><span style="font-size: large;">هناك طلب ضخم على المطورين. في وقت كتابة هذه المقالة كان هناك ما يقرب من 37,739 وظيفة للمطرين في المملكة المتحدة وحوالي 145,640 في الولايات المتحدة. هذه الأرقام سوف تزداد في الولايات المتحدة حيت تشير إحصائيات مكتب العمل إلى حدوث زيادة بنسبة 17% بين عامي 2014 و 2024. </span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-size: large;">مجال العمل متنوع ومثير للاهتمام. فكمطور يمكنك العمل في مجال واسع من المشاريع من تجارة إلكترونية إلى ألعاب الكمبيوتر, ومن تطبيقات الهاتف إلى الذكاء الاصطناعي. ويمكنك الانتقال بين هذه المجالات مما يعني أنك لست محبوسا في مجال واحد. </span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-size: large;">العمل مرن جدا. فعملك يتمحور حول قراءة وكتابة الكود, وهذا يتطلب جهاز كمبيوتر فقط, مما يعني أنه يمكنك القيام بعملك في أي وقت ومكان, فهناك عدد متزايد من المطورين الذين يعملون عن بعد من المنزل أو أثناء سفرهم حو العالم. </span></li>
</ul>
<h3 style="text-align: right;">
<span style="font-size: large;"><b>أ- كيف تصبح مطورا؟ </b></span></h3>
<span style="font-size: large;">لتصبح مطورا يجب أن تتعلم الكثير من المهارات, وهناك عاملان أساسيان يساعدانك في اكتسابها: الممارسة الفعالة والحصول على المساعدة من المطورين المحترفين. <br /><br />وهناك عدة طرق فعالة تضعك على الطريق لتبدأ. </span><br />
<ul style="text-align: right;">
<li><h4>
<span style="font-size: large;"><b>الدورات المكثفة. </b></span></h4>
</li>
</ul>
<span style="font-size: large;">إنها رائعة بالفعل؛ لأنها مصممة لتأخذك من البداية بخبرتك القليلة أو حتى المنعدمة, وتجهزك بحيث تكون قادر على الحصول على وظيفة وذلك في غضون ثلاثة أشهر فقط. وهذا يعني الكثير من الممارسة والأخطاء والحصول على المساعدة من المطورين الذين يديرون هذه الدورات. <br /><br />وربما تجد أن هناك مشكلة مع هذه الدورات فهي تستغرق ثلاثة أشهر من الدراسة بدوام كامل, كما أنها قد تكلفك من 4000$ حتى 20000$. وهذا الكثير من المال في حين أنك لا تكسب شيئا في هذه الفترة. </span><br />
<ul style="text-align: right;">
<li><h4>
<span style="font-size: large;"><b>الحصول على معلم.</b></span> </h4>
</li>
</ul>
<span style="font-size: large;">هذا هو الوضع المثالي: أن تبدأ ومعك مطور آخر ليكون معلم لك, يمكن أن يكون من العائلة أو من الأصدقاء أو أي أحد يود مساعدتك. فمن الجيد أن يكون هناك أحد تلجأ إليه عندما تواجه مشكلة ويقوم بمتابعة عملك وتوجيهك. <br /><br />هذا يبدو عظيما ولكن, الحصول على معلم قد يكون مهمة صعبة. فليس الجميع يعرف أحدا يعمل كمطور. </span><br />
<ul style="text-align: right;">
<li><h4>
<span style="font-size: large;"><b>احصل على وظيفة كمطور. </b></span></h4>
</li>
</ul>
<span style="font-size: large;">قد يكون هذا غشا؛ لأنه يجب أن تتمكن من البرمجة لتحصل على الوظيفة. ولكني سأشرح لاحقا كيف تفعل هذا بدون دورات أو معلم, ومتى تحصل على وظيفتك الأولى, وكيف يمكنك أن تحصل على المال في مقابل ممارسة البرمجة مع المطورين المحترفين. أليس هذا رائعا؟ <br /><br />كما أن العمل في التطوير يكشف لك الجانب الآخر من العملية ألا وهو جانب الأعمال. وهذا جانب شديد الأهمية, فلا فائدة من صنع منتج لا أحد يريده. كم ان التعامل مع العملاء مهارة تحتاج وقت لتطويرها. <br /><br /> إلى هنا ينتهي هذا الجزء. انتظر البقية في <a href="https://www.questionerd.tk/2019/07/how-to-become-a-developer-2.html">الجزء القادم</a>.</span><br />
<span style="font-size: large;"><br /></span>
<span style="font-size: large;">إلى اللقاء.</span><br />
<br />
<br /></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-41179785157071516292019-06-25T13:17:00.000+02:002019-06-25T13:17:51.717+02:00دليل Docker للمبتدئ. كيف تستخدم docker-compose. <div dir="rtl" style="text-align: right;" trbidi="on">
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVejjGsDNgCHHLecw8sIQd-ldaT8e2NQ5YcwQBV9CsIqKVhyphenhyphenrcsv51mKwfe6EYUW72GqMeJNuZeek7jp5hb4tZM8TjFNkKBzYLiVcG9B5i_-iVOxR8MfM4CuAcBslSB5rcEYtm6jXTohph/s1600/docker-compose.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="docker-compose" border="0" data-original-height="533" data-original-width="1200" height="284" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVejjGsDNgCHHLecw8sIQd-ldaT8e2NQ5YcwQBV9CsIqKVhyphenhyphenrcsv51mKwfe6EYUW72GqMeJNuZeek7jp5hb4tZM8TjFNkKBzYLiVcG9B5i_-iVOxR8MfM4CuAcBslSB5rcEYtm6jXTohph/s640/docker-compose.png" title="docker-compose" width="640" /></a></span></span></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><a href="https://dev.to/uilicious/5-fatal-docker-gotchas----for-new-users-2o87" rel="nofollow">الصورة</a></span></span></td></tr>
</tbody></table>
<br />
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">بعد مقدمة قصيرة عن <a href="https://medium.com/free-code-camp/a-beginners-guide-to-docker-how-to-create-a-client-server-side-with-docker-compose-12c8cf0ae0aa" rel="nofollow">docker-compose</a> سوف تتمكن من إنشاء أول مشروع خادم/عميل باستخدام docker. <br /><br />هذه المقالة تعتمد على المقالة الأولى التي نشرتها سابقا والتي تتحدث عن الأساسيات, يمكنك قراءتها من <a href="https://www.questionerd.tk/2019/06/begain-docker.html">هنا</a>. </span></span><br />
<h3 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>في البداية, ما هو docker-compose؟</b></span></span></h3>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>هي أداة من أدوات docker والتي صممت لتسهل العمل به ولتحل مشكلة هامة والتي هي حديث اليوم</b>. <br /><br />هل لاحظت في المقال السابق البرنامج الذي صممناه ليعمل باستخدام docker ويطبع "docker is magic" عندما يعمل. <br /><br />حسنا هذا كان سهل جدا, ولكن نادرا جدا كمطور أن تصمم برنامج يعمل وحده (أي أنه لا يعتمد على أي خدمات خارجية كقاعدة البيانات مثلا). </span></span><br />
<h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>حسنا كيف تعلم أنه لابد من استخدام docker-compose؟</b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">إذا كان برنامجك يتطلب عدة خدمات للعمل معا. فمثلا إذا لديك موقع يحتاج للاتصال بقاعدة بيانات(وهنا لديك خدمتان الموقع, وقاعدة البيانات). فلابد من استخدام هذه الأداة. <br /><br />حيت يوفر لك docker-compose تشغيل كل هذه الخدمات معا بأمر واحد. </span></span><br />
<h3 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>والأن ما الفرق بين docker و docker-compose؟</b></span></span></h3>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">Docker يستخدم لإدارة حاوية (خدمة) واحدة من تطبيقك. أما docker-compose فيستخدم لإدارة عدة حاويات في نفس الوقت لنفس التطبيق. وتمكنك الأداة من بناء تطبيقات أكثر تعقيدا وإدارتها بكل سهولة. </span></span><br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0R1RpS4k2jqa5d53uQ_u_SnQTOa1F2mmZMKc2_xTuXZHnTxc5xuhMugA5T-HDkf8C6Nw9ThqW4x_9QTCgEmFTQsxntrTPEEro2Wkw5kHnVe4QXnfkRum4a6H9YfKHWifkDy641XZ16OcL/s1600/docker-compose-.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="docker-compose" border="0" data-original-height="703" data-original-width="1000" height="448" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0R1RpS4k2jqa5d53uQ_u_SnQTOa1F2mmZMKc2_xTuXZHnTxc5xuhMugA5T-HDkf8C6Nw9ThqW4x_9QTCgEmFTQsxntrTPEEro2Wkw5kHnVe4QXnfkRum4a6H9YfKHWifkDy641XZ16OcL/s640/docker-compose-.png" title="docker-compose" width="640" /></a></span></span></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">Docker (individual container) VS Docker-Compose (several containers)</span></span></td></tr>
</tbody></table>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br />حسنا... دعني أوضح لك مدى أهمية هذه الأداة بمثال بسيط. <br /><br />تخيل أن لديك موقعان. الأول يكن الناس من إنشاء متاجرهم على الإنترنت بكل سهولة, والثاني مخصص لدعم العملاء. وعلى كلا الموقعين استخدام نفس قاعدة البيانات. <br /><br />والأن لقد بدأت تنجح وخادمك لم يعد كافيا. لذا قررت أن تنقل خدماتك إلى خادم آخر. <br /><br />ولسوء الحظ لم تكن تستخدم docker-compose لذا ستقوم بنقل الخدمات واحدة بواحدة مع إعادة ضبط إعدادات كل منها وتأمل الا تنسى شيئا. <br /><br />أما مع استخدام هذه الأداة سوف تتمكن من فعل كل هذا ببعض الأوامر. <br /><br />والأن دعنا نبدأ ببناء أول تطبيق خادم/عميل لك باستخدام docker-compose. <br /><br />الهدف الأن هو انشاء موقع (server) بسيط به جملة. وهذه الجملة سوف تجلب بواسطة العميل (client) باستخدام لغة بايثون. </span></span><br />
<h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>أ- ابدأ ببناء مجلد المشروع.</b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">قم بعمل مجلد على حاسوبك والذي يجب ان يحتوي على هذه الملفات: </span></span><br />
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"> ملف "docker-compose.yml" الملف الذي سيحتوي عل المعلومات الضرورية لإنشاء الخدمات. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">مجلد "server" سيحتوي على الملفات الخاصة بالخادم. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">مجلد "client" سيحتوي على الملفات الخاصة بالعميل.</span></span></li>
</ul>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">ب- قم بإنشاء الخادم. <br /><br />يجب أن يحتوي مجلد الخادم على الملفات الأتية: </span></span><br />
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">ملف "server.py" ملف بايثون الذي سيحتوي على كود السيرفر. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">ملف "index.html" ملف HTML الذي يحتوي على الجملة التي ستعرض. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">ملف "dockerfile" الذي يحتوي على التعليمات الازمة لإنشاء الخادم.</span></span></li>
</ul>
<h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>ب.1- اكتب كود بايثون الخاص بالخادم.</b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>سيبدو الكود بهذا الشكل:</b> </span></span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;">#!/usr/bin/env python3 </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># Import of python system libraries. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># These libraries will be used to create the web server. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># You don't have to install anything special, these libraries are installed with Python. </span></span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #3d85c6;">import</span> http.server </span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #3d85c6;">import</span> socketserver </span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># This variable is going to handle the requests of our client on the server. </span></span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">handler = http.server.SimpleHTTPRequestHandler </span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># Here we define that we want to start the server on port 1234. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># Try to remember this information it will be very useful to us later with docker-compose. </span></span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">with socketserver.TCPServer(("", 1234), handler) as httpd: </span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># This instruction will keep the server running, waiting for requests from the client. </span></span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">httpd.serve_forever() </span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">هذا الكود يقو بإنشاء خادم ويب بسيط وسيقوم بعرض محتويات index.html. </span></span><br />
<h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>ب.2- اكتب ملف html.</b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">سيبدو بهذا الشكل. بسيط جدا, أليس كذلك؟ </span></span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">Docker-Compose is magic! </span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">سوف يقوم الخادم بعرض هذه الجملة عنما يعمل. </span></span><br />
<h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>ب.3- اكتب ملف dockerfile.</b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>سيبدو كالمرة السابقة مع بعض التعديلات.</b> </span></span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># Just a remember, dockerfile must always start by importing the base image. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># We use the keyword 'FROM' to do that. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># In our example, we want to import the python image (from DockerHub). </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># So, we write 'python' for the image name and 'latest' for the version. </span></span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #cc0000;">FROM</span> python:latest </span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># In order to launch our python code, we must import the 'server.py' and 'index.html' file. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># We use the keyword 'ADD' to do that. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># Just a remember, the first parameter 'server.py' is the name of the file on the host. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># The second parameter '/server/' is the path where to put the file on the image. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># Here we put files at the image '/server/' folder. </span></span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #cc0000;">ADD </span>server.py /server/ </span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #cc0000;">ADD </span>index.html /server/ </span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># I would like to introduce something new, the 'WORKDIR' command.</span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># This command changes the base directory of your image. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># Here we define '/server/' as base directory (where all commands will be executed). </span></span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #cc0000;">WORKDIR</span> /server/ </span></span></div>
<h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>ج- قم ببناء العميل.</b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">يجب أن يحتوي مجلد العميل على الملفات الأتية: </span></span><br />
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">ملف "client.py" الذ يحتوي على كود بايثون العميل. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">ملف "dockerfile" حسنا... تعرف اهو.</span></span></li>
</ul>
<h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>ج.1- اكتب ملف بايثون.</b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>سيبدو بهذا الشكل:</b> </span></span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;">#!/usr/bin/env python3 </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># Import of python system library. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># This library is used to download the 'index.html' from server. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># You don't have to install anything special, this library is installed with Python. </span></span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #3d85c6;">import </span>urllib.request </span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># This variable contain the request on 'http://localhost:1234/'. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># You must wondering what is 'http://localhost:1234'? </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># localhost: This means that the server is local. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># 1234: Remember we define 1234 as the server port. </span></span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">fp = urllib.request.urlopen("http://localhost:1234/") </span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># 'encodedContent' correspond to the server response encoded ('index.html'). </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># 'decodedContent' correspond to the server response decoded (what we want to display). </span></span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">encodedContent = fp.read() </span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">decodedContent = encodedContent.decode("utf8") </span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># Display the server file: 'index.html'. </span></span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">print(decodedContent) </span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># Close the server connection. </span></span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">fp.close() </span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">سوف يحضر هذا الكود محتويات صفحة الويب من على السيرفر. </span></span><br />
<h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>ج.2- اكتب ملف dockerfile.</b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>سيبدو بهذا الشكل: </b></span></span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># Same thing than the 'server' Dockerfile. </span></span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #cc0000;">FROM </span>python:latest </span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># Same thing than the 'server' Dockerfile. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># We import 'client.py' in '/client/' folder. </span></span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #cc0000;">ADD</span> client.py /client/ </span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># I would like to introduce something new, the 'WORKDIR' command. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># This command changes the base directory of your image. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># Here we define '/client/' as base directory. </span></span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #cc0000;">WORKDIR</span> /client/ </span></span></div>
<h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>د- عودة إلى ملف docker-compose.</b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">كما تري فقد أنشأنا مشروعين مختلفين (server/client) مع ملف dockerfile لكلا منهما. لاشي مختلف عما فعلناه من قبل. <br /><br />والأن سوف نبدأ بكتابة ملف docker-compose.yml. <br /><br /><b>ملاحظة: هذا الملف ليس كاملا. </b></span></span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># A docker-compose must always start by the version tag. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># We use "3" because it's the last version at this time. </span></span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">version: "3" </span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># You should know that docker-composes works with services. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># 1 service = 1 container. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># For example, a service maybe, a server, a client, a database... </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># We use the keyword 'services' to start to create services. </span></span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">services: </span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># As we said at the beginning, we want to create: a server and a client. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># That is two services. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># First service (container): the server. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># Here you are free to choose the keyword. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># It will allow you to define what the service corresponds to. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># We use the keyword 'server' for the server. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">server: </span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># The keyword "build" will allow you to define </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># the path to the Dockerfile to use to create the image </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># that will allow you to execute the service. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># Here 'server/' corresponds to the path to the server folder </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># that contains the Dockerfile to use. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">build: server/ </span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># The command to execute once the image is created. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># The following command will execute "python ./server.py". </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">command: python ./server.py </span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># Remember that we defined in'server/server.py' 1234 as port. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># If we want to access the server from our computer (outside the container), </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># we must share the content port with our computer's port. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># To do this, the keyword 'ports' will help us. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># Its syntax is as follows: [port we want on our machine]:[port we want to retrieve in the container] </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># In our case, we want to use port 1234 on our machine and </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># retrieve port 1234 from the container (because it is on this port that </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># we broadcast the server). </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">ports: </span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">- 1234:1234 </span></span></div>
<h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>هـ- بناء المشروع.</b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">عنما تنتهي قم بكتابة هذا الأمر لبناء المشروع. </span></span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">$ docker-compose build </span></span></div>
<h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>و- تشغيل المشروع.</b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">اكتب هذا الأمر لتشغيل المشروع. </span></span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">$ docker-compose up </span></span></div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">سوف تري عبارة "docker-compose is magic" مطبوعة أمامك في سطر الأوامر. <br /><br />وإذا ذهبت إلى "http://localhost:1234/" في المتصفح سوف تري نفس العبارة. <br /></span></span> <span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /><br />الكود متاح ويمكنك رؤيته من <a href="https://github.com/gael-thomas/Client-Server-Docker-Compose-example" rel="nofollow">هنا</a>. <br /><br /><br />إلى اللقاء. <br /></span></span> <span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span> </div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-89658055331860807572019-06-22T14:26:00.001+02:002019-06-22T14:26:47.805+02:00دليل Docker للمبتدئ. مشروعك الأول.<div dir="rtl" style="text-align: right;" trbidi="on">
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcozUJ4gz8Im0XBMxfNZkaefLiCj61WmyLhv_AKPNMAa3U7635p5rjRzbaRnpZc3xgKSR9NJLvwvIj5clOjz471JFeRfFKMvUlo1RQKqdxXqU4rxroiIne6HeQpfXrarvYpjCOu8iYpELA/s1600/docker.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="docker" border="0" data-original-height="933" data-original-width="1200" height="496" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcozUJ4gz8Im0XBMxfNZkaefLiCj61WmyLhv_AKPNMAa3U7635p5rjRzbaRnpZc3xgKSR9NJLvwvIj5clOjz471JFeRfFKMvUlo1RQKqdxXqU4rxroiIne6HeQpfXrarvYpjCOu8iYpELA/s640/docker.jpg" title="docker" width="640" /></a></span></span></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">الصورة <a href="https://blog.docker.com/2016/09/walk-jog-run-getting-smarter-docker/" rel="nofollow">docker blog</a></span></span></td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: center;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span></div>
<div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">في هذا المقال سنتحدث عن برنامج <a href="https://medium.com/free-code-camp/a-beginners-guide-to-docker-how-to-create-your-first-docker-application-cc03de9b639f" rel="nofollow">Docker</a> وكيف تبدأ في استخدامه. </span></span><h3 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>في البداية. ما هو <a href="https://en.wikipedia.org/wiki/Docker_%28software%29" rel="nofollow">Docker</a>؟ </b></span></span></h3>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">هو برنامج مجاني طور من قبل شركة <a href="https://www.docker.com/" rel="nofollow">Docker Inc.</a>, وظهر لأول مرة في 13 مارس 2013 وأصبح منذ ذلك الحين من أهم الأدوات في تطوير البرمجيات. <br /><br /><b>إنه يسمح لك بإنشاء بيئات منعزلة ومستقلة لتطوير برمجياتك بداخلها. وتسمى بالحاويات.</b> <br /><br />وتسمح للمطور بتشغيل هذه الحاويات على أي نظام تشغيل. <br /><br />وكما ترى إنه يوفر استقلالية كبيرة لبرامجك دو أي مشاكل. وكل ما عليك فعله هو تشغيل الحاوية ليشتغل تطبيقك على الفور. </span></span><h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>ولكن. هل هو <a href="https://en.wikipedia.org/wiki/Virtual_machine" rel="nofollow">آلة افتراضية</a>؟ </b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">وهذا واحد من أكثر الأسئلة شيوعا. والاجابة هي,<b> ليس كثيرا.</b> <br /><br />إنه قد يبدو كآلة افتراضية, ولكنه لا يعمل بنفس الطريقة. <br /><br />على عكس Docker, الآلة الافتراضية ستحتوي على نظام تشغيل كامل. ستعمل وكأنها حاسب مستقل. أما Docker سيشارك موارد جهازك المتاحة مع الحاويات. </span></span></div>
<div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"> </span></span></div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTI7W70hwoRNpRbw7kXaoM5Cz1nx99d_8nym4TQTG2kmReO9uEqp2Hr0hBxV0B8F0v2BnIsAW6hXfm19Lvwm0Dk-sZ2sGP8w_Fj-9kGv_bEjRYI_6-0Rv1jCOloYt1TI3jxsMMIDmKPlgW/s1600/docker-layout.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="docker" border="0" data-original-height="435" data-original-width="1024" height="270" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTI7W70hwoRNpRbw7kXaoM5Cz1nx99d_8nym4TQTG2kmReO9uEqp2Hr0hBxV0B8F0v2BnIsAW6hXfm19Lvwm0Dk-sZ2sGP8w_Fj-9kGv_bEjRYI_6-0Rv1jCOloYt1TI3jxsMMIDmKPlgW/s640/docker-layout.png" title="docker" width="640" /></a></span></span></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">الصورة <a href="https://blog.docker.com/2018/08/containers-replacing-virtual-machines/" rel="nofollow">docker blog</a></span></span></td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: center;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span></div>
<div>
<h3 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">إذا, لماذا تستخدمه كمطور؟ </span></span></h3>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">هذه الأداة يمكن أن تغير حياة المطور اليومية. والاجابة على هذا السؤال هي: </span></span><ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">إنه سريع, على عكس الآلة الافتراضية. سيبدأ تطبيقك في ثوان وسيتوقف كذلك في ثوان. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">متعدد المنصات, يمكنك تشغيل حاوياتك على أي نظام تشغيل. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">لا يوجد أي صعوبات في اعداد بيئة العمل, فبمجرد أن تعده مره لن تحتاج أن تعده مجددا. وحتى إذا انضم موظف جديد للشركة يمكنك أن تعطيه ملف الاعداد وسيعمل على الفور. </span></span></li>
</ul>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">وغيرها الكثير من المميزات الرائعة. </span></span><h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>والآن لنبدأ بمشروعك الأول. </b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">والان عرفت ما هو Docker, وها قد حان الوقت لتبدأ بمشروعك الأول. <br /><br />والهدف من هذه الدرس أن نجعل برنامج بايثون يقوم بطباعة جملة من خلال ملف Dockerfile. <br /><br />وسترى أنه ليس بالشيء المعقد عندما تفهمه. <br /><br /><b>ملاحظة: يجب أن تكون بايثون منصبة على جهازك أولا. </b></span></span><h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>أ. الخطوة الأولى: تنصيب Docker على جهازك. </b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">-- لنظام التشغيل <a href="https://docs.docker.com/install/linux/ubuntu/" rel="nofollow">linux</a>. <br /><br />-- لنظام التشغيل <a href="https://docs.docker.com/docker-for-mac/" rel="nofollow">mac</a>. <br /><br />-- لنظام التشغيل <a href="https://docs.docker.com/docker-for-windows/" rel="nofollow">windows</a>. </span></span><h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>ب. الخطوة الثانية: إنشاء مشروعك. </b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">لإنشاء مشروعك ستقوم بعمل مجلد يحتوي على ملفين: </span></span><ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">"main.py" وهو ملف بايثون الذي يحتوي على البرنامج خاصتك المرد تنفيذه. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">"Dockerfile" وهو ملف الإعدادات الذي يحتوي على تعليمات إنشاء المشروع. </span></span></li>
</ul>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"></span></span><h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>ج. الخطوة الثالثة: إعداد ملف بايثون. </b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">سيكون الملف على الشكل. </span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;">#!/usr/bin/env python3 </span><br /><span style="color: #0b5394;">print</span>(<span style="color: #666666;">"Docker is magic!"</span>) </span></span></div>
<div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">لا شيء غير اعتيادي, سيطبع جملة فقط. </span></span><h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>د. الخطوة الرابعة: كتابة الإعدادات. </b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">أول شيء يجب أن تسأل نفسك عنه عند كتابة الإعدادات هو "ماذا تود أن تفعل؟" وهدفنا هنا هو تشغيل كود بايثون. <br /><br />ولتوفير الوقت والجهد يمكنك الذهاب إلى <a href="https://hub.docker.com/" rel="nofollow">DockerHub</a> والحصول على إعدادات جاهزة من هناك. <br /><br />نقوم بالبحث عن بايثون وسنحصل عليها <a href="https://hub.docker.com/_/python" rel="nofollow">هنا</a>. <br /><br />وسيصبح Dockerfile على الشكل: </span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="color: #6aa84f;"># A dockerfile must always start by importing the base image. <br /># We use the keyword 'FROM' to do that. <br /># In our example, we want import the python image. <br /># So we write 'python' for the image name and 'latest' for the version. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /><span style="color: #cc0000;">FROM </span>python:latest </span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /><span style="color: #6aa84f;"># In order to launch our python code, we must import it into our image. <br /># We use the keyword 'ADD' to do that. <br /># The first parameter 'main.py' is the name of the file on the host. <br /># The second parameter '/' is the path where to put the file on the image. <br /># Here we put the file at the image root folder. </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /><span style="color: #cc0000;">ADD</span> main.py / </span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /><span style="color: #6aa84f;"># We need to define the command to launch when we are going to run the image. <br /># We use the keyword 'CMD' to do that. <br /># The following command will execute "python ./main.py". </span></span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /><span style="color: #cc0000;">CMD </span>[ "python", "./main.py" ] </span></span></div>
<div>
<h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>هـ. الخطوة الخامسة: بناء المشروع. </b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">والآن مشروعك جاهز وكل ما عليك فعله هو كتابة: </span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">$ docker build -t python-test . </span></span></div>
<div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br />في الترمنال الخاصة بك. الخيار <b>-t</b> يمكنك من اختيار اسم للمشروع وهنا اخترت <b>python-test</b> ويمكنك اختيار أي اسم تريده. </span></span><h4 style="text-align: right;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><b>و. الخطوة السادسة: تشغيل المشروع. </b></span></span></h4>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">بعد أن يتم بناء المشروع يمكنك تشغيله بالأمر: </span></span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;">$ docker run python-test </span></span></div>
<div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br />والأن مشروعك يعمل وسترى جملة "docker is magic" مطبوعة أمامك. <br /><br />والأن لقد انتهيت من انشاء مشروعك باستخدام Docker ويمكنك مشاهدة الكود من <a href="https://github.com/gael-thomas/Docker-First-Application-example" rel="nofollow">هنا</a>. <br /><br /><br />إلى اللقاء. <br /></span></span> </div>
<div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span></div>
<div>
<span style="font-size: large;"><span style="font-family: Georgia, "Times New Roman", serif;"><br /></span></span></div>
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-66594104541442186132019-06-21T12:28:00.000+02:002019-06-21T12:30:43.427+02:00 هذه هي العادات الخمسة للمطورين الناجحين (الجزء الثاني).<div dir="rtl" style="text-align: right;" trbidi="on">
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHu2xHZVOfln5FCsq8QUR8SmCcdV5bdLpJxfHcTVxDnKs_hPyQF5qbONxOsM_j1HAYc6ai_7VxHLTGeIDmGjyiHAfusHnAbowfyhKHALip3xV1HXtqqR2krj8z5er_yHGHJ1CoWOhDv2cV/s1600/habit.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="العادات الخمسة للمبرمج الناجح" border="0" data-original-height="720" data-original-width="960" height="480" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHu2xHZVOfln5FCsq8QUR8SmCcdV5bdLpJxfHcTVxDnKs_hPyQF5qbONxOsM_j1HAYc6ai_7VxHLTGeIDmGjyiHAfusHnAbowfyhKHALip3xV1HXtqqR2krj8z5er_yHGHJ1CoWOhDv2cV/s640/habit.png" title="العادات الخمسة للمبرمج الناجح" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">العادات الخمسة للمبرمج الناجح</td></tr>
</tbody></table>
<br />
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">تحدثنا في <a href="https://www.questionerd.tk/2019/06/5-habits-of-successful-developers.html">الجزء السابق</a> عن <a href="https://medium.com/swlh/5-powerful-habits-of-successful-developers-1c0e32659ea3" rel="nofollow">العادات التي يتميز بها المبرمج الناجح</a> وهنا نكمل المتبقي منها. </span></span><br />
<ul style="text-align: right;">
<li><h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><b>لا تترك أي شيء للحظ.</b></span></span></h3>
</li>
</ul>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><b>جيم جينكن أصاب حين قال: </b></span></span><br />
<blockquote class="tr_bq">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">"مرارة الجودة السيئة تستمر حتى بعد نسيان حلاوة الالتزام بالتسليم في الموعد" </span></span></blockquote>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">كقاعدة عامة إذا قدر لخطاء ما أن يحدث, فسوف يحدث ولن تتمكن أي كمية من الحظ إيقافه. <br /><br />ولذلك فإن اختبار برامجك ضروري جدا. فكيف إذا ستعرف أنه يعمل؟ هذا سهل جدا. اختبره واختبره مجددا, اختبره بكل الطرق الممكنة. <br /><br />حتى إذا كان موعد التسليم قريب جدا وعليك ضغط هائل فلا تجعل أي شيء يؤثر على هذه المرحلة. قم بأتمتة الاختبارات أو استخدم اخري جاهزة, <b>يجب عليك ألا تهملها</b>. <br /><br />سمعتك كلها تعتمد على كفاءة اختباراتك التي أجريتها على برامجك, كل قطعة من الكود يجب اختبارها جيدا. <br /><br />ولكن إذا كان الكود "غير مستقر"؟ أي كتب بطريقة تجعل من الصعب اختباره. <br /><br />الاجابة هي أن تجعل كودك سهل الاختبار, وأفضل طريقة لفعل هذا في أن تكتب الاختبارات أولا قبل أن تكتب الكود الذي سيمر بها. <br /><br /><b>وتذكر دائما أن الهدف من برامجك أن تعمل لتحل المشكلات, وإن لم يحدث هذا فهي بلا فائدة.أنت كمبرمج يجب أن تعلم إذا ما كان برنامجك يعمل أم لا. فلا شيء أهم من هذه الحقيقة. </b></span></span><br />
<ul style="text-align: right;">
<li><h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><b>اكتب كود مرن دائما.</b></span></span></h3>
</li>
</ul>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><b>قال سيري هستافت:</b> </span></span><br />
<blockquote class="tr_bq">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">"الابداع يعتمد على الانفتاح والمرونة, لذا فلنأمل أن نمتلك المزيد منهما في المستقبل" </span></span></blockquote>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">المحترف الحقيقي يعرف ان تقديم الأداء على البنية هو فعل أحمق, إنها بنية الكود هي التي تجعله مرنا. إذا دمرت البنية دمرت المستقبل. <br /><br />إن المبدأ الأساسي الذي تقوم عليه البرمجيات هو أن البرمجيات سهلة التغيير. وإذا وجدت هذا غير ممكن فلابد أن هناك خطاء ما. <br /><br />الكثير من مشاريع البرمجيات تسقط في مستنقع الكود غير المرن. يقوم المطور بإضافة المزيد والمزيد إلى الكود غير المرن وينتهي بوحش ضخم لا يمكن إعادة كتابته أو إصلاحه. <br /><br />والمفتاح هنا هو تحديد تلك الأجزاء من الكود التي تجعله غير مرن. وعندما نجد تلك الأجزاء نقوم بإعادة صياغتها لتصبح مرنة, بدلا من إضافة المزيد إلى تلك الفوضى. <br /><br />اتبع دائما مبدأ "إعادة البناء غير الرحيمة". إذا أرت ترك الكود فأتركه نظيفا حتى إذا عنى ذلك فعل شيء "إضافيا" عن ما طلب منك. </span></span><br />
<ul style="text-align: right;">
<li><h3>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><b>وأخيرا, لا تتوقف عن التعلم.</b></span></span></h3>
</li>
</ul>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><b>أصاب أنتوني ج. د’ آنجلو حين قال</b>: </span></span><br />
<blockquote class="tr_bq">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">"طور شغفا للتعلم, وإذا فعلت لن تتوقف أبدا عن النمو" </span></span></blockquote>
<ul style="text-align: right;">
<li><span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">أريد ان آخذ كورس "S4 HANA". ولكن المدير غير داعم. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"> أريد أن أتعلم "Webdynpro forms". ولكني مشغول جدا. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">أود أن أحضر هذا "codeathon". ولكنه يأتي في العطلة.</span></span></li>
</ul>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">كل هذه أعذار لعدم التعلم. مهنتك هي مسئوليتك وليست مسئولية مديرك أن يدربك ويرسلك للمؤتمرات أو يشتري لك الكتب, كل هذه الأشياء هي مسئوليتك أنت. <br /><br />اتبع قاعدة 20-40 حيث تخصص 40 ساعة أسبوعيا للعمل و20 ساعة لنفسك لتعلمك وإذا استخدمتها بحكمة فيمكنك عمل كل ما تريد من تعلم وسفر وحضور مؤتمرات ... <br /><br />وتذكر دائما ان هذا المجال يتغير باستمرار ويمكنك أن تتحول في لحظة إلى ديناصور عفى عليه الزمن, لذا استثمر وقتك في التعلم والتطور. <br /><br /><b>قال سيما أوبنرز: </b></span></span><br />
<blockquote class="tr_bq">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">"التعلم الذاتي مفتوح للجميع ولن لا يخوضه إلا من يرفض العيش حياة صغيرة وبلا هدف". </span></span></blockquote>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><br />وهكذا ننتهي من ذكر العادات الخمسة للمبرمجين الناجحين. </span></span> <span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><br />إلى اللقاء. </span></span><br />
<br />
<br /></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-69290643906353283392019-06-20T14:13:00.000+02:002019-06-20T14:13:14.053+02:00هذه هي العادات الخمسة للمطورين الناجحين.<div dir="rtl" style="text-align: right;" trbidi="on">
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0q8UBcnoS7bG4B-KcKK_FHoAJrLDXoF_VVqpv6YjZVCdBst6tVMkluMNWkBKaSOUf4Tbmgi2n3_dZfjPGNCAbghs_8Kf7NjOCAmJv-FqK7U0LlFAzakF8KsGuACKH0hRWWvTDBlL7HG03/s1600/habit.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="العادات الخمسة للمطورين الناجحين." border="0" data-original-height="720" data-original-width="960" height="480" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0q8UBcnoS7bG4B-KcKK_FHoAJrLDXoF_VVqpv6YjZVCdBst6tVMkluMNWkBKaSOUf4Tbmgi2n3_dZfjPGNCAbghs_8Kf7NjOCAmJv-FqK7U0LlFAzakF8KsGuACKH0hRWWvTDBlL7HG03/s640/habit.png" title="العادات الخمسة للمطورين الناجحين." width="640" /></a></span></span></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">الصورة <a href="https://quotesgram.com/habits-quotes/" rel="nofollow">quotesgram.com</a></span></span></td></tr>
</tbody></table>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><br />قال لاري وال ذات مرة (وهو بالمناسبة مطور لغة بيرل) أن المطورين العظماء لديهم ثلاثة خصال: الكسل, نفاذ الصبر والغطرسة. <br /><br />كسالى لأنهم يحاولون دائما كتابة برامجهم بحيث تأخذ منهم أقل مجهود ممكن, وبعد ذلك يقومون بتوثيقها جيدا حتى لا يضطروا للإجابة عن أسئلة عنها في المستقبل. وقلة صبرهم تدفعهم دائما لكتابة برامج تستبق احتياجاتك. أما غطرستهم تدفعهم لكتابة كود أنيق لا بمكن للآخرين انتقاده. <br /><br />المطور الناجح ليس بالضرورة أعظم مطور, فالمطور الذي ينهى مهامه اليومية بنجاح لهو أكثر فاعلية بكثير من الذي يفعل ذلك أحيانا, فبالنسبة إلى صاحب العمل فإن المساحة تحت المنحنى هي التي تحسب وليس أعلى نقطة يصل لها. <br /><br />فالنجاح الذي تسعى له يأتي من الطريقة التي ترى بها نفسك والعالم, وتلك العادات التي تمتلكها في مواجهة مصاعب الحياة. في الحقيقة وطبقا لما قاله الباحثون في جامعة Duke أن 40% من نجاحنا أو فشلنا يعود إلى العادات التي نمتلكها. <br /><br /><b>وإليك 5 عادات والتي سوف تؤدي إلى نجاحك كمطور.</b> </span></span><ul style="text-align: right;">
<li><h3>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><b>كن محترفا.</b></span></span> </h3>
</li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">لقد أصاب ستيف مارابولي الهدف<b> عندما قال</b>: <br /></span></span><blockquote class="tr_bq">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">"الشيء الصحيح والشيء الصعب يكونان أحيانا نفس الشيء, وكلاهما يتطلبان الاحترافية" </span></span></blockquote>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><br />الاحترافية تشبه سيف ديموقليس. فهو في جانب يحمل معاني الشرف والفخر ولكنه على الجانب الآخر يدل على المسئولية. والاثنان دائما متلازمان, فلا يمكنك التفاخر بشيء لست مسئولا عنه. <br /><br />تخيل أنك كتبت كود ما, وعند وضعه في نظام الانتاج أحدث مشاكل جمة وتسبب في تعطل نظام الانتاج ليوم كامل. كما ان المستخدمين تكبدوا خسائر مالية كبيرة. ولكن بعد اصلاح الكود يكون الخراب الذي حدث غير قابل للعكس. <br /><br />الغير محترف في هذه الحالة سوف يهز كتفية قائلا "المصائب تحدث" ويبدأ في عمله التالي. أما المحترف سيغضب ويتألم من هذه الذلة وسوف يتأكد من أنها لن تحدث مجددا. <br /><br /><b>تذكر دائما أن الاحترافية تتمحور حول المسئولية. لا يمكنك أن تكون على حق دائما, ولكن عليك أن تتحمل مسئولية خطاءك. </b></span></span><ul style="text-align: right;">
<li><h3>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><b>لا تكرر أخطاءك. </b></span></span></h3>
</li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">أصاب امت كالنتري <b>عندما قال</b>: <br /></span></span><blockquote class="tr_bq">
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;">"اذا أتبع أحد ما الاعتذار بعذر, فهذا يعني أنه سوف يرتكب نفس الخطاء مجددا وأنه يعتذر عنه مقدما" </span></span></blockquote>
<span style="font-family: Georgia, "Times New Roman", serif;"><span style="font-size: large;"><br />كلنا نريد أن تعمل البرامج التي نكتبها( فالكثير منا أصبح مبرمجا لأنه ذات يوم جعل شيء ما يعمل وأراد أن يشعر بهذه النشوة مجددا). ولكن لكننا لسنا وحدنا نريد ذلك فعملاءنا وكذلك مدراءنا يريدون ذلك أيضا. وفي الحقيقة هم يدفعون لنا المال لنصنع برامج تعمل بالطريقة التي يريدونها بالضبط. <br /><br /><b>ولكن البرمجيات ليست كاملة, فكل برنامج سيكون به أخطاء. </b><br /><br />إذا المفتاح هنا ليس الطموح لكتابة برامج كاملة, فهذه خيالات يوتوبية ولن تتحقق أبدا. فيجب عليك أن تتحمل مسئولية تلك الأخطاء في برامجك وقم بصنع أخرى جديدة ولكن لا تكرر نفس الخطاء مرارا وتكرارا. <br /><br />في خلال تطورك في مهنتك, يجب أن يقترب معدل خطاءك من الصفر, حتما لن يساويه, ولكنا مسئوليتك لتقترب منه قدر الإمكان. <br /><br /> انتظر الخطوات الثلاثة التالية في الجزء الثاني. <br /><br /> إلى اللقاء. <br /><br /> <br /><br /> </span></span></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-16256116220730051442019-06-18T16:34:00.001+02:002019-06-18T16:34:31.964+02:00ما هي مبادئ SOLID؟ ولما يجب أن يعرفها كل مطور؟ (الجزء الثاني)<div dir="rtl" style="text-align: right;" trbidi="on">
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijoxHTWgSjphsZdcNpzfK7z-4i95EcBe3a0-qR94N-P-ssfLeOr2Shk3Y8PXOLbdRtFvAQaXsPu1YApXD3Jy3bc3f4i4gh90-wphibmpmTwA4_0Le820DVdaTA5Lpx2tyRnOgi9DT9Tj87/s1600/SOLID.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="SOLID 5 principles" border="0" data-original-height="416" data-original-width="606" height="438" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijoxHTWgSjphsZdcNpzfK7z-4i95EcBe3a0-qR94N-P-ssfLeOr2Shk3Y8PXOLbdRtFvAQaXsPu1YApXD3Jy3bc3f4i4gh90-wphibmpmTwA4_0Le820DVdaTA5Lpx2tyRnOgi9DT9Tj87/s640/SOLID.jpg" title="SOLID 5 principles" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">SOLID</td></tr>
</tbody></table>
<h4 style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><b>3. مبدأ "liskov" للاستبدال (LSP).</b></span></h4>
<span style="font-family: Georgia, "Times New Roman", serif;">ويعني أن الصنف الرئيسي يجب أن يكون قابل للاستبدال بالصنف المشتق منه. <br /><br />الهدف من هذا المبدأ هو التأكد أن الصنف المشتق يمكن أن يأخذ مكان الصنف الرئيسي بدون حدوث أي أخطاء. وإذا وجدت أن الكود يفحص نوع الصنف, فإنه بالتأكيد يخرق هذا المبدأ. <br /><br /><b>لننظر إلى مثال الحيوانات ثانية: </b></span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-family: Georgia, "Times New Roman", serif;">//... <br />function AnimalLegCount(a: Array<Animal>) { <br /> for(int i = 0; i <= a.length; i++) { <br /> if(typeof a[i] == Lion) <br /> log(LionLegCount(a[i])); <br /> if(typeof a[i] == Mouse) <br /> log(MouseLegCount(a[i])); <br /> if(typeof a[i] == Snake) <br /> log(SnakeLegCount(a[i])); </span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-family: Georgia, "Times New Roman", serif;"> } <br />} </span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-family: Georgia, "Times New Roman", serif;">AnimalLegCount(animals); </span></div>
<span style="font-family: Georgia, "Times New Roman", serif;">هذا الكود يخرق مبدأ LSPوكذلك مبدأ OCPكما عرفنا من قبل. يجب أن يكون على علم بنوع كل حيوان وبعدها ينادي دالة leg-counting الخاصة به. <br /><br />وكذلك لجعل الدالة كذلك متوافقة مع LSP <b>سوف نفعل الآتي</b>: </span><br />
<ul style="text-align: right;">
<li><span style="font-family: Georgia, "Times New Roman", serif;"><b>إذا كان</b> الصنف الرئيسي Animal يملك دالة تستقبل معامل من نفس النوع Animal فعلى الصنف المشتق أن يستقبل معاملات من كلا النوعين (الصنف الرئيسي والمشتق). </span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-family: Georgia, "Times New Roman", serif;"><b>إذا كان </b>الصنف الرئيسي animal يعيد return قيم من نفس النوع animal فعلى الصنف المشتق أن يعيد قيم من كلا النوعين. </span></li>
</ul>
<span style="font-family: Georgia, "Times New Roman", serif;"><br />و الأن <b>نعيد صياغة</b> دالة AnimalLegCount: </span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-family: Georgia, "Times New Roman", serif;">function AnimalLegCount(a: Array<Animal>) { <br /> for(let i = 0; i <= a.length; i++) { <br /> a[i].LegCount(); <br /> }<br />} <br />AnimalLegCount(animals); </span></div>
<span style="font-family: Georgia, "Times New Roman", serif;">والأن لا تهتم الدالة بنوع الحيوان المدخل لها, فإنها تقوم فقط بمناداة الدالة legCount الخاصة به. وكل ما تعرفه أن المعامل المدخل لها يجب أن يكون من النوع Animal, سواء كان من الصنف الرئيسي أو من المشتق. <br /><br /><b>ويكون الصنف Animal على الشكل</b>: </span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-family: Georgia, "Times New Roman", serif;">class Animal { <br /> //... <br /> LegCount(); <br />} </span></div>
<span style="font-family: Georgia, "Times New Roman", serif;"><b>والصنوف المشتقة تكون على الشكل: </b></span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-family: Georgia, "Times New Roman", serif;">//... <br />class Lion extends Animal{ <br /> //... <br /> LegCount() { <br /> //... <br /> } <br />} <br />//... </span></div>
<span style="font-family: Georgia, "Times New Roman", serif;">وعندما يمرر الصنف الرئيسي Animal أو المشتق lion إلى الدالة AnimallegCount تعيد عدد الأرجل التي يملكها الحيوان عن طريق مناداة الدالة LegCount الخاصة به. </span><br />
<div style="text-align: right;">
</div>
<h4 style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><b>4. مبدأ فصل الواجهات (ISP). </b></span></h4>
<span style="font-family: Georgia, "Times New Roman", serif;">ويعني صنع واجهات بالغة التحديد والدقة ومناسبة للعميل, فليس عليه فليس عليه الاعتماد على واجهات لا يستخدمها. <br /><br />وهذا المبدأ يتعامل مع عيوب الواجهات (Interfaces) الكبيرة. <br /><br />انظر إلى هذا المثال: </span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-family: Georgia, "Times New Roman", serif;">interface IShape { <br /> drawCircle(); <br /> drawSquare(); <br /> drawRectangle(); <br />} </span></div>
<span style="font-family: Georgia, "Times New Roman", serif;">تحتوي هذه الواجهة على ثلاث دوال ترسم دائرة, مربع ومستطيل وعلى الصنوف التي ستستخدمها تعريف الدوال الثلاثة هكذا: </span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-family: Georgia, "Times New Roman", serif;">class Circle implements IShape { <br /> drawCircle(){ <br /> //... <br /> } <br /> drawSquare(){ <br /> //... <br /> } <br /> drawRectangle(){ <br /> //... <br /> } <br /><br />} <br /><br />class Square implements IShape { <br /> drawCircle(){ <br /> //... <br /> } <br /> drawSquare(){ <br /> //... <br /> } <br /> drawRectangle(){ </span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-family: Georgia, "Times New Roman", serif;"> //... <br /> } <br />} <br /><br />class Rectangle implements IShape { <br /> drawCircle(){ <br /> //... <br /> } <br /> drawSquare(){ <br /> //... <br /> } <br /> drawRectangle(){ <br /> //... <br /> } <br />} </span></div>
<span style="font-family: Georgia, "Times New Roman", serif;"><br />إنه لمن المضحك النظر إلى المثال بالأعلى. فصنف رسم المربع مثلا لديه دوال رسم دائرة ومستطيل والتي ليس لها أي فائدة في الصنف, وكذلك الأصناف الأخرى. <br /><br />وسوف يحدث الكثير من المشاكل عند إضافة دالة جديدة مثلا: </span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-family: Georgia, "Times New Roman", serif;">interface IShape { <br /> drawCircle(); <br /> drawSquare(); <br /> drawRectangle(); <br /> drawTriangle(); <br />} </span></div>
<span style="font-family: Georgia, "Times New Roman", serif;">ولكن التصميم بهذا الشكل غير عملي ويخرق مبدأ ISP, حيث أن الواجهة لا تؤدي وظيفة واحدة كم أنها تملك دال ليست ذات فائدة لبعض الصنوف اتي تستخدمها. <br /><br />ولنجعل الواجهة تلائم المبدأ ISP سوف نقسمها إلى عدة واجهات أخرى كالآتي: </span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-family: Georgia, "Times New Roman", serif;">interface IShape { <br /> draw(); <br />} <br />interface ICircle { <br /> drawCircle(); <br />} <br />interface ISquare { <br /> drawSquare(); <br />} <br />interface IRectangle { <br /> drawRectangle(); <br />} <br />interface ITriangle { <br /> drawTriangle(); <br />} <br /><br />class Circle implements ICircle { <br /> drawCircle() { <br /> //... <br /> } <br />} <br /><br />class Square implements ISquare { <br /> drawSquare() { <br /> //... <br /> } <br />} <br /><br />class Rectangle implements IRectangle { <br /> drawRectangle() { <br /> //... <br /> } <br />} <br /><br />class Triangle implements ITriangle { <br /> drawTriangle() { <br /> //... <br /> } <br />} <br /><br />class CustomShape implements IShape { <br /> draw(){ </span></div>
<div dir="ltr" style="text-align: left;">
<span style="font-family: Georgia, "Times New Roman", serif;"> //... <br /> } <br />} </span></div>
<span style="font-family: Georgia, "Times New Roman", serif;">وبذلك تكون واجهة ICircle ترسم دوائر فقط وكذلك ISquare وIRectangel أما فيمكنها رسم كل الأشكال. ويمكن بدلا من ذلك أن يرث كل صنف الواجهة IShape ويقوم بعمل دالة Draw الخاصة به كالآتي: </span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-family: Georgia, "Times New Roman", serif;">class Circle implements IShape { <br /> draw(){ <br /> //... <br /> } <br />} <br /><br />class Triangle implements IShape { <br /> draw(){ <br /> //... <br /> } <br />} <br /><br />class Square implements IShape { <br /> draw(){ <br /> //... <br /> } <br />} <br /><br />class Rectangle implements IShape { <br /> draw(){ <br /> //... <br /> } <br />} </span></div>
<span style="font-family: Georgia, "Times New Roman", serif;">وبعد ذلك يمكن استخدام الواجهة في إنشاء أي شكل نريد. </span><br />
<h4 style="text-align: right;">
<span style="font-family: Georgia, "Times New Roman", serif;"><b>5.مبدأ انعكاس التبعية (DIP). </b></span></h4>
<span style="font-family: Georgia, "Times New Roman", serif;">يجب أن تكون التبعيات من المجردات مثل الواجهات حيث: <br /><br /> <b> أ.</b> لا يجب على الوحدات modules عالية المستوى الاعتماد على وحدات منخفضة المستوى أخرى بل يجب أن يعتمد كلاهما على التجريدات. <br /><br /> <b> ب.</b> التجريدات لا يجب أن تعتمد على الأصناف بل العكس. <br /><br />وهنا تأتي المرحلة حيث سيعتمد التطبيق على الكثير من الوحدات البرمجية. وعندما يحدث ذلك احرص على جعل الأشياء منظمة عن طريق حقن التبعيات Dependency injection. حيث المكونات عالية المستوى تعتمد على المكونات منخفضة المستوى. <br /><br /><b>انظر إلى الكود الآتي: </b></span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-family: Georgia, "Times New Roman", serif;">class XMLHttpService extends XMLHttpRequestService {} <br /><br />class Http { <br /> constructor(private xmlhttpService: XMLHttpService) { } <br /> get(url: string , options: any) { <br /> this.xmlhttpService.request(url,'GET'); <br /> } <br /> post() { <br /> this.xmlhttpService.request(url,'POST'); <br /> } <br /> //... <br />} </span></div>
<span style="font-family: Georgia, "Times New Roman", serif;">وهنا Http هو المكون عالي المستوى أما HttpService هي المكون منخفض المستوى, ولكن هذا البناء يخرق مبدأ DIP حيث لا يجب على المكونات عالية المستوى الاعتماد على أخرى منخفضة المستوى بل على تجريداتها. <br /><br />وفي المثال أيضا الصنف Http يعتمد على الصنف XMLHttpService وفي حال أردنا تغيير طريقة الاتصال هذه فسوف نضطر الكثير من الكود في كل مرة نريد ذلك وهذ يخرق مبدأ OCP لذا سنقوم بإنشاء الواجهة Connection لحل هذه المشكلة: </span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-family: Georgia, "Times New Roman", serif;">interface Connection { <br /> request(url: string, opts:any); <br />} </span></div>
<span style="font-family: Georgia, "Times New Roman", serif;"><b>ونعدل الكود ليصبح هكذا: </b></span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-family: Georgia, "Times New Roman", serif;">class Http { <br /> constructor(private httpConnection: Connection) { } <br /> get(url: string , options: any) { <br /> this.httpConnection.request(url,'GET'); <br /> } <br /> post() { <br /> this.httpConnection.request(url,'POST'); <br /> } <br /> //... <br />} </span></div>
<span style="font-family: Georgia, "Times New Roman", serif;">والأن أيا كن نوع الخدمة فسوف نتمكن من الاتصال من خلالها دون القلق عند تغير نوعها, ويمكننا الأن أن نعيد صياغة الصنف XMLHttpService: </span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-family: Georgia, "Times New Roman", serif;">class XMLHttpService implements Connection { <br /> const xhr = new XMLHttpRequest(); <br /> //... <br /> request(url: string, opts:any) { <br /> xhr.open(); <br /> xhr.send(); <br /> } <br />} </span></div>
<span style="font-family: Georgia, "Times New Roman", serif;">ويمكننا إنشاء أنواع عدة من الاتصالات من الصنف Connection ونمررها للصنف Http: </span><br />
<div dir="ltr" style="text-align: left;">
<span style="font-family: Georgia, "Times New Roman", serif;">class NodeHttpService implements Connection { <br /> request(url: string, opts:any) { <br /> //... <br /> } <br />} <br /><br />class MockHttpService implements Connection { <br /> request(url: string, opts:any) { <br /> //... <br /> } <br />} </span></div>
<span style="font-family: Georgia, "Times New Roman", serif;">والأن نرى أن الصنوف عالية المستوى وكذلك منخفضة المستوى يعتمدان على التجريدات فالصنف Http عالي المستوى يعتمد على التجريد Connection وكذلك HttpServiceType منخفض المستوى يعتمد على نفس التجريد. <br /><br />وكذلك لن يجعلنا هذا البناء نخرق LSP فالصنوف NodeHttpService و الصنف MockHttpService يمكن بسهولة استبدال الصنف الأب Connection. <br /><br />وبهذا ننتهي من سرد المبادئ الخمسة ل SOLID وشرحها بالتفصيل. </span><span style="font-family: Georgia, "Times New Roman", serif;"><br /><br />إلى اللقاء. <br /></span> <span style="font-family: Georgia, "Times New Roman", serif;"><br /></span> <span style="font-family: Georgia, "Times New Roman", serif;"><br /></span> </div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-22407642080618339702019-06-17T14:41:00.000+02:002019-06-18T16:35:01.929+02:00ما هي مبادئ SOLID؟ ولما يجب أن يعرفها كل مطور؟<div dir="rtl" style="text-align: right;" trbidi="on">
<span style="font-family: "georgia" , "times new roman" , serif; font-size: large;"> <table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDPteITXCSm2HyHwPAK8ZUeOYx8_KO7N1NfV14xkpqZS1JBxP-R9Nxs-zzLToYhk9kAUZr0HT897wXs1VAODQ2dzGu8yKWKUKwDVg1NDELHmE5mv0DM-qZAnpe1kBu6SMY0piLwBc6dXU2/s1600/SOLID.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="416" data-original-width="606" height="438" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDPteITXCSm2HyHwPAK8ZUeOYx8_KO7N1NfV14xkpqZS1JBxP-R9Nxs-zzLToYhk9kAUZr0HT897wXs1VAODQ2dzGu8yKWKUKwDVg1NDELHmE5mv0DM-qZAnpe1kBu6SMY0piLwBc6dXU2/s640/SOLID.jpg" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">الصورة <a href="http://www.dereuromark.de/tag/package-principles/" rel="nofollow">www.dereuromark.de</a></td></tr>
</tbody></table>
</span><br />
<span style="font-size: large;"><br /></span>
<span style="font-size: large;"><br /></span>
<span style="font-family: "georgia" , "times new roman" , serif; font-size: large;">البرمجة كائنية التوجه جاءت بأسلوب جديد في تطوير البرمجيات. مما يمكن المطورين من دمج البيانات ذات الخصائص المتشابهة في كائن واحد للتعامل معها بشك موحد. <br /><br />ولكن هذا الأسلوب في البرمجة لا يحد من الكود المربك وغير المفهوم مما يجعل الكود غير قابل للإصلاح. <br /><br />ولهذا فقد طورت خمسة مبادئ رئيسية من قبل "Robert C. Martin", وهذه المبادئ الخمسة جعلت من السهل إنشاء برامج سهلة القراءة والإصلاح. وهذه المبادئ الخمسة تسمى "<a href="https://blog.bitsrc.io/solid-principles-every-developer-should-know-b3bfa96bb688" rel="nofollow">S.O.L.I.D</a>". </span><br />
<ul style="text-align: right;">
<li><span style="font-family: "georgia" , "times new roman" , serif; font-size: large;">S: مبدأ المسئولية الواحدة (Single Responsibility principle). </span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-family: "georgia" , "times new roman" , serif; font-size: large;">O: مبدأ المفتوح المغلق (Open-Closed principle). </span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-family: "georgia" , "times new roman" , serif; font-size: large;">L: مبدأ "liskov" للاستبدال (Liskov Substitution Principle). </span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-family: "georgia" , "times new roman" , serif; font-size: large;">I: مبدأ فصل الواجهات (Interface Segregation Principle). </span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-family: "georgia" , "times new roman" , serif; font-size: large;">D: مبدأ انعكاس التبعية (Dependency Inversion Principle). </span></li>
</ul>
<span style="font-family: "georgia" , "times new roman" , serif; font-size: large;"><br /><b>وسوف نناقش كل مبدأ على حدا بالتفصيل.</b> <br /><br /><b>ملاحظة:</b> كثير من الأمثلة المذكورة في هذه المقالة قد تكون غير صالحة للتطبيق في البرمجيات الفعلية, فكل شيء يعتمد على تصميمك الخاص وعلى طريقة استخدامه. أهم شيء هنا أن تفهم هذه المبادئ وتعرف كيف تطبقها. <br /><br /><b>حسنا فلنبدأ بالمبدأ الأول.</b> </span><br />
<ul style="text-align: right;">
<li><span style="font-family: "georgia" , "times new roman" , serif; font-size: large;"><b>مبدأ المسئولية الواحدة </b>(SRP). </span></li>
</ul>
<span style="font-family: "georgia" , "times new roman" , serif; font-size: large;">ويعني أنه على كل صنف (Class) القيام بوظيفة واحدة. فإذا كانت له أكثر من وظيفة واحدة أصبح مزدوجا, أي أن التغيير في احدى وظائفه ينتج عنه بالتبعية تغيير في الأخرى. <br /><br />وهذا المبدأ لا ينطبق على الأصناف فقط بل على أشياء أخرى مثل المكونات (Components) والخدمات المصغرة (MicroServices) أيضا. <br /><br /><b>انظر إلى هذا المثال: </b> </span><br />
<span style="font-size: large;"><br /></span>
<div style="text-align: left;">
<pre class="graf graf--pre graf-after--p" dir="ltr" id="f48e" name="f48e" style="text-align: left;"><span style="font-size: large;">class Animal {
constructor(name: string){ }
getAnimalName() { }
saveAnimal(a: Animal) { }
}</span></pre>
</div>
<span style="font-family: "georgia" , "times new roman" , serif; font-size: large;"> فصنف (Animal) يحرق مبدأ SRP, ولكن كيف؟ <br /><br />ينص هذا المبدأ على أن كل صنف يجب أن يكون له وظيفة أو مسئولية وحيدة, ولكن في هذا المثال يمكن أن نعد وظيفتان:</span><br />
<span style="font-family: "georgia" , "times new roman" , serif; font-size: large;">إدارة خصائص الصنف وإدارة قاعدة البيانات حيث أن المكون "getAnimalName" يدير خصائص الصنف (Animal) و الدالة "saveAnimal" قاعدة البيانات الخاصة به. <br /><br /><b>ولكن كيف سيسبب هذا التصميم مشاكل في المستقبل؟</b> <br /><br />إذا تغيرت مثلا دوال إدارة قاعدة البيانات فلابد من تغيير دوال إدارة الخصائص لتلائم التغيرات الجديدة, وهكذا كلما حدث تغير في أحد الوظائف لابد من تغيير الأخرى لتتلاءم معها. <br /><br />إنها مثل <b>قطع الدومينو</b>, المس أحداها وسوف تتأثر الأخريات. <br /><br />ولنجعل هذا الصنف متلاءم مع القاعدة. ننشئ صنف آخر والذي سوف يكون له وظيفة واحه وهي إدارة قاعدة البيانات, وسيصبح الصنف على الشكل. </span><br />
<div style="text-align: right;">
<span style="font-size: large;"><br /></span></div>
<div style="text-align: left;">
<pre class="graf graf--pre graf-after--p" dir="ltr" id="4610" name="4610"><span style="font-size: large;">class Animal {
constructor(name: string){ }
getAnimalName() { }
}</span></pre>
<pre class="graf graf--pre graf-after--pre" dir="ltr" id="e762" name="e762"><span style="font-size: large;">class AnimalDB {
getAnimal(a: Animal) { }
saveAnimal(a: Animal) { }
}</span></pre>
</div>
<blockquote class="tr_bq">
<span style="font-family: "georgia" , "times new roman" , serif; font-size: large;">"عند تصميم الصنوف نهدف إلى وضع الميزات المتشابهة مع بعضها, لذا عندما تتغير فإنها تتغير لنفس السبب, ويجب فصل الميزات التي تتغير لأسباب مختلفة" - steve fenton </span></blockquote>
<span style="font-family: "georgia" , "times new roman" , serif; font-size: large;"><br />ومع التطبيق الملائم لهذه القاعدة, تصبح برامجنا متماسكه للغاية. </span><br />
<ul style="text-align: right;">
<li><span style="font-family: "georgia" , "times new roman" , serif; font-size: large;"><b>مبدأ المفتوح المغلق</b> (OCP). </span></li>
</ul>
<span style="font-family: "georgia" , "times new roman" , serif; font-size: large;">ويعني أن مكونات البرمجيات (الصنوف, الدوال والوحدات البرمجية) يجب أن تكون قابلة للتمديد وليس التعديل. <br /><br />لنكمل مع صنف Animal.</span><br />
<br />
<pre class="graf graf--pre graf-after--p" dir="ltr" id="6ce7" name="6ce7" style="text-align: left;"><span style="font-size: large;">class Animal {
constructor(name: string){ }
getAnimalName() { }
}</span></pre>
<span style="font-family: "georgia" , "times new roman" , serif; font-size: large;">إذا أردت أن تمر على قائمة من ال Animals وتطبع صوت كلا منهم فيمكنك عمل هذا. </span><br />
<pre class="graf graf--pre graf-after--p" dir="ltr" id="8a81" name="8a81" style="text-align: left;"><span style="font-size: large;">//...
const animals: Array<Animal> = [
new Animal('lion'),
new Animal('mouse')
];</span></pre>
<pre class="graf graf--pre graf-after--pre" dir="ltr" id="8d70" name="8d70" style="text-align: left;"><span style="font-size: large;">function AnimalSound(a: Array<Animal>) {
for(int i = 0; i <= a.length; i++) {
if(a[i].name == 'lion')
log('roar');
if(a[i].name == 'mouse')
log('squeak');
}
}
AnimalSound(animals);</span></pre>
<pre class="graf graf--pre graf-after--p" dir="ltr" id="6ce7" name="6ce7" style="text-align: left;"><span style="font-size: large;">
</span></pre>
<span style="font-family: "georgia" , "times new roman" , serif; font-size: large;">ولكن هذه الدال ة لا تتوافق مع القاعدة OCP. فلو أردنا أن نضيف حيوان جديد مثلا. </span><br />
<br />
<pre class="graf graf--pre graf-after--p" dir="ltr" id="56fd" name="56fd" style="text-align: left;"><span style="font-size: large;">//...
const animals: Array<Animal> = [
new Animal('lion'),
new Animal('mouse'),
new Animal('snake')
]
//...</span></pre>
<span style="font-family: "georgia" , "times new roman" , serif; font-size: large;"> فيجب علينا أن نعدل الدالة "AnimalSound" وإضافة الحيوان الجديد. </span><span style="font-size: large;"><br /></span><br />
<pre class="graf graf--pre graf-after--p" dir="ltr" id="fccc" name="fccc" style="text-align: left;"><span style="font-size: large;">//...
function AnimalSound(a: Array<Animal>) {
for(int i = 0; i <= a.length; i++) {
if(a[i].name == 'lion')
log('roar');
if(a[i].name == 'mouse')
log('squeak');
if(a[i].name == 'snake')
log('hiss');
}
}</span></pre>
<pre class="graf graf--pre graf-after--pre" dir="ltr" id="b37c" name="b37c" style="text-align: left;"><span style="font-size: large;">AnimalSound(animals);</span></pre>
<span style="font-family: "georgia" , "times new roman" , serif; font-size: large;">ترى هنا أنه علينا اضافة كل حيوان جديد داخل الدالة, ولكن هذا مثال بسيط, فعندما يصبح البرنامج كبيرا ومعقدا سترى أن جملة <b>IF </b>الشرطية تتكرر عدد كبير من المرات, ولكن هذا شيء غير عملي. فكيف إذا نجعل هذا الكود متوافق مع ال OCP؟ </span><span style="font-size: large;"><br /></span><br />
<pre class="graf graf--pre graf-after--p" dir="ltr" id="56fd" name="56fd" style="text-align: left;"><span style="font-size: large;">class Animal {
makeSound();
//...
}class Lion extends Animal {
makeSound() {
return 'roar';
}
}class Squirrel extends Animal {
makeSound() {
return 'squeak';
}
}
class Snake extends Animal {
makeSound() {
return 'hiss';
}
}//...
function AnimalSound(a: Array<Animal>) {
for(int i = 0; i <= a.length; i++) {
log(a[i].makeSound());
}
}
AnimalSound(animals);</span></pre>
<span style="font-family: "georgia" , "times new roman" , serif; font-size: large;">في المثال أعلاه أستخدمنا ما يسمى بالوراثة, فلدينا الأن صنف رئيسي animal وبه دالة تخيلية "makeSound" ويقوم بعدها صنف كل حيوان بأخذ animal كصنف أب ويقوم بعدها بإعادة تعريف الدالة لتعيد الصوت الخاص به, وبعدها تقوم "AnimalSound" بالمرور على قائمة الحيوانات وتنفذ دالة makesound الخاصة بكل منهم. <br /><br />الآن عند إضافة حيوان جديد لن نحتاج لتعديل أي شيء و لا لإضافة المزيد من الكود داخل الدالة. والأن الدالة AnimalSound تتناسب مع مبدأ OCP. <br /><br /><b>انظر إلى هذا المثال الآخر: </b></span><br />
<pre class="graf graf--pre graf-after--p" dir="ltr" id="75b0" name="75b0" style="text-align: left;"><span style="font-size: large;">class Discount {
giveDiscount() {
return this.price * 0.2
}
}</span></pre>
<span style="font-family: "georgia" , "times new roman" , serif; font-size: large;"><b> </b></span><span style="font-family: "georgia" , "times new roman" , serif; font-size: large;">في المثال أعلاه إذا أردت أن تغطي خصما بمقدار 40% لمستخدمي VIP فقد تعدل الصنف بهذا الشكل: </span><span style="font-size: large;"><br /></span><br />
<pre class="graf graf--pre graf-after--p" dir="ltr" id="6a4b" name="6a4b" style="text-align: left;"><span style="font-size: large;">class Discount {
giveDiscount() {
if(this.customer == 'fav') {
return this.price * 0.2;
}
if(this.customer == 'vip') {
return this.price * 0.4;
}
}
}</span></pre>
<span style="font-family: "georgia" , "times new roman" , serif; font-size: large;">ولكن هذا الشكل يخرق مبدأ OCP فإذا أردنا أن نضيف خصما آخر لنوع آخر من الزبائن, فسوف نضيف المزيد من الكود بداخل الدالة كما في المثال السابق. <br /><br />فأما إذا أردناه أن يتوافق مع OCP فسنقوم بعمل صنف آخر يرث Discount ونحدد فيه قيمة الخصم المراد. </span><span style="font-size: large;"><br /></span><br />
<pre class="graf graf--pre graf-after--p" dir="ltr" id="885f" name="885f" style="text-align: left;"><span style="font-size: large;">class VIPDiscount: Discount {
getDiscount() {
return super.getDiscount() * 2;
}
}</span></pre>
<span style="font-family: "georgia" , "times new roman" , serif; font-size: large;">فمثلا إذا أردنا خصم 80% لمستخدمي VIP فسيكون على الشكل: </span><span style="font-size: large;"><br /></span><br />
<pre class="graf graf--pre graf-after--p" dir="ltr" id="4d5c" name="4d5c" style="text-align: left;"><span style="font-size: large;">class SuperVIPDiscount: VIPDiscount {
getDiscount() {
return super.getDiscount() * 2;
}
}</span></pre>
<span style="font-family: "georgia" , "times new roman" , serif; font-size: large;">ترى هنا كيف قمنا بالتمديد للصنف دون التعديل عليه عند كل إضافة. </span> <span style="font-family: "georgia" , "times new roman" , serif; font-size: large;"><br /><br />انتظر المزيد في المقالات القادمة من السلسلة للتعرف على المبادئ الثلاثة الأخرى. </span> <span style="font-family: "georgia" , "times new roman" , serif; font-size: large;"><br /><br />إلى اللقاء. </span><br />
<span style="font-size: large;"><br /></span>
<span style="font-size: large;"><br /></span></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-9850191663485031082019-06-15T13:49:00.001+02:002019-06-15T13:49:14.590+02:00كيف يعمل بروتوكول HTTP (الجزء الرابع) "ترويسة الرد وكود الحالة".<div dir="rtl" style="text-align: right;" trbidi="on">
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTnxIob60LzgHc5lJGKFxTuNCWLvZkktJAMql_jqqZv_x6QOXZcG0pguJ4fSD3wsefioY7e9rcIzmNuF517mpWqXr4pSowK-KPdOZjcUxCGS0dRIdPYPmDiwOFA_mqBIZg4yRBl9WuP8iT/s1600/HTTPS-hypertext-transfer-protocol-secure.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="بروتوكول HTTP" border="0" data-original-height="315" data-original-width="580" height="346" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTnxIob60LzgHc5lJGKFxTuNCWLvZkktJAMql_jqqZv_x6QOXZcG0pguJ4fSD3wsefioY7e9rcIzmNuF517mpWqXr4pSowK-KPdOZjcUxCGS0dRIdPYPmDiwOFA_mqBIZg4yRBl9WuP8iT/s640/HTTPS-hypertext-transfer-protocol-secure.jpg" title="بروتوكول HTTP" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">بروتوكول HTTP</td></tr>
</tbody></table>
<br />
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"> في الأجزاء السابقة (<a href="https://www.questionerd.tk/2019/06/http-protocol-explaind.html">الأول</a>, <a href="https://www.questionerd.tk/2019/06/http-protocol-explaind-2.html">الثاني</a>, <a href="https://www.questionerd.tk/2019/06/http-protocol-explaind-3.html">الثالث</a>) تحدثتا عن ماهية بروتوكول http ومراحل طلب صفحة انترنت من سيرفر ما, والآن نكمل مع آخر مرحلة من هذه المراحل وهي...</span></span><br />
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><br /></span></span>
<br />
<div style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><b>الخطوة الرابعة: استقبال الرد من السيرفر. </b><br /><br />بعد ان يستقبل السيرفر ترويسة الطلب عبر اتصال TCP/TLS ويقوم بمعالجتها, وبعد أن يجلب البيانات المطلوبة سواء من قاعدة البيانات أو من نظام الملفات يبدأ في تكوين ترويسة الرد ويقوم بوضع هذه المعلومات فيها ويرسلها بعد ذلك إلى المتصفح. <br /><br />وبالنسبة لهذه الترويسة فتكون شبيهة جدا من ترويسة الطلب في البنية, ومثال على ذلك: <br /><br /><b>إذا ارسلنا هذه الترويسة في الطلب: </b></span></span></div>
<div style="text-align: left;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><span style="color: #cc0000;">GET</span> /How-does-HTTP-work HTTP/1.1<span style="color: #38761d;">\r\n</span><br /><span style="color: #cc0000;">User-Agent:</span> curl/7.24.0 (amd64-portbld-freebsd8.4) libcurl/7.24.0 OpenSSL/0.9.8y zlib/1.2.3<span style="color: #38761d;">\r\n</span><br /><span style="color: #cc0000;">Host:</span> <span style="color: #0b5394;">http://www.quora.com</span><span style="color: #38761d;">\r\n</span><br /><span style="color: #cc0000;">Accept:</span> */*<span style="color: #38761d;">\r\n</span></span></span></div>
<div style="text-align: left;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><span style="color: #38761d;">r\n\</span></span></span></div>
<div style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><b>نحصل على هذا الرد: </b></span></span></div>
<div style="text-align: left;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><br /><span style="color: #e06666;">HTTP</span>/1.1 200 <span style="color: #3d85c6;">OK</span>\r\n<br /><span style="color: #e06666;">Cache-Control:</span> private, no-store, max-age=0, no-cache, must-revalidate, post-check=0, pre-check=0\r\n<br /><span style="color: #e06666;">Content-Security-Policy:</span> default-src * data: blob:;style-src * 'unsafe-inline';script-src: https://*.quora.com https <br /><span style="color: #e06666;">Content-Type:</span> text/html; charset=utf-8\r\n<br /><span style="color: #e06666;">Expires:</span> Fri, 01 Jan 1990 00:00:00 GMT\r\n<br />Pragma: no-cache\r\n<br /><span style="color: #e06666;">Server:</span> nginx\r\n<br /><span style="color: #e06666;">Set-Cookie:</span>
m-b="ycQZx8DYXuN_5BkR08oCDQ\075\075"; Domain=.http://quora.com;
Max-Age=63072000; Path=/; expires=Sun, 09-Aug-2020 21:27:48 GMT; secure;
HttpOnly\r\n<br /><span style="color: #e06666;">Set-Cookie:</span> m-s="MI_Lrt7GQizk-YF8D1UJXw\075\075";
Domain=.http://quora.com; Max-Age=63072000; Path=/; expires=Sun,
09-Aug-2020 21:27:48 GMT; secure; HttpOnly\r\n<br /><span style="color: #e06666;">Set-Cookie: </span>
m-tgvs="G9up5DnnkGWPV9WS1NXRjyRh18qKVLrHkutQ</span></span></div>
<div style="text-align: left;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">G8pDKeJ9yiyVJf5318cPkt6Qn0lJhYLTBe7mmomjlRxnoIUN1w\075\075";
Domain=.http://quora.com; Max-Age=63115200; Path=/; expires=Mon,
10-Aug-2020 09:27:48 GMT\r\n<br /><span style="color: #e06666;">Set-Cookie:</span> m-early_v=daf763e7c3ddda99;
Domain=.http://quora.com; Max-Age=63115200; Path=/; expires=Mon,
10-Aug-2020 09:27:48 GMT\r\n<br /><span style="color: #e06666;">Strict-Transport-Security: </span>max-age=31536000;\r\n<br /><span style="color: #e06666;">X-Content-Type-Options:</span> nosniff\r\n<br /><span style="color: #e06666;">X-Frame-Options:</span> SAMEORIGIN\r\n<br /><span style="color: #e06666;">X-UA-Compatible: </span>IE=Edge, chrome=1\r\n<br /><span style="color: #e06666;">X-XSS-Protection: </span>1; mode=block\r\n<br /><span style="color: #e06666;">Transfer-Encoding: </span>chunked\r\n<br /><span style="color: #e06666;">Accept-Ranges:</span> bytes\r\n<br /><span style="color: #e06666;">Date: </span>Fri, 10 Aug 2018 21:27:48 GMT\r\n<br /><span style="color: #e06666;">Via:</span> 1.1 varnish\r\n<br /><span style="color: #e06666;">Connection:</span> keep-alive\r\n<br /><span style="color: #e06666;">X-Served-By:</span> cache-pao17433-PAO\r\n<br /><span style="color: #e06666;">X-Cache:</span> MISS\r\n<br /><span style="color: #e06666;">X-Cache-Hits: </span>0\r\n<br /><span style="color: #e06666;">X-Timer: </span>S1533936468.271117,VS0,VE103\r\n</span></span></div>
<div style="text-align: left;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">r\n\<br />!<span style="color: #0b5394;">DOCTYPE
html><html lang=en><head><link rel='icon'
href='https://qsf.fs.quoracdn.net/-3-images.favicon.ico-26-3f34badcb59c8f6c.ico'
/><script type="text/javascript">window.Q = {"fontFamilies":
["q-icons", "q_serif"], "errorSamplingRate": 1.0, "settings": {"action":
"q", "actionTrail": null, "batchedServerCallUrl":
"/webnode2/batched_server_call_POST", "clientLogTrail": null,
"componentInspector": false, "controller": "question", "cookiePrefix":
"m", "debug": false, "enableFrameBusting": true<br />. . .</span></span></span></div>
<div style="text-align: right;">
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">ويشير السطر الأول منها إلى <a href="https://en.wikipedia.org/wiki/List_of_HTTP_status_codes" rel="nofollow">حالة</a> الرد ويكون على الشكل (الإصدار كود-الحالة الرسالة). <br /> </span></span></div>
<ul style="text-align: right;">
<li><span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><b>الإصدار:</b> ويشير إلى إصدار بروتوكول نقل النص التشعبي المستخدم في ارسال ترويسة الطلب. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><b>كود الحالة والرسالة:</b> وفي هذه الحالة " OK 200" تعني أن السيرفر وجد الملفات أو المعلومات المطلوبة بنجاح وأرفقها في الرد. وهناك أيضا حالات أخرى معرفة ضمن البروتوكول http ومنها "found 302" والتي تستخدم لإعادة توجيه المتصفح إلى عنوان URL آخر, و"not found 404" والتي تعنى أن السيرفر لم يجد المعلومات أو المطلوبة, و الحالة "internal server error 500" والتي تعني أنه حدث خطاء ما بداخل السيرفر. </span></span></li>
</ul>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><br /><b>يحتوي الرد كما ترى على حقول كثيرة والتي تحدثنا عنها في الجزء السابق وسأشرح البعض منها: </b></span></span><br />
<ul style="text-align: right;">
<li><span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><b>حقل "content-type" :</b> يخبر المتصفح أن محتويات الرد (الملف المطلوب) هو نص بلغة HTML بترميز UTF-8 وهذا الترميز يحتوي على حروف ليست في جدول ASCII. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><b>حقل "server" :</b> يخبر المتصفح بنوع السيرفر المستخدم وهو هنا <a href="https://www.nginx.com/" rel="nofollow">NGINX</a>. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><b>حقول "set-cookie" :</b> يستخدمها السيرفر لتخزين بيانات محلية في المتصفح. ولقد اكتسبت الكوكيز سمعة سيئة بسبب سهولة استخدامها في خرق الخصوصية (مثل تتبع المستخدمين) وسرقة معلومات حساسة عن مستخدمي المواقع. </span></span></li>
</ul>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><b>ولكنها رغم ذلك</b> ذات أهمية كبيرة في عمل معظم المواقع, فمثلا تستخدم لحفظ تسجيل دخولك فلا تحتاج لفعل ذلك في كل مرة تزو الموقع. <br />وفي هذا الحقل تم تعريف cookie بالشكل <b>m-b="ycQZx8DYXuN_5BkR08oCDQ\075\075″</b> وهذه ال cookie سوف ترسل إلى السيرفر مع كل طلب من الطلبات اللاحقة. <br /> </span></span><br />
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">وهذا النص ذو الشكل الغريب ربما يكون مشفر باستخدام خوارزمية <a href="https://en.wikipedia.org/wiki/Base64" rel="nofollow">Base64</a> وهو يستخدم كمعرف لمتصفحي وربما يستخدم للإشارة إلى بياناتي في قاعدة البيانات. <br /><br />وكذلك تم تعريف "domain" وهو الموقع الذي يمتلك هذه ال cookie وهو مهم حتى لا يتمكن أي موقع آخر من استخدامها. <br /><br />وقيمتي "max-age" و"expires" تشيران إلى المدة التي سيحتفظ فيها المتصفح بها. وإذ أردت معرفة المزيد عنها يمكنك النظر<a href="https://en.wikipedia.org/wiki/HTTP_cookie" rel="nofollow"> هنا</a>. </span></span><br />
<ul style="text-align: right;">
<li><span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><b>حقل "transfer-encoding" :</b> يحدد الكيفية التي ستنقل بها محتويات الرد إلى المتصفح, وأبسط طريقة لفعل لذلك هي وضع المحتويات بالكامل في الرد وكذلك وضع حقل "content-length" الذي يحتوي على حجم البيانات بالبايت. </span></span></li>
</ul>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><br />ولكن هذه الطريقة لا تفلح إذا كان السيرفر يرسل البيانات على شكل دفعات ولا يعلم حجم البيانات الكامل حتى ينتهى, فيقوم بوضع حجم كل دفعة معها بدلا الحجم الكامل للبيانات. وفي هذه الحالة لن ينتظر المتصفح حتى يستلم البيانات كاملة حتى يقوم بعرضها. <br /><br />ويمكن لهذه البيانات (لاحظ هنا أنه هناك فرق بيت ترويسة الرد ومحتويات الرد) أن تكون خليط من أنوع مختلفة من البيانات (HTML, CSS, JavaScript, JSON, ...etc). <b></b></span></span><br />
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">وفي النهاية يعالج المتصفح البيانات ويعرضها أمامك كما تراها الآن. <br /><br />وبينما ركزت على ذكر الطلب والرد لصفحة الانترنت, فمن الجدير بالذكر أنه يحدث في الخلفية طلبات أخرى<b> لكل صورة </b>في الصفحة مع الفعل GET وينتج ردا به الحقل "content-type" وله القيمة "image/jpeg" أو أي نوع آخر من الصور. <br /><br />في المتصفحات الكبرى يوجد أدوات لتتبع الطلبات الصادرة والردود الواردة وهي موجودة في "أدوات المطور", وفي متصفح كروم توجد في المسار "more-tools >> developer tools" <b>وتبدو بهذا الشكل</b>: </span></span><br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQy67HbYdVAoN_Ud3saM9gEQ1p_Xa0E9Gfv0sgWBXj3A0xTKUOAfc0TONy5rbWTuH_bXR0hk_BgZCgdBiSCw-BDASdbbqTe0zE8QUZsQ8iUE9VRE8Y5qm9D3kdKi0xpuQbb0ighVpfHy1w/s1600/chrome-dev-tools.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="chrome dev tools" border="0" data-original-height="323" data-original-width="602" height="213" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQy67HbYdVAoN_Ud3saM9gEQ1p_Xa0E9Gfv0sgWBXj3A0xTKUOAfc0TONy5rbWTuH_bXR0hk_BgZCgdBiSCw-BDASdbbqTe0zE8QUZsQ8iUE9VRE8Y5qm9D3kdKi0xpuQbb0ighVpfHy1w/s400/chrome-dev-tools.jpg" title="chrome dev tools" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">chrome dev tools</td></tr>
</tbody></table>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><br /></span></span>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">وبهذا ينتهى المتصفح من عرض الصفحة أمامك بالكامل, وينتهى الجز الأخير من شرح عمل البروتوكول.</span></span><br />
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><br /></span></span>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;">إلى اللقاء.😀</span></span><br />
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><br /></span></span>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><br /></span></span>
<span style="font-family: "georgia" , "times new roman" , serif;"><span style="font-size: large;"><br /></span></span></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-57341565598916668562019-06-14T12:48:00.000+02:002019-06-14T12:59:03.919+02:00كيف يعمل بروتوكول HTTP (الجزء الثالث) "ارسال ترويسة الطلب".<div dir="rtl" style="text-align: right;" trbidi="on">
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjknfuoOsfhcWjwQDzWhAZcd-8SwcgsogcHAr8aQn2-hOvpcoAImzK75b1Z36vD1yhVrxja867Oz8uYtejxccDrfLoRW7VPtvnwQmUbHzDian8VYb8XaTggVoWdJjChjHvDVWNQjfkVViMX/s1600/Hypertext-Transfer-Protocol.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="http protocol" border="0" data-original-height="720" data-original-width="960" height="480" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjknfuoOsfhcWjwQDzWhAZcd-8SwcgsogcHAr8aQn2-hOvpcoAImzK75b1Z36vD1yhVrxja867Oz8uYtejxccDrfLoRW7VPtvnwQmUbHzDian8VYb8XaTggVoWdJjChjHvDVWNQjfkVViMX/s640/Hypertext-Transfer-Protocol.jpg" title="http protocol" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">بروتوكول http</td></tr>
</tbody></table>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><br /></span></span>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;">تحدثنا في الجزئيين <a href="https://www.questionerd.tk/2019/06/http-protocol-explaind.html">الأول</a> و<a href="https://www.questionerd.tk/2019/06/http-protocol-explaind-2.html">الثاني</a> عن ماهية بروتوكول http وعن كيفية عملة في الخلفية وما هي الخطوات التي يمر بها طلبك لصفحة ما من موقعك المفضل, والآن نكمل حديثنا عن تلك الخطوات. </span></span><br />
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><br /></span></span>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;">3. <b>الخطوة الثالثة:</b> ارسال ترويسة طلب http إلى السيرفر. </span></span><br />
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><br /></span></span>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;">وأخيرا بعد فتح الاتصال مع الخادم يمكننا الآن التحدث إليه. فيقوم المتصفح بتكوين الطلب على شكل ترويسة http وإرساله إلى الخادم عبر اتصال TLS/TCP. </span></span><br />
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><br /></span></span>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;">ومن الجميل أن بروتوكول http هو بروتوكول نصي (أي يقوم بإرسال الطلبات على هيئة نصوص), لذلك فمن السهل جدا أن تقوم بقراءتها. ويبدو طلب http بهذا الشكل (من الضروري إلحاق علامة نهاية السطر \r\n في نهاية كل حقل من حقول ترويسة الطلب): </span></span><br />
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><br /></span></span>
<br />
<div style="margin: 0in 0in 0in 0.375in; text-align: left;">
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><span style="color: #cc0000;">GET</span>
/How-does-HTTP-work HTTP/1.1<span style="color: #6aa84f;">\r\n</span></span></span></div>
<div style="margin: 0in 0in 0in 0.375in; text-align: left;">
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><span style="color: #cc0000;">User-Agent</span>: curl/7.24.0
(amd64-portbld-freebsd8.4) libcurl/7.24.0 OpenSSL/0.9.8y zlib/1.2.3<span style="color: #6aa84f;">\r\n</span></span></span>
</div>
<div style="margin: 0in 0in 0in 0.375in; text-align: left;">
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><span style="color: #cc0000;">Host</span>: <a href="http://www.questionerd.tk/">http://www.questionerd.tk</a><span style="color: #6aa84f;">\r\n</span></span></span></div>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;">
</span></span><br />
<div style="margin: 0in 0in 0in 0.375in; text-align: left;">
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><span style="color: #cc0000;">Accept</span>:
*/*<span style="color: #6aa84f;">\r\n</span></span></span></div>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;">
</span></span><br />
<div style="margin: 0in 0in 0in 0.375in; text-align: left;">
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><span style="color: #6aa84f;">r\n\</span></span></span>
</div>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;">
</span></span><span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><br /></span></span>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;">والسطر الأول <b>يبين نوع الطلب</b> ويكون على الشكل (<b>فعل الملف-المطلوب اصدار http \r\n)</b>: </span></span><br />
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><br /></span></span>
<br />
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><b>الفعل: </b>وهو يوضح للسيرفر ماذا يفعل, وهو في هذه الحالة GET وتعني احضر, ويوجد <a href="https://en.wikipedia.org/wiki/Hypertext_Transfer_Protocol#Request_methods" rel="nofollow">أفعال أخري</a> غير هذا ويعتبر POST أهمها فهو يستخدم لإرسال البيانات إلى السيرفر. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><b>الملف-المطلوب:</b> وهو جزء العنوان URL الذي يخبر السيرفر أي ملف يحضر (وفي هذه الحالة "/" تعنى الصفحة الرئيسية). </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><b>اصدار http:</b> ويحدد اصدار http وهو في هذه الحالة HTTP/1.1. </span></span></li>
</ul>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><br /></span></span>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;">أما ا<b>لسطور الأخرى</b> فتحتوي على حقول تحمل معلومات إضافية إلى السيرفر وتكون على الشكل (<b>الاسم: القيمة \r\n</b>). </span></span><br />
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><br /></span></span>
<br />
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><b>الاسم:</b> ويحدد معنى ووظيفة الحقل, ويمكن لتطبيقات الويب تعريف حقول خاصة بها غير تلك <a href="https://en.wikipedia.org/wiki/List_of_HTTP_header_fields" rel="nofollow">الموجودة بالفعل</a> وتكون عادة مسبوقة ب "X-". </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><b>القيمة:</b> وتحتوي القيمة على معلومات الحقل وتقدمها لترويسة http, وهي عبارة عن بيانات نصية. لا يحدد البروتوكول حد أقصى لطول هذه البيانات ولكن قد يفعل السيرفر, فمثلا سيرفر الأباتشي يحددها ب 8192 بايت كحد أقصى لطول هذه البيانات. </span></span></li>
</ul>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><br /></span></span>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><b>وللنظر الآن إلى بقية الحقول الموجودة في ترويسة الطلب هذه:</b> </span></span><br />
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><br /></span></span>
<br />
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><b>حقل "user agent" </b>يخبر السيرفر نوع البرنامج أو المتصفح الذي أرسل الطلب.وهنا "curl 7.24.0" تخبره أنني استخدمت برنامج curl وكذلك اصداره هو 7.24.0 وهو ليس متصفحا حقيقيا بل برنامج قادر على تكوين ترويسة http وارسالها وكذلك اظهارها مع ترويسة الرد التي سنعرفها في الجزء القادم, ويمكنك الحصول عليه من <a href="https://curl.haxx.se/" rel="nofollow">هنا</a>. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><b>حقل "Host"</b> يخبر السيرفر عن اسم النطاق أو عنوان IP للموقع الذي اطلبه, على الرغم أننا لا نحتاجه في الاتصال (فهو منشئ بالفعل) إلا أنه مفيد للسيرفر في بعض الأحيان عند معالجة الطلب. </span></span></li>
</ul>
<ul style="text-align: right;">
<li><span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><b>حقل "Accept"</b> والذي يخبر السيرفر أي نوع من البيانات يمكن لمتصفحي فهمها ومعالجتها وهنا "*/*" تعنى كل أنواع البيانات (والتي هي كذبة في الحقيقة ف curl لا يظهر سوى البيانات النصية).والقيمة الواقعية يمكن أن تكون مثلا "text/html" والتي تعنى أن المتصفح قادر على فهم ومعالجة HTML. </span></span></li>
</ul>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><br /></span></span>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;">وأخيرا السطر الأخير الذي يحتوي على علامة نهاية "\r\n" السطر فقط يعنى <b>نهاية الترويسة</b>. </span></span><br />
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><br /></span></span>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;">وبهذا نكون قد تعرفنا بالتفصيل على <b>الخطوة الثالثة</b> والأهم من خطوات عمل بروتوكول http وعن تركيبة الترويسة التي يرسلها المتصفح (أو أي برنامج) إلى السيرفر. </span></span><br />
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><br /></span></span>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;">انتظر الخطوة الرابعة وهي تلقى الرد من السيرفر وكيف يكون شكل ترويسة الرد في الجزء القادم. </span></span><br />
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><br /></span></span>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;"><br /></span></span>
<span style="font-size: large;"><span style="font-family: "georgia" , "times new roman" , serif;">إلى اللقاء. </span></span><br />
<br />
<br /></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-30264328692354612832019-06-13T13:38:00.000+02:002019-06-13T13:39:38.883+02:00كيف يعمل بروتوكول HTTP (الجزء الثاني) "خطوات ارسال الطلب".<div dir="rtl" style="text-align: right;" trbidi="on">
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_kkRZ3iu5AwqwK0I7Xoo7bs5nuZMMf8xPpXB8FsULuMwZXc7hlknyujxDfZtXsOqwe6cg-THwklUWeSKyTg8dEkB3tF500onMOc3T-pR9rgh9ZYn_7UlALayeuQNJJdV0oaGpFIncM1Uj/s1600/HTTPS-hypertext-transfer-protocol-secure.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="بروتوكول http" border="0" data-original-height="315" data-original-width="580" height="346" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_kkRZ3iu5AwqwK0I7Xoo7bs5nuZMMf8xPpXB8FsULuMwZXc7hlknyujxDfZtXsOqwe6cg-THwklUWeSKyTg8dEkB3tF500onMOc3T-pR9rgh9ZYn_7UlALayeuQNJJdV0oaGpFIncM1Uj/s640/HTTPS-hypertext-transfer-protocol-secure.jpg" title="بروتوكول http" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">الصورة <a href="https://www.redlettersph.com/google-favors-https-pages-in-its-indexing-system/" rel="nofollow">redlettersph.com</a></td></tr>
</tbody></table>
<br />
في<a href="https://www.questionerd.tk/2019/06/http-protocol-explaind.html"> الجزء السابق</a> تحدثنا عن ماهية بروتوكول <a href="https://www.quora.com/How-does-HTTP-work" rel="nofollow">HTTP</a> وعن الخطوات التي تحدث في الخلفية عند طلب صفحة من موقع الكتروني, والآن سنتحدث عن تلك الخطوات <b>بشيء من التفصيل</b>. <br />
<br />
1. الخطوة الأولى:<b> استعلام </b><a href="https://en.wikipedia.org/wiki/Domain_Name_System" rel="nofollow">DNS</a> "<b>مخدم أسماء النطاقات</b>". <br />
<br />
العنوان "https://www.questionerd.tk/2019/06/http-protocol-explaind.html" يسمى<br />
<a href="https://en.wikipedia.org/wiki/URL" rel="nofollow">URL</a> (Uniform Resource Location) أي موقع المصدر الموحد ويتكون من ثلاثة أجزاء:<br />
<ul style="text-align: right;">
<li>محدد لنوع البروتوكول المستخدم وفى هذه الحالة هو بروتوكول <a href="https://en.wikipedia.org/wiki/Http" rel="nofollow">HTTP</a>. </li>
</ul>
<ul style="text-align: right;">
<li>اسم الموقع الإلكتروني المطلوب (<a href="http://www.questionerd.tk/">www.questionerd.tk</a>). </li>
</ul>
<ul style="text-align: right;">
<li>المسار إلى الملف المطلوب احضاره من السيرفر (/2019/06/http-protocol-explaind.html/). </li>
</ul>
<br />
لقد استخدمت "www.questionerd.tk" كعنوان للموقع لكن هذا اسم سهل الحفظ والتذكر مقارنة <b>بالعنوان الحقيقي</b> للموقع وهو "172.217.171.243" وهذا يسمى عنوان بروتوكول الانترنت <a href="https://en.wikipedia.org/wiki/IP_address" rel="nofollow">IP address</a> وكل شيء متصل بالإنترنت له مثل هذا العنوان.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
ولكن من يمكنه تذكر عنوان كهذا لكل موقع يزوره, وكذلك فإن الحواسيب <b>لا يمكنها</b> فهم إلا عنوان IP وللتوفيق بين هذين الأمرين تم اختراع DNS وهو <b>كدليل الهاتف</b> ولكن للإنترنت. والذي يمكنك من معرفة عنوان IP المقابل لكل مواقع الأنترنت. <br />
<br />
فعنما تطلب "www.questionerd.tk" من متصفحك يقوم بالذهاب الى خادم DNS ويحضر لك عنوان IP الخاص بهذا الموقع ثم بعد ذلك يستطيع الذهاب إليه بسهولة. <br />
<br />
بالمناسبة يمكنك استخدام اداة تسمى ping (موجودة بشكل افتراضي في الويندوز وكذلك اللينكس) لمعرفة عنوان IP لأى موقع كما أنه أداة مفيدة لفحص اتصالك به (ما إذا كان يمكنك الاتصال به أم لا), ويمكن أيضا أن تعطيك فكرة عن سرعة الاتصال.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfIP-4ISLQloruM76JNKrQXOd1PerDqf6HQ0EbTJGoTazpk81vwCLAh8776lKSreHMuhjHEwJDyQLmxaTugT9H2DRrvM7_kpdE_3Aw3jUXig9RHYYVS1CZgINcfLFMi3yns4h1OUVkummE/s1600/cmd-ping-fail.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="ping أداة" border="0" data-original-height="301" data-original-width="642" height="300" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfIP-4ISLQloruM76JNKrQXOd1PerDqf6HQ0EbTJGoTazpk81vwCLAh8776lKSreHMuhjHEwJDyQLmxaTugT9H2DRrvM7_kpdE_3Aw3jUXig9RHYYVS1CZgINcfLFMi3yns4h1OUVkummE/s640/cmd-ping-fail.png" title="ping أداة" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">ping google</td></tr>
</tbody></table>
<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
كما ترى في المثال أعلاه فإنه يخبرك بعنوان IP لجوجل وكذلك أنه أخذ في المتوسط حوالي 1 مللي ثانية لإرسال حزمة مكونة من 32 بايت من البيانات في كل مرة من الأربع مرات, ويحصل كذلك على الرد بنفس الحجم وكذلك يخبرك أنه لم يحدث أي فقد في البيانات.<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmjsn0Kd9F79AQpDn-7hM_m0c6QKerD-stR32czo25VcTf7kiKmB4WeJhFcbOBs68hsDjPKQ_ZmnBYfpmv6NGuJ98AOIqivpNxSmqynJ2RJ5jUvOaxI20Bez6HGRgkn0JGeyPkPIWPDXw8/s1600/cmd-ping.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="ping أداة" border="0" data-original-height="302" data-original-width="642" height="300" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmjsn0Kd9F79AQpDn-7hM_m0c6QKerD-stR32czo25VcTf7kiKmB4WeJhFcbOBs68hsDjPKQ_ZmnBYfpmv6NGuJ98AOIqivpNxSmqynJ2RJ5jUvOaxI20Bez6HGRgkn0JGeyPkPIWPDXw8/s640/cmd-ping.png" title="ping أداة" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">ping failed</td></tr>
</tbody></table>
<br />
<br />
وفي هذه الصورة يخبرك أنه فشل في الوصول إلى الواجهة المطلوبة وأن متوسط الوقت لإرسال الحزم هو أيضا 1 مللي ثانية. <br />
<br />
<br />
2. <b>الخطوة الثانية</b>: الاتصال<b> بالخادم </b>الخاص بالموقع. <br />
<br />
حينما يحصل متصفحي على عنوان IP المطلوب يتصل بهذا العنوان عن طريق بروتوكول التحكم في النقل <a href="https://en.wikipedia.org/wiki/Transmission_Control_Protocol" rel="nofollow">TCP</a> وهو من أهم وأقدم البروتوكولات التي<b> تأسس عليها الانترنت</b> وهو يقوم بفتح الاتصال مع الخادم ويتأكد من وصول البيانات الى الطرفين بشكل صحيح وبدون فقد. <br />
<br />
ولاحظ استخدام<b>https</b> بدلا من <b>http</b>, وذلك يعني أنني أود استخدام اتصال <b>آمن ومشفر</b> بيني وبين الخادم, ويتم ذلك باستخدام بروتوكول (SSL\<a href="https://en.wikipedia.org/wiki/Transport_Layer_Security" rel="nofollow">TLS</a>) لتأمين الاتصال وهذا البروتوكول يمكن المتصفح من تشفير البيانات المرسلة إلى السيرفر وفك تشفير المستقبلة منه. <br />
<br />
ولفعل هذا يقوم المتصفح والسيرفر بتبادل مفاتيح التشفير وفك التشفير فيما بينهما في بداية الاتصال. <br />
<br />
وبهذا تنتهى الخطوة الثانية من خطوات الاتصال وينتهى معها هذه المقالة. انتظر المقالة القادمة لمعرفة المزيد عن كيفية ارسال طلب الى السيرفر وكيف يكون شكله بالتفصيل. <br />
<br />
إلى اللقاء. 😀<br />
<br />
<br /></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-10662975210208859482019-06-12T12:03:00.000+02:002019-06-12T12:03:31.403+02:00كيف يعمل بروتوكول HTTP (الجزء الأول) "ما هو بروتوكول نقل النص التشعبي".<div dir="rtl" style="text-align: right;" trbidi="on">
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5Hl5h2QEcMcXbjGGH5QGrGSlnCJUDk-my2wZFZebKTRd9EOE82c0o6gX2TW7UxspHDgMbOsm-U_9GvqgNHPnEZv7UbItvtTicrZ6kRV0uDN_JMihHJfeoAV2l8qnPtySrucNPjClkCZHb/s1600/Hypertext-Transfer-Protocol.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="بروتوكول HTTP" border="0" data-original-height="720" data-original-width="960" height="480" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5Hl5h2QEcMcXbjGGH5QGrGSlnCJUDk-my2wZFZebKTRd9EOE82c0o6gX2TW7UxspHDgMbOsm-U_9GvqgNHPnEZv7UbItvtTicrZ6kRV0uDN_JMihHJfeoAV2l8qnPtySrucNPjClkCZHb/s640/Hypertext-Transfer-Protocol.jpg" title="بروتوكول HTTP" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">الصوره <a href="http://slideplayer.com/slide/7735526/" rel="nofollow">slideplayer.com</a></td></tr>
</tbody></table>
<br />
الم تتساءل من قبل <a href="https://www.quora.com/How-does-HTTP-work" rel="nofollow">كيف يعمل الانترنت</a>, ما الذي يحدث في الخلفية من امور عندما تطلب <a href="http://www.questionerd.tk"">موقعك المفضل</a>؟ حسنا دعني اعرفك عن المسؤول عن هذا. انه بروتوكول HTTP. حسنا... <b>ماهو وماذا يفعل؟؟</b> <br /><br /><b>HTTP</b> هي اختصار ل"HyperText Transfer Protocol" وهو بروتوكول نقل النص التشعبي. <br /><br /><b>HyperText </b>وهو النص التشعبي ويعني الملفات النصية التي تحتوي على روابط تشير إلى ملفات أخرى. <br /><br /><b>HTML </b>وهي اختصار ل"HyperText Markup language" وهي لغة ترميز النص التشعبي, وتستخدم في هيكلة تلك الملفات النصية. <br /><br /><b>Transfer</b> أو النقل ويعني أن ملفات النص التشعبي يتم نقلها بين برنامجي حاسوب, يكون في العادة بين <b>المتصفح والخادم</b>. <br /><br /><b>ملاحظة تاريخية</b>: تم اختراع بروتوكول HTTP من قبل <a href="https://en.wikipedia.org/wiki/Tim_Berners-Lee" rel="nofollow">تيم بيرنرزلى</a> لمشاركة الأوراق البحثية بين الفيزيائيين في <a href="https://en.wikipedia.org/wiki/CERN" rel="nofollow">سيرن</a> والتي كانت تحتوي على الكثير من الروابط لأوراق أخرى. <br /><br /><b>Protocol</b> البروتوكول وهو مجموعة من القواعد التي تحدد كيفية الاتصال بين جهتين. ويحدد البروتوكول <b>شكل البيانات</b> التي يتم تبادلها بين الطرفين, <b>وكيفية التصرف</b> في مواقف محددة مثل فقد الاتصال بين الطرفين. ويتكون الانترنت من العديد من الشبكات المتصلة ببعضها لتكون الشبكة العالمية الواسعة(World Wide Web). <br /><br />تم تعريف بروتوكول HTTP بشكل رسمي من قبل منظمة (Internet Engineering Task Force)و(World Wide Web Consortium)في سلسلة من الملفات التي تحتوي على <b>معايير هذا البروتوكول </b>والمسماة RFCs. <br /><br />حسنا... دعنا ننظر إلى هذا المثال لتوضيح الأمور: عندما تكتب في شريط عنوان متصفحك "<a href="http://www.questionerd.tk/">http://www.questionerd.tk</a>" هذا ما سيحدث. <br />
<ul style="text-align: right;">
<li>المتصفح يتصل بالسيرفر الذي يحتوي الموقع. </li>
</ul>
<ul style="text-align: right;">
<li>ثم يرسل في طلب الصفحة عبر بروتوكول HTTP. </li>
</ul>
<ul style="text-align: right;">
<li>يرسل الخادم الصفحة إلى المتصفح على شكل ملف HTML. </li>
</ul>
<ul style="text-align: right;">
<li>يعرض المتصفح الصفحة أمامك. </li>
</ul>
<br /><b>ولكن </b>هذ التوضيح سطحي جدا, فهناك الكثير من التفاصيل الدقيقة التي حدثت في الخلفية, <b>وما هي المرحل</b> الفعلية التي حدثت لتصلك الصفحة المطلوبة؟؟ <br /><br /><b>وهذه المراحل هي: </b><br /><br />
<ul style="text-align: right;">
<li>مرحلة استعلام DNS من خوادم أسماء النطاقات. </li>
</ul>
<ul style="text-align: right;">
<li>الاتصال بالخادم بعد معرفة عنوان IP الخاص به. </li>
</ul>
<ul style="text-align: right;">
<li>إرسال طلب HTTP إلى السيرفر. </li>
</ul>
<ul style="text-align: right;">
<li>استلام الرد من السيرفر على شكل HTML وتفسيره وعرضه في المتصفح. </li>
</ul>
<br /><b>كل هذا سنعرفه بالتفصيل في المقالات القادمة. </b><br /><br />إلى اللقاء.😀<br />
<br /><br /> <br /></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-1909391963011134292019-06-11T16:12:00.001+02:002019-06-11T16:12:39.291+02:00كيف تفكر كالمبرمج (الجزء الثالث).<div dir="rtl" style="text-align: right;" trbidi="on">
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEIY6IRpnxxRG84KV4CklSxVdfhFfD_dR6rHesj0Unquo1r5PnlRLFQLED_T4HdB1lcxOtAZGgEwWtvt8ReEeL1BUD79jsQzgjOjCy2hWZiQuufmUvCtNrgBY8oI77pq1Uv5E6CiMM-bXJ/s1600/problem-solving.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="مهارة-حل-المشكلات" border="0" data-original-height="925" data-original-width="1000" height="592" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEIY6IRpnxxRG84KV4CklSxVdfhFfD_dR6rHesj0Unquo1r5PnlRLFQLED_T4HdB1lcxOtAZGgEwWtvt8ReEeL1BUD79jsQzgjOjCy2hWZiQuufmUvCtNrgBY8oI77pq1Uv5E6CiMM-bXJ/s640/problem-solving.jpg" title="مهارة-حل-المشكلات" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">الصورة <a href="https://myjobadvice.wordpress.com/2017/03/09/problem-show-your-skills-solve-it/" rel="nofollow">wordpress.com</a></td></tr>
</tbody></table>
<br /><br /> نكمل حديثنا ففى<a href="https://www.questionerd.tk/2019/06/art-of-problem-solving.html"> الجزء الأول</a> و<a href="https://www.questionerd.tk/2019/06/art-of-problem-solving-2.html">الجزء الثاني </a>تحدثنا عن أهمية مهارة حل المشكلات لتفكر كالمبرمجين وكذلك الخطوات للوصول إلى ذلك. <br /><br /><span style="font-size: large;"><b>الممارسة... الممارسة... ثم الممارسة. </b></span><br /><br />لا تتوقع أن تصبح جيدا سريعا. إذا أردت أن تصبح جيدا في <a href="https://medium.com/free-code-camp/how-to-think-like-a-programmer-lessons-in-problem-solving-d1d8bf1de7d2" rel="nofollow">حل المشكلات</a> فعليك بالممارسة, قم بحل الكثير منها, وبعد ذلك سيصبح الأمر <b>أسهل وأسهل</b>. <br /><br /><b>إذا كيف تمارس</b>؟؟ حسنا... هناك عدة خيارات, مثل أن تلعب ألعاب كالشطرنج, ألعاب الفيديو, السدوكو, المونوبولي ... أو أن تقوم بحل المسائل الرياضية. <br /><br />في الحقيقة أن من الشائع بين الأشخاص الناجحين ممارسة "حل المشكلات المصغرة", فبيتر ثيل مثلا يلعب الشطرنج وإيلون ماسك يلعب ألعاب الفيديو. <br /><br /><blockquote class="tr_bq">
"إذا أردت أن تعرف كيف ستبدو ريادة الأعمال في خلال3 أو5 سنوات انظر إلى ما يحدث في ألعاب الأنترنت" - بيرون ريفز </blockquote>
<br />بالنظر إلى اليوم فإن (إيلون ماسك, ريد هوفمان ومارك زوكربيرج) وكثر غيرهم يؤكدون أن ألعاب الفيديو كانت أساسية في نجاحهم في بناء شركاتهم. <br /><br /><b>هل هذا يعنى أن تلعب ألعاب الفيديو فقط</b>؟ لا أبدا عليك فقط أن تجد طريقة تستمتع بها وتساعدك في شحذ عقلك وتطوير مهارات حل المشكلات لديك. <br /><br /><b>على سبيل المثال</b> أنا استمتع بتحديات البرمجة, فأقوم كل يوم بحل تحدي واحد على الأقل (عادة على موقع coderbyte). فجميع المشاكل أيا كان نوعها لديها صفات مشتركة. <br /><br /><b>وفى الختام... </b><br /><br />أنت الأن تعرف كل شيء عن كيفية التفكير كمبرمج وكذلك تعرف أن أهم مهارة يمتلكها أفضل المبرمجين هي مهارة حل المشاكل. <br /><br /><b>وأخيرا... </b>أتمنى أن تواجه العديد من المشكلات 😉.<br /><br /><blockquote class="tr_bq">
"عندما تظن أنك قد عبرت عائق بسلام, ظهر آخر على الفور. لكن هذا ما يجعل الحياة ممتعة. <br /><br />الحياة هي عملية تخطي هذه العوائق, في كل مرة تتعلم شيء جديد, في كل مرة تزداد قوة وحكمة ويتطور منظورك للحياة, في كل مرة يسقط جزء من المنافسة حتى لا يتبقى سواك أنت : أفضل نسخة منك" - ريان هوليداي. </blockquote>
<br />والآن اذهب وحل مشكلاتك. <br /><br />إلى اللقاء.<br />
<br />
<br />
<br /><br /> </div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-40135997080642539042019-06-10T17:42:00.000+02:002019-06-10T17:42:14.592+02:00كيف تفكر كالمبرمج (الجزء الثاني) "خطوات حل المشكلة".<div dir="rtl" style="text-align: right;" trbidi="on">
<span style="font-size: large;"><span style="font-size: small;"><span style="font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;"> <table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi53ZoOK6dB9FnKl3wsLpqy4K1Qb1zoagXhY7SQkQ6_NT6VsKtF81KizzhJPOCZlws2gqIgqaYSOE5IVdIvQvyA3eMSJobCLA8Wukthn92NWEGtwhEfHpz69DzA0f2aagvfNbBj72yZ-3Ji/s1600/problem-solving.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="خطوات حل المشاكل" border="0" data-original-height="900" data-original-width="1600" height="360" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi53ZoOK6dB9FnKl3wsLpqy4K1Qb1zoagXhY7SQkQ6_NT6VsKtF81KizzhJPOCZlws2gqIgqaYSOE5IVdIvQvyA3eMSJobCLA8Wukthn92NWEGtwhEfHpz69DzA0f2aagvfNbBj72yZ-3Ji/s640/problem-solving.jpg" title="خطوات حل المشاكل" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">الصورة <a href="https://wall.alphacoders.com/by_sub_category.php?id=201562" rel="nofollow">alphacoders.com</a></td></tr>
</tbody></table>
</span></span></span><br />
تحدثنا في <a href="https://www.questionerd.tk/2019/06/art-of-problem-solving.html">الجزء الأول</a> من هذه السلسلة عن أهمية امتلاك مهارة <a href="https://medium.com/free-code-camp/how-to-think-like-a-programmer-lessons-in-problem-solving-d1d8bf1de7d2" rel="nofollow">حل المشاكل</a>, والآن نكمل الحديث عن خطوات حل المشكلة.<span style="font-size: large;"><span style="font-size: small;"><span style="font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;"> </span></span></span><br />
<span style="font-size: large;"><span style="font-size: small;"><br /></span></span>
<span style="font-size: large;"> الخطوة الأولى: افهم المشكلة. </span><br /> افهم المشكلة جيدا, فالمشكلات صعبة لأنك لا تفهمها جيدا (لذلك فهي الخطوة الأولى).<br />
حسنا... كيف تعرف إذا أنك تفهم المشكلة؟ <b>عندما تتمكن من شرحها بلغة بسيطة.</b><br /><br /> هل حدث من قبل ووقعت في مشكلة, وعندما بدأت في شرحها لنفسك ظهر ت تلك الثغرات التي لم ترها من قبل. <br />
<blockquote class="tr_bq">
"إذا لم تستطع شرح شيء ما بلغة بسيطة, فأنت لا تفهمه جيدا" - ريتشارد فينمان </blockquote>
<br /> <span style="font-size: large;">الخطوة الثانية: خطط للحل.</span><br />
لا تبدأ أبدا بحل المشكلة بدون خطة (وأنت تأمل بطريقة ما أن تحلها). <b>خطط للحل.</b><br />
لا شيء سيساعدك أكثر من <b>كتابة خطوات الحل </b>واضحة أمامك, فعليك إعطاء عقلك الوقت لتحليل المعلومات ومعالجتها. <br /><br /> <b>يمكن لإجابة هذا السؤال أن تساعدك في الحل: </b><br />
إذا كان لديك المعطى ( س), ما هي الخطوات اللازمة للوصول للناتج (ص)؟؟ <br /><br /> <span style="font-size: large;">الخطوة الثالثة: قسمها إلى أجزاء (فرق تسد).</span><br />ركز في هذه الخطوة جيدا, <b>لأنها أهم خطوة</b>, وكذلك تعتبر حجر الزاوية للوصول للحل.<br /><br /> لا تحاول حل المشاكل في صيغتها الكبيرة والمعقدة, فسوف ينتهى بك الأمر باكيا. بدلا من ذلك<b> قسمها إلى أجزاء صغيرة</b> وبسيطة, ثم حلها بالتتابع بدأ بالأسهل (الأقرب إلى الحل). وبعد أن تصل هذه الأجزاء ببعضها سوف يظهر أمامك الحل للمشكلة التي تواجهها. <br /><br />
<blockquote class="tr_bq">
"إذا أردت أن تعلم المبرمج المبتدئ مهارة واحدة لحل المشاكل فسوف تكون ‘تبسيط المشاكل‘. على سبيل المثال فلتفترض أنك مبرمج مبتدئ وطلب منك عمل برنامج يقوم بأخذ عشرة أرقام وحساب ثالث أكبر رقم. بالنسبة للمبتدئ قد تكون هذه المهمة صعبة قليلا رغم أنها تتطلب كود بسيط جدا. إذا علقت فلتبدأ بشيء أبسط مثل أن تحسب الأكبر في مجموعة الأرقام أو الأكبر في ثلاثة أرقام أو رقمين.</blockquote>
<blockquote>
ابدأ بتبسيط المشكلة حتى تستطيع حلها ثم وسعها قليلا في كل خطوة حتى تصل إلي الحل للمشكلة الكبيرة التي بدأت بها" - V. anton Spraul </blockquote>
<br /><span style="font-size: large;">الخطوة الرابعة: هل علقت؟ </span><br />
<b>قد تتساءل الآن</b>: "هذا يبدو رائعا... ولكن ماذا إذا كنت عالقا, ولا يمكنني حتى حل جزء صغير من المشكلة؟".<br /><br /> أولا خذ نفسا عميقا, وثانيا لا تقلق فهذا طبيعي جدا ويحدث للجميع. <br /><br /> <b>حسنا هناك ثلاثة أشياء تفعلها عندما تعلق:</b><br />
<br />
<ul style="text-align: right;">
<li><b>التنقيح</b>: انتقل خلال حلك خطوة بخطوة لتجد مكمن الخطاء. (المبرمجون يسمون هذا "التنقيح"). </li>
</ul>
<br />
<blockquote class="tr_bq">
"فن التنقيح هو أن تعرف ما أمرت البرنامج أن يفعل ليس ما تظن أنك أمرته أن يفعل" - andrew Singer </blockquote>
<br />
<ul style="text-align: right;">
<li><b>إعادة التقييم(المراجعة)</b>: خذ خطوة للخلف وانظر للمشكلة من منظور أخر, هل هناك شيء يمكن تبسيطه وتعميمه أكثر. </li>
</ul>
<br />
<blockquote class="tr_bq">
"أحيانا نضيع وسط تفاصيل المشكلة وننسى المبادئ الأساسية والتي تساعد في الحل بطريقة أكثر عمومية. والمثال الكلاسيكي على هذا هو عملية جمع الأرقام (1+2+3+ ... + ن) والتي أكتشف لها جوس عندما كان صغيرا الصيغة العامة ن*(ن+1)/2 والتي وفرت عليه عناء الجمع" - C. Jordan Ball<br /> </blockquote>
<b>ملاحظة جانبية</b>: يمكنك المراجعة عن طريق البدء من جديد ومسح كل شيء, نعم أنت جاد. سوف تنبهر من فاعلية هذا التكنيك. <br /><br />
<ul style="text-align: right;">
<li> <b>البحث</b>: جوجل هو صديقك دائما. لا يهم ماهي المشكلة التي تواجهها، فقد حلها أحدهم من قبل. جد هذا الشخص أو الحل, حتى ولو حللت المشكلة (حقا... يمكنك أن تتعلم الكثير من حلول الآخرين). </li>
</ul>
<br /> <b>ولكن</b>... لا تبحث عن حل المشكلة الكبيرة, فقط حلول المشاكل الصغيرة. لأنه إذا لم تعانى لن تتعلم شيء, وإذا لم تتعلم شيء فقد أضعت وقتك. <br /><br /> حسنا... لم يتبق الكثير لتصبح أفضل في حل المشكلات.<br /><br /> انتظر البقية في الجزء الثالث والأخير من هذه السلسلة.<br /><br /> إلى اللقاء <br /><br /> <br /><br /> <br /><br /> </div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-62164476316320202482019-06-09T17:21:00.003+02:002019-06-10T17:32:15.651+02:00كيف تفكر كالمبرمج (الجزء الاول). <div dir="rtl" style="text-align: right;" trbidi="on">
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjN87QyYPfWEAmwS8E6Wh2HaT4nFazQCojSFLf9VecZUuxMJEmqLGHnpNOR76xDjxbD1pT2UhyphenhyphenfeOxAlive1nAC93H_joYO3GHeOcKTxrd0-tJahcv3HI6iL5E5T4LPTKpVY4-5Ke_pHqIG/s1600/problem-solving.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="مهارات حل المشكلات" border="0" data-original-height="631" data-original-width="1024" height="393" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjN87QyYPfWEAmwS8E6Wh2HaT4nFazQCojSFLf9VecZUuxMJEmqLGHnpNOR76xDjxbD1pT2UhyphenhyphenfeOxAlive1nAC93H_joYO3GHeOcKTxrd0-tJahcv3HI6iL5E5T4LPTKpVY4-5Ke_pHqIG/s640/problem-solving.jpg" title="مهارات حل المشكلات" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">الصورة <a href="https://awpnetwork.com/2016/02/12/want-to-survive-as-an-entrepreneur-solve-problems/" rel="nofollow"><span lang="en-US" style="direction: ltr; unicode-bidi: embed;">awpnetwork.com</span></a></td></tr>
</tbody></table>
<br />
إذا كنت مهتما بالبرمجة فربما رأيت هذا الاقتباس من قبل. <br />
<br />
<blockquote class="tr_bq">
"على الجميع أن يتعلموا البرمجة, لأنها تعلمك كيف تفكر" </blockquote>
<blockquote class="tr_bq">
-ستيف جوبز </blockquote>
وربما تساءلت, ماذا يعنى التفكير كمبرمج؟ وكيف أفعل هذا؟<br />
<br />
حسنا إنه بشكل أساسي يتمحور حول الطرق الفعالة <a href="https://medium.com/free-code-camp/how-to-think-like-a-programmer-lessons-in-problem-solving-d1d8bf1de7d2" rel="nofollow">لحل المشكلات</a>.<br />
<br />
وبنهاية هذه المقالة سوف تتعلم خطوات حل المشاكل كما يفعل المبرمج ولكن...<br />
<br />
<h4 style="text-align: right;">
لماذا هي(مهارات حل المشكلات) مهمة؟؟</h4>
نحن جميعا عندنا مشاكل، سواء كانت صغيرة أو كبيرة، نتعامل معها أحيانا بطريقة عشوائية.<br />
<br />
إلا إذا كانت لديك طريقة لحل هذه المشكلات, والتي ربما تكون(وهذه كانت طريقتي عندما بدأت البرمجة): <br />
<ol style="text-align: right;">
<li>جرب حلا.</li>
<li>إذا لم يعمل جرب آخر. </li>
<li>إذا لم يعمل كرر الخطوة 2 حتى تصيب.</li>
</ol>
حسنا... أحيانا تنجح هذه الطريقة, ولكنها أسواء الطرق لحل المشكلات، فهي مضيعة كبيرة للوقت.<br />
<br />
<blockquote class="tr_bq">
"تقريبا كل أصحاب العمل يجعلون مهارات حل المشكلات أولوية. مهارات حل المشكلات هي بالإجماع أهم مؤهل يبحث عنه أصحاب الأعمال... أكثر من إتقان لغات البرمجة, التنقيح وتصميم الأنظمة." </blockquote>
<blockquote class="tr_bq">
"إن امتلاك مهارة التفكير الحسابي, والقدرة على تقسيم المشكلات الكبيرة والمعقدة إلى أجزاء صغيرة وبسيطة لهى أكثر قيمة (إن لم تكن أكثر من ذلك) من المهارات الفنية الاساسية المطلوبة للوظيفة" </blockquote>
<blockquote class="tr_bq">
-هاكر رانك </blockquote>
ولكن أولا...<br />
<br />
<h4 style="text-align: right;">
يجب أن يكون لديك إطار عمل. </h4>
لكى أجد إطار العمل المناسب لي أتبعت نصيحة تيم فيرس في كتابة عن التعلم "the 4-hour chef", وهذا جعلني أسأل اثنان من أروع المبرمجين:<br />
<br />
<ul style="text-align: right;">
<li>"C. jodan ball" (وهو مصنف على رأس قائمة مكونة من أكثر من 65000 مستخدم لموقع coder byte) .</li>
<li>"V. anton spraul" (وهو مؤلف كتاب "think like a programmer: an introduction to creative problem solving") </li>
</ul>
لقد سألتهم نفس الأسئلة وكانت إجاباتهم متشابهة جدا, وقريبا جدا ستعرفهم. <br />
<blockquote>
"أكبر خطاء يرتكبه المبرمجون المبتدئون أنهم يركزون على تعلم طريفة بناء الجمل أكثر من تركيزهم على تعلم طرق حل المشكلات" </blockquote>
<blockquote>
-V. anton spraul </blockquote>
<br />
إذا ماذا تفعل إذا واجهت مشكلة؟ وما الخطوات التي يجب أن تتبعها لتخل المشكلة بطريقة فعالة؟ <br />
<br />
حسنا هذا ما سنعرفه معا في الجزء الثاني. <br />
<br />
<br />
إلى اللقاء <br />
<br />
<br />
<br />
<br />
<br />
<span style="font-size: large;"><span style="font-family: "helvetica neue" , "arial" , "helvetica" , sans-serif;"></span></span></div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3932226536813893842.post-85153150184403132072019-06-07T18:31:00.001+02:002019-06-09T17:22:42.286+02:00تعرف على 4 لغات برمجة تكتب باللغة العربية.<div dir="rtl" style="text-align: right;" trbidi="on">
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyNbR1L80bfZw9o4eZaP0yzrUKR5vQEiUCdBwsivFTCc39QUGOUmPzv3CDfMf_w7zXMGOMGdbIye5IBeDd488Rm3Y_-kTKpizpA8r2lNeoLfsvxTAdm8ruM8M4579biXK3DBnbtMjhuzNL/s1600/code-computer-screen%25281%2529.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="لغات برمجة عربية" border="0" data-original-height="534" data-original-width="800" height="427" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyNbR1L80bfZw9o4eZaP0yzrUKR5vQEiUCdBwsivFTCc39QUGOUmPzv3CDfMf_w7zXMGOMGdbIye5IBeDd488Rm3Y_-kTKpizpA8r2lNeoLfsvxTAdm8ruM8M4579biXK3DBnbtMjhuzNL/s640/code-computer-screen%25281%2529.jpg" title="لغات برمجة عربية" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">لغات برمجة عربية</td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: center;">
</div>
<br />
<br />
هل سألت نفسك يوما "<a href="https://www.quora.com/Why-do-countries-not-develop-a-programming-language-in-their-native-language" rel="nofollow">لماذا لايوجد لغات برمجة عربية؟</a>".<br />
حسنا لست وحدك عزيزي القارئ فلقد سألت نفسى هذا السؤال ووجدت العديد من المحاولات الرائعة وأحضرت لك منها 4 لغات من بين <a href="https://ar.wikipedia.org/wiki/%D9%84%D8%BA%D8%A7%D8%AA_%D8%A8%D8%B1%D9%85%D8%AC%D8%A9_%D8%B9%D8%B1%D8%A8%D9%8A%D8%A9" rel="nofollow">الكثير</a> لنتعرف عليهم معا.<br />
<br />
<ul style="text-align: right;">
<li><h4 style="text-align: right;">
<a href="http://ammoria.sourceforge.net/" rel="nofollow">عموريا</a>: </h4>
</li>
</ul>
<b>هى لغة برمجة غرضية التوجه ومفتوحة المصدر تستخدم اللغة العربية لكتابة الشفرة البرمجية.</b><br />
<br />
<b><i>مثال أهلا بالعالم:</i></b><br />
<br />
<b><span style="color: #073763;">اطبع</span>("أهلا بالعالم!"،<span style="color: #0b5394;">سطر جديد</span>) </b><br />
<br />
<ul style="text-align: right;">
<li><h4 style="text-align: right;">
<a href="https://alusus.org/home" rel="nofollow">الأسس</a>: </h4>
</li>
</ul>
<b>هى لغة برمجة صممت لتكون لغة شاملة وهذه الشّموليّة تتطلّب تصميم قواعد اللّغة بناءً على معايير فلسفيّة بدل المعايير العمليّة المبنيّة على بيئة عمل أو مجال محدّد، وجعلها قابلة للتطوير من قبل المستخدم أو المجتمع بدلًا من حصر عمليّة التطوير في فريق محدّد، إضافة إلى تمكين المبرمج من الوصول إلى المترجم نفسه والتّحكّم فيه. وتكون عمليّة التطوير ممكنة دون الحاجة لإعادة بناء المترجم. وهى تستخدم اللغة العربية وكذلك الانجليزية.</b><br />
<b>ظهرت بتاريخ 29-03-2014م ـ بإصدار النسخة 0.1.0 ، ثُم تلاه الإصدار 0.2.0 في 2015م.</b><br />
<br />
<b><i>فريق العمل القائم على تطويرها :</i></b><br />
<br />
سرمد خالد عبداللّه(المبتكر للغة الأسُس).<br />
هشام والي علمي(محلل نظم ومبرمج).<br />
<br />
<b>مثال البسملة </b>:<br />
<br />
<b><span style="color: #073763;">اشمل</span> "مـتم/طـرفية.أسس"؛ </b><br />
<b><span style="color: #073763;">مـتم</span>.طـرفية.<span style="color: #0b5394;">اطبع</span>(<span style="color: #cccccc;"><span style="color: #666666;">"بسم الله الرحمن الرحيم\ج"</span></span>)؛ </b><br />
<br />
<ul style="text-align: right;">
<li><h4 style="text-align: right;">
<a href="http://www.jeemlang.com/" rel="nofollow">جيم</a>: </h4>
</li>
</ul>
<h4 style="text-align: right;">
هي لغة متكاملة تستخدم اللغة العربية قلبا وقالبا كم يشير مطورها البروفيسور السوري محمد بن عمار السلكة وهى لغة عالية المستوى مثل السي وباسكال. </h4>
<i><b>برنامج حساب مساحة الدائرة باستخدام لغة جيم:</b></i><br />
<br />
<b><span style="color: #073763;">الثابت</span> بي = 3.1415 </b><br />
<b><span style="color: #073763;">المتحول</span> ق : <span style="color: #073763;">حقيقي</span> </b><br />
<b><span style="color: #073763;">المتحول</span> س : <span style="color: #073763;">حقيقي</span> </b><br />
<b><span style="color: #073763;">أكتب</span> "أدخل قطر الدائرة : " ،<span style="color: #073763;">سطر</span> </b><br />
<b><span style="color: #073763;">أقرأ</span> ق </b><br />
<b><span style="color: #073763;">أجعل</span> س = بي × (ق ÷ 2)^2 </b><br />
<b><span style="color: #073763;">أكتب</span> <span style="color: #666666;">"مساحة الدائرة = "</span> ، س </b><br />
<br />
<ul style="text-align: right;">
<li><h4 style="text-align: right;">
<b><a href="https://ebda3lang.blogspot.com/p/blog-page_30.html" rel="nofollow">إبداع</a></b>: </h4>
</li>
</ul>
<b>هى لغة برمجية عربية تتميز بالبساطة والسهولة فقواعدها قليلة بحيث يكفى كتيب صغير لشرحها جميعا و يمكن أن تستخدم في تعليم البرمجة للأطفال كما أنها لغة قوية وذات شفرة نظيفة وتستخدم كلغة مفسرة أو مترجمة. </b><br />
<br />
<i><b>مثال أهلا بالعالم:</b></i><br />
<br />
<b><span style="color: #073763;">أكتب</span>.نص(<span style="color: #666666;">"أهلا بالعالم!"</span>) </b><br />
<br />
وهكذا تعرفنا معا على بعض اللغات البرمجية العربية. وإذا أعجبتك القائمة وأردت المزيد عن لغات أخرى لاتكتب باللغة الإنجليزية فأعلمنى وستصلك فوراََ.<br />
<br />
<b>وإلى اللقاء.😀 </b><br />
<b><br /></b>
<b> </b></div>
Unknownnoreply@blogger.com0