[برمجة] أهم 3 أدوات يجب أن يتوفر عليها مبرمج C و C++

[برمجة] أهم 3 أدوات يجب أن يتوفر عليها مبرمج C و C++

[برمجة] أهم 3 أدوات يجب أن يتوفر عليها مبرمج C و C++ السلام عليكم ورحمة الله وبركاته أهلا بكم من جديد في هذه التدوينة سأتكلم عن أهم ال...

[برمجة] أهم 3 أدوات يجب أن يتوفر عليها مبرمج C و C++

السلام عليكم ورحمة الله وبركاته أهلا بكم من جديد في هذه التدوينة سأتكلم عن أهم الأدوات أو البرامج التي يجب على كل مبرمج لغة C أو C++ والتي هي امتداد للسابقة أن يتوفر عليها هذه الأدوات مترابطة لدرجة أننا لا يمكننا إبعاد أي واحد من الأدوات . هذه الأدوات هي كالتالي :

1- محرر النصوص Text Editeur :

المحرر هو عبارة عن برنامج يستعمل لكتابة النص البرمجي ومن أشهر المحررات لدينا Notepad++ و Sublime Text 2

لتحميل Sublime Text 2 

http://www.sublimetext.com/2

2- المترجم Compiler :

المترجمات تقوم بترجمة الملفات المصدرية إلى لغة منخفضة المستوى , يمكن أن تترجم إلى لغة التجميع أو إلى لغة الألة بشكل مباشر , وتنشئ هذه الملفات بصيغة .Obj ومن أهم المترجمات لدينا مترجم visual ++ المقدم من مايكروسوفت ولكن للأسف ليس مجاني ويوجد على الويندوز فقط , ولكن هناك مترجمات أخرى ومجانية من بينها Dev-C++ ومتوفر للويندوز واللينكس ويمكن تحميله من الرابط التالي :

http://www.bloodshed.net/dev/devcpp.html

وهناك مترجم Pelles C IDE الرائع جدا أنا شخصيا أستعمله للتعلم ويمكن أيضا من تحرير ملفات DLL وغيرها يمكن تحميله من الرابط التالي :

http://www.smorgasbordet.com/pellesc/download.htm

3- المربط Linker :

يقوم المربط بجمع ملفات ذات صيغة .Obj ثم يعطينا الملفات التنفيدية بصيغة .exe أو ملفات مكتبات الربط الديناميكية التي تكون بسيغة .DLL والجيد في الأمر هو أن المترجمات الحديثة كلها تحتوي على المربط .

الصورة التالية تلخص كيف تترابط هذه الأدوات 

وطبعا بعض هذه الأدوات تستعمل في برمجة لغات أخرى

لا تنسو مشاركته مع أصدقائكم وتعليقاتكم تهمنا

مواضيع مشابهة :

● [بلوجر] أفضل واجهة احترافية لمدونة البلوجر 2014

● [بلوجر] أفضل إضافة تحت الهيدر للبلوجر 2014

(محرر النصوص , مترجمات لغة C و C++ , المربط , أدوات تعلم لغة C و C++ , Text Editor . )

[بلوجر] أضف الأكواد داخل إطار جميل في المشاركات 2014

[بلوجر] أضف الأكواد داخل إطار جميل في المشاركات 2014

[بلوجر] أضف الأكواد داخل إطار جميل في المشاركات 2014 السلام عليكم في درس جديد على مدونة برو أيوب في هذا الدرس أتيتكم بكود لإطار تستط...

[بلوجر] أضف الأكواد داخل إطار جميل في المشاركات 2014

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

بإمكانكم مشاهدة مثال من هذه التدوينة :

[بلوجر] إضافة روعة تحت الهيدر ( اشترك معنا - تابعنا ) 2014

الكود : 

<div dir="rtl" style="text-align: right;" trbidi="on">
<pre class="default prettyprint prettyprinted" dir="ltr" style="-webkit-transition: all 0.3s ease-in-out; background-color: #eeeeee; border: 0px; color: #686161; font-size: 11px; line-height: 25px; margin-bottom: 10px; max-height: 600px; overflow: auto; padding: 5px; text-align: left; transition: all 0.3s ease-in-out; vertical-align: baseline; width: auto; word-wrap: normal;">
</pre>
</div>

بعد إضافة الكود في HTML المشاركة تعود للتأليف وتكتب داخله ما تريد

إلى هنا إنتهى الدرس إلى اللقاء .

[مقالة] الخوارزميات أول شئ عليك معرفته قبل أن تصبح مبرمج

[مقالة] الخوارزميات أول شئ عليك معرفته قبل أن تصبح مبرمج

[مقالة] الخوارزميات أول شئ عليك معرفته قبل أن تصبح مبرمج السلام عليكم ورحمة الله أهلا بكم مرة أخرى , كما رأيتم في العنوان اليوم سنت...

[مقالة] الخوارزميات أول شئ عليك معرفته قبل أن تصبح مبرمج

السلام عليكم ورحمة الله أهلا بكم مرة أخرى , كما رأيتم في العنوان اليوم سنتكلم عن ' الخوارزميات ' كلمة تسمعونها كثيرا خاصة عندما نتحدث عن البرمجة لكن الكثيرون منا لا يعرفون معنى هذه الكلمة أو علاقتها بالبرمجة , حتى أكبر المبرمجين , لهذا بعد أن تعمقت في الكلمة وبحثت عن معنيها في عدة مواقع اجنبية وعربية واستوعبتها حان الوقت لأشارك ما تعلمته معكم :

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

سأقول لك إذهب وفتح الباب مثلا ,أنت إنسان ستعرف ذلك , لو أردت أن تجعل روبوت يفعل الأمر مكانك فأنت ستبرمجه على ذلك مثلا ستقول له : إذهب خمس خطوات إلى اليمين , ثم خطوة لليسار , ثم أمسك مقبض الباب وأدره خمس درجات لليسار وإدفع الباب بزاوية 40 درجة , هذا ما يسمى بالخوارزميات , أي أنني أعطي أوامر لو طبقت سأصل للشئ المطلوب وهذا ما تقوم عليه البرمجة فأنت عندما تكتب في css مثلا خلفية بيضاء وعرض 14 بيكسل .... فأنت تعطي لموقع الويب أمرا سيطبقه , وهكذا تعمل كل اللغات , مثال أخر : في php عندما تكتب دالة شرط ما مثلا ستقول إذا أدخل الرقم 3 في هذه الخانة إقبله وإذا أدخل رقم أخر إرفضه .

فالبرمجة هي مجموعة من الرموز تعبر عن شئ ما . وهذه الرموز تكون مشروع معين ( برنامج , موقع , تطبيق , نظام تشغيل ...) .

سأشرح لكم كيف يقوم الكمبيوتر باستقبال الاوامر التي نكتبها له بواسطة أي لغة برمجة وترجمتها

المرحلة الأولى :

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

المرحلة الثانية :

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

المرحلة الثالثة والأخيرة :

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

خصائص الخوارزميات :

1- تحديد النهاية :

أين أن المبرمج يجب أن يحدد نهاية لمشروعه , بمعنى أخر ما الذي أريد أن أصل إليه في النهاية .

2- عدم الغموض :

أي يجب أن يكون الكود الذي تكتبه واضح فبمجرد أن أراه أو يراه شخص أخر نعرف ما هو مكتوب .

3- الفعالية :

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

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

[برمجة] بعض الخصائص التي تضاف على الروابط في Html

[برمجة] بعض الخصائص التي تضاف على الروابط في Html

[برمجة] بعض الخصائص التي تضاف على الروابط في Html السلام عليكم إخواني هذا الدرس سيكون حول لغة البرمجة Html وبالضبط حول بعض الخصائص ا...

[برمجة] بعض الخصائص التي تضاف على الروابط في Html

السلام عليكم إخواني هذا الدرس سيكون حول لغة البرمجة Html وبالضبط حول بعض الخصائص التي تضاف على الروابط أو على في Html أي أننا لن نتحدث عن كيفية إضافة الستايلات للرابط ,طبعا هذه الخصائص رائعة ولها أهمية كبيرة لنبدأ على بركة الله :

خاصية Nofollow :

وهي خاصية تضاف إلى الروابط الخارجية التي لاتتعلق بموقعك كروابط التبادل الإعلاني أو رابط لملف تحميل أو موقع إجتماعي كفيسبوك من أجل إخبار محركات البحث بعدم تتبعها ويكتب كالأتي :

<a href="ضع هنا الرابط" rel="nofollow"></a>

خاصية Dofollow :

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

<a href="ضع هنا الرابط" rel="dofollow"></a>

خاصية _blank :

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

<a target="_blank" href="ضع هنا الرابط"></a>

هناك عدة خصائص أخرى لكن اخترت هذه الخصائص الثلاث لأنها الأهم

لا تبخلوا علينا بالردود المشجعة دمتم في أمان الله  

[برمجة] شرح بسيط لخاصيتي transition و animation في css3

[برمجة] شرح بسيط لخاصيتي transition و animation في css3

[برمجة] شرح بسيط لخاصيتي transition و animation في css3 السلام عليكم ورحمة الله تعالى وبركاته في هذا الدرس والخاص بلغة css3 سأشرح لك...

[برمجة] شرح بسيط لخاصيتي transition و animation في css3

السلام عليكم ورحمة الله تعالى وبركاته في هذا الدرس والخاص بلغة css3 سأشرح لكم خاصيتين transition و animation , طبعا لغة css3 لغة رائعة تضيف ميزة الحيوية والتنسيق والجمال لمواقعكم وهي لغة أساسية وخاصيتي transition و animation خاصيتين رائعتين حيث تمكنك من إضافة الحركية والحيوية لموقعكم سنبدأ على بركة الله :

شرح عنصر transition :

هذا العنصر لديه أربع خصائص :

transition-property و transition-duration و transition-timing-function و transition-delay

وهذا شرح لهذه الخصائص :

transition-property
لتحديد ماهية التأثير الذي سيطبق على العنصر مثلاً : width/height/left:10px/color ..etc


transition-duration
حساب مدة تنفيذ حركة العنصر


transition-timing-function : linear / ease / ease-in /ease-in-out / 
التأثير على العنصر في مدة تنفيذ حركتة


transition-delay
المدة التي تريد معها بدأ الحركة

هذا مثال توضيحي:

a {
   color: #000;
   transition-property: color;/*هنا إخترنا التأثير على اللون*/
   transition-duration: 0.7s;/*حساب مدة التنفيذ*/
   transition-delay: 0.3s;/*الفترة الزمنية التي يبدأ معها التأثير*/
   transition-timing-function: ease-in;/*طريقة التأثير*/
}

a:hover {
   color: #eee
}

شرح عنصر animation :

هي (القيم) التي تضعها على العنصر المراد تطبيق الحركة علية

هذه هي خصائصه :

animation-timing-function : linear/ease/ease-in/ease-out/ease-in-out


animation-timing-function : linear 
تطبيق سرعة واحدة على العنصر من في البدء والإنتهاء


animation-timing-function : ease
بداية بطيئة ثم سرعة ثم عودة للوضع البطئ 

 
animation-timing-function : ease-in 
بداية بطية لحركة العنصر


animation-timing-function : ease-out
نهاية بطيئة لحركة العنصر 


animation-timing-function : ease-in-out 
بداية بطيئة ونهاية بطيئة 


animation-iteration-count : value | infinite 
عدد مرات تكرار الحركة على العنصر 
infinite الى مالانهاية

animation-direction: alternate | normal ;
عندما ينتهي التأثير لايبدأ من جديد من إنما يعكس الإتجاة - دورة تبديلية عكسية

animation-delay: 1s;
المدة التي تريد معها بدأ الحركة

وهذا مثال توضيحي :

div {
   animation-name: move; /*تختار أسم معين لربطه بـ keyframes*/
   animation-duration: 1s; /*مدة تنفيذ الحركة*/
   animation-timing-function: ease-in-out; /*طريقة التنفيذ*/
   animation-delay: 0.5s; /*المدة التي تريد معها بدأ الحركة*/
   animation-iteration-count: 2; /*عددمرات التكرار */
   animation-direction: alternate; /*عندما ينتهي التأثير لايبدأ من جديد من إنما يعكس الإتجاة - دورة تبديلية عكسية */
   background-color: red;
   height: 350px;
   width: 350px;  

   -moz-animation-name: move; 
   -moz-animation-duration: 1s; 
   -moz-animation-timing-function: ease-in-out; 
   -moz-animation-delay: 0.5s;
   -moz-animation-iteration-count: 2;
   -moz-animation-direction: alternate;

   -webkit-animation-name: move;
   -webkit-animation-duration: 1s;
   -webkit-animation-timing-function: ease-in-out;
   -webkit-animation-delay: 0.5s; 
   -webkit-animation-iteration-count: 2;
   -webkit-animation-direction: alternate;
}
@keyframes move {
   from {
      transform: scaleX(0);
   }
   to {
      transform: scaleX(100px);
   }
}

@-moz-keyframes move {
   from {
      -moz-transform: scaleX(0);
   }
   to {
      -moz-transform: scaleX(100px);
   }
}

@-webkit-keyframes move {
   from {
      -webkit-transform: scaleX(0);
   }
   to {
      -webkit-transform: scaleX(100px);
   }
}
animation: move 1s ease-in-out 0.5s 2 alternate;

في هذا المثال طبقنا الحركة التالية على div معين
مدة التنفيذ 1 ثانية
طريقة التنفيذ : بداية بطيئة ونهاية بطيئة
نفذ الحركة بعد 5 أجزاء من الثانية
وكرر الحركة مرتين
واجعل الحركة عكسية

إلى هنا إنتهى الدرس نلتقي في درس جديد أي استفسار اتركوه في تعليق

[درس] أهم أكواد css ودور كل واحد منها

[درس] أهم أكواد css ودور كل واحد منها

[درس] أهم أكواد css ودور كل واحد منها  السلام عليكم ورحمة الله تعالى وبركاته في درس جديد وحصري على مدونتنا سنشرح فيه أهم أكواد css و...

[درس] أهم أكواد css ودور كل واحد منها 

السلام عليكم ورحمة الله تعالى وبركاته في درس جديد وحصري على مدونتنا سنشرح فيه أهم أكواد css ودور كل كود على حدى , طبعا لغة css من أهم اللغات التي تستعمل في تحسين شكل المواقع والمدونات وأكوادها عديدة , سأقدم لكم أهمها في هذه التدوينة ودورها نبدأ على بركة الله :

أكود css ودورها :

background : هذا الكود مسؤول عن الخلفية بحيث من خلاله تستطيع التعديل على ألوان الخلفية وحجمها والمزيد مثلا للتحكم في لون الخلفية تكتب background-color: #ffffff وهكذا تحصل على خلفية بيضاء ويمكنك تغيير اللون عن طريق تغيير الكود الخاص باللون .

width : من خلال هذا الكود تستطيع التحكم في عرض التصميم أو الإضافة بحيث تكتب width : 100px ويمكنك تغيير العرض بتغيير قيمة px .

height : من خلال هذا الكود تستطيع التحكم في طول التصميم أو الإضافة بحيث تكتب height : 100px ويمكنك تغيير الطول بتغيير قيمة px أيضا .

float : تسطيع من خلاله التحكم في مكان تواجد التصميم أو الإضافة بحيث إذا أردت أن بظهر التصميم في اليمين تكتب float :  وإذا أردت أن يظهر في اليسار تكتب float : left .

font : هذا الكود خاص بالكتابة بحيث من خلاله تستطيع التحكم في نوع الخط وحجمه  والمزيد بحيث تستطيع كتابة جميع خصائص الخط في سطر واحد مثلا font : 13px DroidKufi-Regular بحيث نكون قد كتبنا حجم ونوع الخط معا , أو يمكنك كتابة كل واحد على حدى بحيث نوع الخظ يكتب كالتالي : font-family : DroidKufi-Regular وحجم الخط يكتب كالتالي font-size : 13 px وهكذا تستطيع التحكم في باقي خصائص الخط .

color : تستطيع من خلاله التحكم في الألوان إما ألوان الكتابة وباقي المكونات ويكتب على الشكل التالي color : #ffffff . 

padding : تستطيع من خلال هذا الكود التحكم في أبعاد التصاميم ويمكن كتابته في سطر واحد بحيث تكون جميع الأبعاد (يمين - يسار - أعلى - أسفل ) في سطر واحد padding : 1px 0px 1px 2 px وهذا يسمى اختصارا أو تكتب كل واحد على حدى وذالك بالطريقة التالية للتحكم في الأبعاد العلوية تكتب padding-top : 1px للتحكم في الأبعاد في اليمين تكتب padding-right : 0px للتحكم في أبعاد اليسار تكتب padding-left : 1px للتحكم في ابعاد الأسفل تكتب padding-bottom : 2px طبعا تستطيع تغيير قيمة px بما يناسب .

margin : لديه تقريبا نفس خصائص padding لذلك لا داعي لإعادة الشرح ما طبق على padding نفسه سيطبق على margin .

border : تستطيع من خلاله عمل حدود للتصاميم بحيث تستطيع كتابته في سطر واحد border : 1px solid #fff أو كتابة كل واحد على حدى بحيث مثلا إذا اردت أن تضع حد في الأعلى فقط تكتب border-top : 1px solid #fff ويمكنك تغيير top حسب المكان الذي تريد أن يظهر فيه الحد كما تستطيع عمل حدود دائرية عن طريق كتابة border-radius : 1px solid #fff ويمكنك تغيير اللون وpx إلى ما يناسبك .

text : تستطيع أيضا من خلالها التحكم في خصائص الخط كمكان تواجد والمزيد فمثلا لتحدد مكان ظهور الكتابة داخل الإضافة تكتب text-align : left وتغيير left حسب مكان الذي تريد وأيضا يمكنك تغيير align حسب الخاصية التي تريد إضافتها للكتابة.

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

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