س و ج - ماذا يمكننى ان أفعل بالجافاسكريبت

السلام عليكم و رحمه الله تعالى و بركاته

<script type=”text/javascript” >

سأجيب على هذا السؤال فى صوره 1،2 و لن أدخل فى تفاصيل كل نقطه … من يريد الإستفسار عن نقطه معينه فليترك تعليقا ، يمكنك إستخدام جافاسكريبت فى الاتى :

1- برمجه برامج تعمل على السطح المكتب desktop applications عن طريقه تقنيه ADOBE AIR حيث يمكنك برمجه قواعد البيانات و التفاعل مع الملفات و الشبكه الداخليه و شكبه الانترنت و النوافذ و القوائم و ال socket بدون تعلم لغات سطح المكتب المعقده مثل c و ال C++ و ال java و غيرها   … التقنيه لا زالت جديده يمكنك ان تكون من افضل المطورين فى العالم معى إن شاء الله

2- برمجه المتصفح و هذا هو الإستعمال الاكثر شيوعا و يطلق عليه client-side programming و الشخص الذى يتخصص فيه يطلق عليه front-end engineer لايوجد حدود لما يمكن ان تفعله على المتصفح إلا خيالك ، فاليوم يمكنك ان ترى ماسنجر على الويب على موقع meebo و العالم كله بأدق تفاصيله على google maps

3- برمجه windows vista side bar الشريط الجانبى بنظام تشغيل فيستا حيث يوفر لك من خلال الجافاسكريبت API تمكنك من التفاعل مع النظام و عمل أى شىء تريده

4- برمجه google docks و yahoo docks اللذان يأتيان مع google desktop و yahoo side bar بالترتيب و طريقه عملهما نفس طريقه عمل Vista side bar

5- برمجه ال widgets التى تعمل على igoogle و my yahoo و المواقع التى تعتمد فكره عملها على الصفحات الشخصيه

6- برمجه ال mashups مثل google maps و google calender و google open social و غيره الكثير جدا و خلطه مع الخدمه التى يقدمها موقعك فتخيل معى موقعك عباره عن دليل للفنادق و عن طريق google maps تستطيع توضيح مكان الفندق و موقعه بالنسبه للبحر و خلافه … ملحوظه : حاليا ال mashup يعتبر من اكبر الخصائص التى يتمتع بيها الموقع الناجح … نسيت ان أذكر ان youtube قد أطلقت مؤخرا youtube API الذى يمكنك من تحميل فيديوهات إلى يوتيوب من موقعك و التعليق و التحكم الكامل من خلال api جافاسكريبت من موقعك ، لأن youtube تريد ان تستضيف فيديوهات الارض كلها

7- برمجه برامج تعمل على موقع ال facebook و ذلك من خلال العمل على منصه f8 التى أنتجتها facebook حيث تمكنك من إستخلاص بيانات الاعضاء و المشاركات و عمل قواعد بيانات و غيره على الموقع من خلال api خصيصا لذلك

8- برمجه صفحات تعمل على السيرفر server-side pages من خلال تقنيه jaxer التى أطلقتها شركه aptana.com حيث تمكنك من التفاعل مع الملفات و قواعد البيانات و النصوص و كل ما تحتويه بيئه السيرفر و ذلك من خلال api جافاسكريبت و بذلك يكون ال client ( المتصفح ) و السيرفر يتم برمجته بلغه واحده و ذلك يطلق عليه unified model

9- يمكنك مصتفح firefox من بناء extentions و التعديل على واجهه المستخدم من خلال تفاعل جافاسكريبت مع لغه XUL ، و يمكنك أيضا firefox من خلال extentions إسمه greasemonkey من التعديل على أى موقع تريد من خلال الجافاسكريبت فهناك الاف السكريبتات على موقع userscripts.org بعضها يقوم بإلغاء الاعلانات فى كل موقع تزوره و البعض الاخر يضيف خصائص غير موجوده على gmail او google reader و بعضها الاخر يضيف خصائص غير موجوده فى موقع ebay و الكثير و الكثير … و يمكنك انت من برمجه سكريبت يسهل عليك التعامل مع اى موقع مفضل لديك …

10 - يمكن من خلال الجافاسكريبت التفاعل مع java applets و flash

11 - يمكنك عمل performance suits لمعاينه كفاء تطبيقات الويب التى تقوم ببنائها من خلال AJAX و ال requestHeaders

12- يمكنك عمل تطبيقات ويب WEB application تعمل offline بدون إتصال بالأنترنت عن طريق تقنيهGoogle Gears التى توفر API جافاسكريبت تقوم بالمهمه

13- يمكنك عمل تطبيقات تفاعليه عن طريق تقنيه silver light التى أطلقتها مايكروسوفت مؤخرا و توفر لك api للتفاعل مع التقنيه داخل المتصفح و فى بيئات مختلفه عن طريق الجافاسكربت

تحديث :

14- يمكنك عمل digital art بمعنى الرسم بواسطه الكود عن طريق processing.js التى كتبها العبقرى john resig ، أو إستخدام algorithmic Ink التى برمجها Aza raskin

فى هذه القائمه ذكرت أبرز الإستخدامات فإذا كان لديك إستخدام لم إذكره سهوا فقم بالتعليق

فيديوهات Yahoo! YUI theater لمبرمجى الجافاسكريبت

السلام عليكم و رحمه الله تعالى و بركاته

قد كتبت فى موضوع سابق عن فيديو : جافاسكريبت لغه البرمجه … و هى حلقه ألقاها douglas crockford الذى يشغل منصب yahoo javascript architect و هى حلقه من ضمن حلقات دوريه يلقيها المهندسين front end engineers بداخل الياهو … لتبادل الخبرات مع مجتمع مبرمجين الويب ، و تتناول الحلقات مكتبه واجه مستخدم ياهو YUI و ال usability و ال accebility و ال user experience و ال rich internet applications و ال AJAX و غيره ، فإذا كنت مهتم بالجافاسكريت فلابد ان تضع الموقع فى مفضلتك

http://developer.yahoo.com/yui/theater/

و تضعه أيضا فى قارىء ال RSS الخاص بك … و هذا هو رابط ال RSS

http://feeds.feedburner.com/yuiblog/yui-theater

س و ج - متى تستخدم id و متى class

السلام عليكم و رحمه الله تعالى و بركاته

إستخدم id مع العناصر التى لا تتكر فى الصفحه مثل ال body او العناصر التى يتم إستخدامها بغرض معين مره واحده فقط فى الصفحه مثل div الذى يكون بمثابه navigator او ال footer او ال header

إستخدم class مع العناصر التى تتكرر فى الصفحه حتى يتم التحكم بها من خلال css او JS كوحده واحده

إستخدم class و id مع العنصر الذى لايتكرر و إنما يختلف التعامل مع من صفحه لأخرى مثل ال div الذى يحتوى خيارت المستخدم فى صفحه و خيارات المدير admin فى الصفحه الاخرى

كيف تمكنت من حفظ ملايين ال functions و ال api المختلفه ؟

السلام عليكم و رحمه الله تعالى و بركاته

بفضل الله تعالى قد تمكنت فى فتره لا بأس بها من حفظ functions ال javascript و ال API بمكاتب جافاسكريبت المختلفه و العديد من ال API التى توفرها google و جميع وظائف ال php manual و  غيرها  … و هذه هى طريقتى :

1- إختار مرجع مناسب على سبيل المثال : javascript the defenitive reference الكتاب عدد صفحاته اكثر من 1200 صفحه

2- قمت بتسجيل ال reference الذى باخر الكتاب و الذى يحتوى على كل object فى اللغه و كل ال functions و ال properties التى بداخلها ووظائفها بصوتى

3- أسمع تلك الصوتيات يوميا قبل نومى ( اخر مايسمع او يقرأ له أولويه فى الذاكره ) او خلال سفرى ( أسافر شبه يوميا ) او أثناء تصفحى الانترنت

النتيجه تمكنت من حفظ اللغه عن ظهر قلب و أقوم دوريا بتسجيل أى شىء جديد بعد قرائتى له جيدا و هضمه و تجربته

نصيحه أخيره if you never try you never know يعنى لو لم تجرب فإنت لن تتعلم …

فيديو محاضره جافاسكربت لغه البرمجه 4 اجزاء + الشرائح من ياهو

السلام عليكم و رحمه الله تعالى و بركاته

اليوم أقدم لكم مجموعه محاضرات القاها douglas crockford الذى يشغل منصب YahOO! javascript architect بعنوان javascript the programming language و المحاضرات تتناول نظره شديده التعمق على اللغه و التركيب اللغوى syntax لها و مايميزها عن غيرها و الكائنات … المحاضره بغايه الروعه أنصحك ان تستمع إليها بشده

الفيديو الجزء الأول

الفيديو الجزء الثانى

الفيديو الجزء الثالث

الفيديو الجزء الرابع

الشرائح

APTANA ينطق بالإلوان ليعبر عن شخصيتك

السلام عليكم و رحمه الله تعالى و بركاته

قد كتبت فى السابق عن المحرر  الرائع APTANA و أدرجت معظم خصائصه التى يتميز بها عن المحررات الأخرى و لكنى لم أذكر انك تستطيع التعديل على ال code editor كما يتضح لك فى الصوره المرفقه و التى توضح وثيقه html باللون البنفسجى بها عنصر style جعلتها باللون الأخضر و عنصر ال script قد جعلته باللون البرتقالى … بعكس الخيارات الإفتراضيه و تستطيع انت إضافه الالوان التى تستريح لها عينك لكل لغه او عنصر … قم بالإستماع إلى حلقات المحرر APTANA المجانيه من هنا www.aptana.tv

إضغط على الصور لرؤيتها بالحجم الكبير

أغرب خطأ برمجى فى الجافاسكربت

أكتشف john resig مطور مكتبه jQuery إثناء بحثه فى كيفيه عمل ال timer فى جافاسكريبت خطأ غريب و غير عادى فى الانترنت إكسبلورر فى طريقه تناولها لهذا الكائن … و يتلخص هذا التصرف الغريب فى الكود التالى

setTimeout( function(){ alert(”keepondev”) } , -1) ;

لابد أنك لاحظت انه قد أعطى لل timer القيمه -1 و هى الفتره الزمنيه بالميللى ثانيه بعدها يتم تنفيذ الكود … و كانت المفاجئه عند تجربه الكود فى انترنت اكسبلورر … أنه لم يتم تنفيذ الكود و إنما تم تسجيل الكود تحت حدث onclick اى ان الكود السابق مساوى تماما لهذا الكود فى إنترنت إكسبلورر فقط

document.onclick = function(){
alert(”keeponedv”);
}

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

كيبونديف مدونه متخصصه فى الجافاسكريبت

السلام عليكم و رحمه الله تعالى و بركاته

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

1. javascript frameworks
2. ADOBE integrated runtime | AIR
3. تغطيه جميع الاحداث المتعلقه بالجافاسكربت كالمؤتمرات مثل : Ajax experience و غيرها
4. متابعه التغيرات فى مكاتب الجافاسكربت و التقرير عنها
5. كتب مجانيه اكتبها بنفسى و بالتعاون مع أفضل المبرمجين العرب مهاره فى الجافاسكربت
6. متابعه اخر تقنيات ال cross site scripting | XSS و كيفيه استغلالها و حلها
7. شرح الاكواد الداخليه فى أكثر مكاتب جافاسكريبت تعقيدا
8. الإشاره إلى الفروق البرمجيه بين المتصفحات و كيفيه تناولها

قم بإضافتى إلى ال rss reader أو إستمع لدرس شرح google reader من أجل تجربه فائقه المتعه

فيديو شرح خدمه StumbleUpon تصفح الإنترنت كما يتصفحه المحترفون

بسم الله الرحمن الرحيم

فى الحلقه الخامسه من حلقات keepondev التعليميه المجانيه أقدم لكم شرح خدمه StumbleUpon و التى تعتمد على التصفح الجماعى للمستخدمين المهتمين بنفس التخصص بناء على ترشيحهم لمواقع و مقالات و صفح هامه فى هذا المجال … و فى نفس الوقت حفظ المواقع و الروابط الهامه فى صفحه favourites شبيه بخدمه del.icio.us … و بمنتهى البساطه طريقه الإستفاده من خدمه stumbleupon تتلخص فى النقاط الاتيه :

1- التسجيل فى الموقع و تحديد الاهتمامات

2- الموقع يرشحلك مواقع لزيارتها داخل المتصفح بالضغط على زر stumble

3- حفظ المواقع المفضله فى صفحه ال favourites الخاصه بك و ترشيح مواقع للأعضاء الاخرين الذين يشاركوك نفس الاهتمامات

ملحوظه :  العضويه التى أستخدمها فى شرح الخدمه ليست عضويتى الحقيقيه و إنما للتوضيح فقط

فيديو شرح خدمه del.icio.us

بسم الله الرحمن الرحيم

كم مره عانيت من ضياع روابط لمواقع تحتوى على مواد علميه او ذات اهميه لك ؟ هل سأمت من حفظ المواقع المفضله فى notepad و فى مفضله المتصفح لأنها طريقه غيرفعاله ؟ هل تعلم ماهى شعبيه و اهميه الرابط التى تخزنه و كم عدد الذين يهتمون بحفظ هذه الصفحه او المقال ؟ هل تريد معرفه الروابط الذى يحفظها نفس المهتمين بما تهتم به انت ؟

إليك خدمه Social bookmarking الذى يقدمها موقع del.icio.us التابع لموقع Yahoo! وظيفته الاولى هى حفظ المواقع و روابط الاعضاء بطريقه مثلى عن طريق ال TAGs و عمل روابط بين الاعضاء الذين يهتمون بنفس المجال ووضع اقتراحات لهم مما يؤدى الى كفاءه الخدمه و خبره المستخدم user experience و هو الموقع رقم واحد عالميا فى مجال ال bookmarking و عن طريق الادوات الذى يعرضها عليك delicious اثناء التصفح من اى متصفح ستجد متعه شديده فى التصفح و حفظ روابطك الهامد بدون عناء و مشقه .

ملحوظه : العضويه التى أستخدمها فى شرح del.icio.us ليست عضويتى الحقيقيه و إنما استخدمها فقط للشرح و التوضيح … عضويتى الحقيقيه ممتلئه بالاف الروابط و العلاقات مع الاشخاص

  

ملحوظه : جميع الملفات مضغوطه بصيغه .zip فإذا وجدت الملف بعد التحميل غير ذلك قم بتغيير إسمه الى .zip مثال : file.html الى file.zip

Aptana IDE المحرر المثالى لمطورين الويب

 

السلام عليكم و رحمه الله تعالى و بركاته

فى الحلقه الثالثه من حلقات keepondev التعليميه المجانيه أقدم لكم بإذن الله تعالى APTANA IDE و هو محرر مجانى أكثر من رائع و يحتوى على مميزات عديده تضع اكبر المحررات مثل dreamweaver و FrontPage فى موضع حرج حيث يحتوى على المميزات الاتيه :
1- مجانى 100% مفتوح المصدر يمكنك المشاركه فيه سواء بالكود او بالإقتراحات التى يتم التصويت عليها و تفعيلها فى فتره قصيره جدا اذا ماتم الموافقه عليها من قبل الجمهور
2- دعم كامل ل Xhtml / CSS / Javascript / Jquery / Prototype / Scriptaculous / YUI / DoJo / Mochikit / Aflax / Ext / Adobe Air / Jaxer / PHP / Ruby on Rails / XML / iphone
3- مساعدتك فى كتابك الكود و توضيح توافق الكود على سبيل المثال عند كتابتك كود php يدلك هل هذه وظيفه موجود فى php5 ام لا … مثال اخر عند كتابه كود javascript يدلك ماإذا كانت الوظيفه او الخاصيه موجوده فى أشهر أربع متصفحات firefox , IE , Netscape , Opera ام لا مع توضيح اصدار كل متصفح
4- إمكانيه عرض صفحات HTML داخل البرنامج على جميع المتصفحات المتوافره على جهازك
5- متابعه ال structure الخاص بالكود الذى تكتبه من خلال Tree structure
6- إيضاح الأخصاء التى تصدر منك أثناء كتابتك الكود بدون تشغيله … و خاصيه اخرى توضح الاخطاء التى تصدر أثناء تشغيل الكود داخل البرنامج
7- التفاعل مع Firefox Console داخل البرنامج و إيضاح الرسائل الذى يولدها اثناء ترجمه البرنامج
8- مساعده متغيره dynamic help و هى عباره عن ظهور نبذه و أمثله عن كل وظيفه او خاصيه او عنصر بمجرد كتابته فى الكود
9- التعديل البعيد remote editing و التى تمكنك من تعديل أى ملف من على السيرفر من خلال البرنامج دون الحاجه الى برنامج FTP خاص ، فقط صلاحيه الدخول
10 - إكتشاف الأخطاء فى الكود Debugging عن طريق اضافه breaking point و متابعه المتغيرات و عمل الوظائف
11 -  كتابه مواقع خاصه ب iphone و عرضها على شكل مماثل لل iphone إن لم يكن لديك iphone و يمكنك عمل server خاص يمكنك متابعه البرنامج إذا كان لديك iphone
12 - كتابه اكواد Adobe Air التى تمكنك من برمجه Desktop apps بإستخدام تقنيات  AJAX و FLASH و عرضها و تجربتها بدون الحاجه لعمل install للبرنامج الذى تنشأه
13- كتابه برامج Server-Side بإستخدام تقنيه Jaxer من خلال تقنيات AJAX و عرضها داخل البرنامج بإستخدام Jaxer server
14- عمل مهام Tasks و ترتيبها حسب الاهميه لكل برنامج و عمل Bookmarks خاصه لكل برنامج و يمكنك إدراج bookmarks بجوار كل سطر كود تكتبه كبديل عن ال Comments

لتحميل البرنامج www.aptana.com
محاضرات فيديو خاصه بالبرنامج تغنى عن شرحى www.aptana.tv

اذا كان لديك أى اقتراح قم بالتفاعل مع المستخدمين على المنتدى الخاص بالمحرر و سيتم تفعيل إقتراحاتك
الصوره المرفقه مع المقال توضح بعض الخصائص التى قمت بالإشاره إليها

فيديو شرح خدمه Google reader

بسم الله الرحمن الرحيم  

فى الحلقه التانيه من حلقات keepondev التعليميه المجانيه شرح خدمه google reader التى تستطيع من خلالها متابعه مواقعك المفضله بدون اعلانات و بسرعه كبيره جدا ( فقط المحتوى المطلوب ) و بطريق تراكميه … لن تضيع منك مقالات هامه او صفحات ذات قيمه بعد اليوم … اتركك مع محاضره الفيديو رابط التحميل أسفل صوره الدرس و بإنتظار تعليقاتكم و مقترحاتكم

ملحوظه : العضويه التى أستخدمها فى شرح google reader ليست عضويتى الحقيقيه ،  عضويتى الحقيقيه مكتظه بالإشتراكات و المدونات

ملحوظه : المحاضره مضغوطه بصيغه .zip فإن وجدتها بعد التحميل بصيغه تانيه فلابد من تغيير الإسم إلى lecture.zip حتى تتمكن من سماع المحاضره

فيديو شرح IE developer toolbar

 السلام عليكم و رحمه الله تعالى و بركاته

فى الحلقه الاولى من حلقات keepondev التعليميه سأشرح لكم بإذن الله تعالى كيفيه إستخدام IE Developer toolbar فى اختبار الموقع فى بيئه المتصفح و الذى يمكنك من تغيير خصائص عناصر الصفحه و رؤيه DOM tree و اختيار العناصر و البحث عنها و رؤيه تقارير عن مساحه و مسارات الملفات و العديد من الخصائص الاخرى لتحميل IE developer toolbar اضغط هنا

ملحوظه : المحاضره مضغوطه بصيغه .zip فإن وجدت المحاضره بعد التحميل بصيغه اخرى فقم بتغييرها الى lecture.zip حتى تتمكن من سماع المحاضره

انقذ وقتك و زيد من قدرتك الانتاجيه مع Rescue Time

السلام عليكم و رحمه الله تعالى و بركاته

اليوم اقدم لكم هذا الموقع الممتاز rescue time و الذى يقدم خدمه فريده من نوعها تتلخص فى التالى :

1- تسجيل الاوقات التى تقضيها على الكمبيوتر و كل برنامج او موقع

2- مقارنه بين الاوقات التى تقضيها فى الايام المختلفه

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

4- حفظ المواقع التى قمت بزيارتها و ترتيبها بنظام ال tags

5- وضع اهداف و تنبيهات

كل ماعليك فعله هو الاتى :

1- التسجيل فى الموقع الموضح اعلاه

2- تحميل البرنامج الخاص بالخدمه و ادخال بيانات الدخول حتى يتابع نشاطاتك

3- دخولك على صفحه التقارير الخاصه بالموقع لمعرفه النتائج

4- وضع الاهداف من خلال صفحه goals و عندما تقوم بتنفيذ هدف معين قم بتوضيح انك حققته و سيسجل البرنامج ذلك و يقارن بين الانتاجيه فى المهام المختلفه

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