There are two types of Chrome extensions.
1) Browser Extension - Available at all times, with its icon displayed in the toolbar.
2) Page Extension - Applies to one or more pages. The icon is displayed in the address bar. Performs operations on the content of the page.
General Development Steps
1. Create an empty directory
2. Add the following files to the empty directory.
3. Html files
popup.html - file that is displayed when the extension icon is clicked, page title becomes the tooltip text for the extension icon
options.html (optional) - file for setting options for the extension
19x19 icon for the toolbar icon for the extension
Can have one or the other.
Simply copy thirdparty libraries to the folder and reference in HTML file. Make reference to these files in the head tag of html using the script tag.
Style files referenced from HTML pages.
For example, use popup.css in HTML page using the link tag.
Images referenced in HTML pages.
8. Content scripts
Cannot use chrome extensions API directly.
Must use messaging to communicate with chrome extension code.
9. Testing extension
In Google settings, go to Extensions tab.
Enable developer mode.
Load unpacked extension from the directory
Can do "Inspect Element" on the extension to debug.