Chrome ext-dev

1,217
-1

Published on

Published in: Technology, News & Politics
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,217
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
27
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Chrome ext-dev

  1. 1. إضافات المتصفح غوغل كروم هواة التقنية المغاربة يوليوز 2010 شريحة من إنجاز محمد البردعي و هي مرخصة تحت رخصة العموميات الخلاقة Creative Commons By-SA-3.0 علامة غوغل كروم علامة تجارية مسجلة من طرف غوغل Google
  2. 2. و كأن العالم ينقصه متصفح جديد بأسلوبه المختلف لتطوير الإضافات !! لماذ؟
  3. 3. لنتذكر التقنيات المتاحة حاليا <ul><li>أنترنت إكسبلورر : كائنات أكتيف إكس (ActiveX) </li></ul><ul><li>فايرفوكس : إضافات مصممة باستخدام خليط من اللغات و الأدوات XUL, JavaScript, HTML,CSS, Bash Scripts </li></ul><ul><li>أوبرا : قطع (Widgets) </li></ul>
  4. 4. لكن فعلا لم الإهتمام؟ لأن تطوير و تصميم إضافات كروم : بسيط، سهل و ممتع . { أو كما هو الحال مع كل منتج جديد، أليس كذلك ! ؟ }
  5. 5. البساطة <ul><li>بنية الإضافة بسيطة ( ملفين فقط كافيين background.html و manifest.json) </li></ul><ul><li>تجميع الإضافة بسيط ( بصيغة ملف zip أو crx) </li></ul><ul><li>لا تشغل بالك بالمخاطر الأمنية . غوغل تتكفل بذلك عنك </li></ul><ul><li>فور رفع التحديث يتوصل به المستخدمون بكل تلقائية . لا حاجة إلى إعادة تشغيل المتصفح </li></ul>
  6. 6. بنية ملف الإضافة (crx) و خاصية التحديث التلقائي المفتح العمومي الإمضاء محتوى الإضافة مضغوط بصيغة zip (manifest.json, background.html, content_script.js,..) مكون من المفتح الخصوصي و المحتوى المضغوط
  7. 7. السهولة <ul><li>لا حاجة لتعلم أية لغة أو أداة جديدة </li></ul><ul><li>تطوير الإضافات و اختبار التحديثات سهل و سريع </li></ul><ul><li>خدمة إضافات كروم بلا تعقيدات </li></ul><ul><li>واجهة برمجة التطبيقات (APIs) مقسمة إلى 8 وحدات و تضم 55~ دالة / مهمة (method) </li></ul><ul><li>التوثيق جيد http://code.google.com/chrome/extensions/docs.html </li></ul>
  8. 8. واجهة برمجة التطبيقات (APIs) <ul><li>الكائن الأساسي : </li></ul><ul><li>chrome.* </li></ul><ul><li>و يضم : </li></ul><ul><li>bookmarks.* </li></ul><ul><li>browserAction.* </li></ul><ul><li>extension.* </li></ul><ul><li>history.* </li></ul><ul><li>i18n.* </li></ul><ul><li>pageAction.* </li></ul><ul><li>tabs.* </li></ul><ul><li>windows.* </li></ul>
  9. 9. مثال عملي عن إضافة إقرأ الآن لخدمة المرقاب – الإصدار الأول صيغة الملف background.html صيغة الملف manifest.json
  10. 10. مثال عملي عن إضافة إقرأ الآن لخدمة المرقاب – الإصدار الثاني صيغة الملف background.html صيغة الملف manifest.json الملف messages.json المتواجدا داخل مجلد الإضافة /_locales/ar
  11. 11. مثال عملي عن إضافة إقرأ الآن لخدمة المرقاب – الإصدار الثاني صيغة الملف popup.html
  12. 12. أدوات المطور مدمجة مع المتصفح لتصحيح و تتبع عمل الإضافات و الصفحات
  13. 13. المتعة <ul><li>متعة خوض تجربة جديدة </li></ul><ul><li>الإستفادة من APIs للخدمات الإجتماعية </li></ul><ul><li>تصميم ألعاب بسيط للتسلية و اكتساب مهارات جديدة باستخدام DOM و JavaScript </li></ul><ul><li>استغلال سرعة معالج JavaScript و معالج WebGL لتجربة و اختبار تصوراتك لواجهة أو تجربة ثلاثية الأبعاد . </li></ul><ul><li>الإستفادة من دعم المتصفح لـ HTML5 لتصميم إضافات الغد اليوم . </li></ul>
  14. 14. Last.fm music player Chromed Bird / Twitter إضافات كروم لخدمات الويب الإجتماعية باستخدام APIs هذه الأخيرة
  15. 15. JC-Tetris Snake Avalanche https://chrome.google.com/extensions/featured/fun ألعاب بسيطة
  16. 16. مثال يستخدم معيار WebGL حساب و تشكيل صورة لكوكب الأرض مكونة باستخدام الألاف من كور صغيرة لكوكب الأرض . النمودج تفاعلي و يتم عرضه بشكل آني باستخدام معالج بطاقة العرض الشاشة .
  17. 17. التفاعل مع الجزيئات بشكل آني و ثلاثي الأبعاد أيضا
  18. 18. مثال آخر لمعيار WebGL معرض صور يتيح مشاركة الصور بشكل آني و يتم تجول داخله بشكل ثلاثي الأبعاد .
  19. 19. الواجهة الرسومية و تفاعل المستخدم <ul><li>لا يُسمح للإضافات بتغيير شكل المتصفح، القوائم أو الألسنة و ذلك لتحفيز المطور على التركيز فقط على التفاعل مع المحتوى و خدمات الويب . </li></ul><ul><li>لا يُسمح إلا بأيقونة واحدة إما على الشريط المهام أو داخل شريط العناوين </li></ul><ul><li>بينما يتاح التفاعل مع المحتوى داخل الصفحة بالإستخدام مكتبات AJAX مثلا أو عرض محتوى إضافي داخل فقاعة </li></ul>
  20. 20. مثال لإضافة Slideshow لعرض الصور المكتشفة على الخدمات مثل flickr, picasa, facebook... على شكل شرائح داخل الصفحة .
  21. 21. إضافات كروم بالأرقام فور انطلاق مشروع اضافات كروم في 12-2009 تم بعدها تطوير ما يقارب 5.000 إضافة في 6 أشهر و دعم تلقائي لما يقارب 40.000 سكريبت جريس منكي (Greasemonkey scripts) المتواجدة على http://www.userscripts.org
  22. 22. ما تحمله الأيام 1/2 نظام Chrome OS للأجهزة اللوحية و الدفترية ما هو إلا نظام لينوكس بمتصفح كروم سيوفر مجموعة من البرامج الساحبية التي ستعمل إما من داخل المتصفح أو على شكل إضافات الصورة من http://en.wikipedia.org/wiki/Google_Chrome_OS
  23. 23. ما تحمله الأيام 2/2 سوق تطبيقات كروم https://chrome.google.com/webstore سيتح فرصة الحصول على عائد مادي من خلال إمكانية بيع التطبيقات الساحبية أو الإشتراك في خدماتها متقدمة من خلال الإضافات . الصورة من http://code.google.com/chrome/apps/
  24. 24. روابط مفيدة الموقع الأساسي ( توثيق، أمثلة، دليل تعليمي ...)‏ http://code.google.com/chrome/extensions/ مستودع الإضافات ( للبحث عن رفع أو تحميل الإضافات )‏ https://chrome.google.com/extensions لتحميل آخر اصدار تطويري للمتصفح كروم http://build.chromium.org/buildbot/continuous سلسلة Google Chrome Extensions على YouTube http://goo.gl/QLMU موقع متخصص بشؤون المتصفح كروم http://google-chrome-browser.com/ أيضا، مدونة تعليمية متخصصة في تقنية و معيار WebGL http://learningwebgl.com

×