SlideShare a Scribd company logo

Chrome extensions

•
•
Ahmad Tahhan
Ahmad Tahhan

Chrome extensions allow users to modify and customize their browser behavior through additional programs that can be installed from the Chrome Web Store. Extensions are built with web technologies like HTML, CSS, and JavaScript and have access to the Chrome API which allows them to interact with browser features and windows. The document provides examples of common extensions and outlines the basic skills and resources needed to develop browser extensions for Chrome.

1 of 19
Download to read offline
Chrome Extensions Ahmad Tahhan
Who are you to stand in front of us ?
Do you have a problem with your dad? Flight Status
What is Chrome anyway? Extensions
What i can do with extensions ? ● Change browser behaviour ● Easy to install from the gallery ● Auto-updates ● Trivial publishing and updating ● Many others ...
It is a math Extension = webpage + UI modification + chrome API + packaging
Give me an example ● Currency Converter ● Google Mail Checker ● Page Monitor ● Dictionary Lookup ● Inline Search & Lookup
So what i need to start ? ● JSON : json.org ● HTML ● CSS ● Javascript ● text editor ● no special tool nor special software
Meet your new friends ● chrome.google.com/webstore ● developer.chrome.com/extensions ● And your best friend is : chrome: //chrome/extensions/ ● developer tools ● task manager
A familiar page with unfamiliar face Developer mode ● Load unpacked extension... ● Pack extension... ● Update extensions now
before we go any farther what exactly i can do ? ● Browser UI : ○ Browser Action & Badge ○ Page Action ○ Content Scripts ○ Override Pages eHistory ○ Themes ● Chrome API ○ Controlling browser/page actions and badges ○ Internationalization ○ Manipulating windows and tabs ○ Intra-extension Communication ○ Manipulating Bookmarks
Interesting stuff ● Webkit API / HTML5 Support : ○ localStorage ○ Web SQL Database ○ <audio> and <video> ○ CSS Animation ○ Web fonts ○ Desktop notifications ○ <canvas>
Manifest File what is that ?
Event Pages also that ?
Options Page what else? localStorage Web SQL Database
Show me how whereami eHistory Page Monitor Dictionary Lookup Inline Search & Lookup
What Next ? do it yourself and show the world
Advice Google : RTFM and do what it says :)
contact me Facebook : tahhan Twitter : tahhan Website : tahhan.me Email : ahmadt89@gmail.com

More Related Content

Chrome extensions

  • 1. Chrome Extensions Ahmad Tahhan
  • 2. Who are you to stand in front of us ?
  • 3. Do you have a problem with your dad? Flight Status
  • 4. What is Chrome anyway? Extensions
  • 5. What i can do with extensions ? ● Change browser behaviour ● Easy to install from the gallery ● Auto-updates ● Trivial publishing and updating ● Many others ...
  • 6. It is a math Extension = webpage + UI modification + chrome API + packaging
  • 7. Give me an example ● Currency Converter ● Google Mail Checker ● Page Monitor ● Dictionary Lookup ● Inline Search & Lookup
  • 8. So what i need to start ? ● JSON : json.org ● HTML ● CSS ● Javascript ● text editor ● no special tool nor special software
  • 9. Meet your new friends ● chrome.google.com/webstore ● developer.chrome.com/extensions ● And your best friend is : chrome: //chrome/extensions/ ● developer tools ● task manager
  • 10. A familiar page with unfamiliar face Developer mode ● Load unpacked extension... ● Pack extension... ● Update extensions now
  • 11. before we go any farther what exactly i can do ? ● Browser UI : ○ Browser Action & Badge ○ Page Action ○ Content Scripts ○ Override Pages eHistory ○ Themes ● Chrome API ○ Controlling browser/page actions and badges ○ Internationalization ○ Manipulating windows and tabs ○ Intra-extension Communication ○ Manipulating Bookmarks
  • 12. Interesting stuff ● Webkit API / HTML5 Support : ○ localStorage ○ Web SQL Database ○ <audio> and <video> ○ CSS Animation ○ Web fonts ○ Desktop notifications ○ <canvas>
  • 13. Manifest File what is that ?
  • 14. Event Pages also that ?
  • 15. Options Page what else? localStorage Web SQL Database
  • 16. Show me how whereami eHistory Page Monitor Dictionary Lookup Inline Search & Lookup
  • 17. What Next ? do it yourself and show the world
  • 18. Advice Google : RTFM and do what it says :)
  • 19. contact me Facebook : tahhan Twitter : tahhan Website : tahhan.me Email : [email protected]