Google Chrome Extension (nonfiction)

From Gnomon Chronicles
Jump to navigation Jump to search

A Google Chrome Extension is a browser extension that modifies Google Chrome.

Chrome Extensions are written using HTML, JavaScript, and CSS: basically a web page that is hosted within Chrome and can access some additional APIs.

Developing Chrome Extensions

Getting started

A Chrome extension comprises HTML, CSS, and JavaScript. The extension JavaScript APIs which Chrome exposes.

The first thing we need to do is create the project and all the files we need for our extension. Let’s start by creating a new directory that we’ll call “GTmetrix Extension.” We’ll put all the files we need for our extension in this new folder. Chrome allows us to load up a plugin by pointing it at a folder that contains the extension files.

All Chrome extensions require a manifest file. The Manifest file tells Chrome everything it needs to know to properly load up the extension in Chrome. So we’ll create a manifest.json file and put it into the folder we created. You can leave the manifest file blank for now.

Next we’ll need an icon for our extension. This just needs to be a 19x19px PNG file. You can get a sample icon from Google’s demo project that you can modify.

Next we’ll need an HTML page to show when a user clicks our Browser Action, so we’ll create a popup.html file and a popup.js file in our “GTmetrix Extension” directory.

Extensions Overview

Google's Extensions Overview page states:

Extensions are zipped bundles of HTML, CSS, JavaScript, images, and other files used in the web platform, that customize the Google Chrome browsing experience. Extensions are built using web technology and can use the same APIs the browser provides to the open web.

Extensions have a wide range of functional possibilities. They can modify web content users see and interact with or extend and change the behavior of the browser itself.

Consider extensions the gateway to making the Chrome browser the most personalized browser.

Getting Started Tutorial

Google's Getting Started Tutorial states:

Extensions are made of different, but cohesive, components. Components can include background scripts, content scripts, an options page, UI elements and various logic files. Extension components are created with web development technologies: HTML, CSS, and JavaScript. An extension's components will depend on its functionality and may not require every option.

Develop Extensions

Google's Develop Extensions page summarizes Extension components and capabilities.

Customize extension user interface

Build extension utilities

Modify and observe the Chrome Browser

Modify and observe the web

Package, deploy and update

Expand Chrome DevTools

Content Scripts

Google's Content Scripts page states:

Content scripts are files that run in the context of web pages. By using the standard Document Object Model (DOM), they are able to read details of the web pages the browser visits, make changes to them and pass information to their parent extension.

Understand Content Script Capabilities:

Content scripts can access Chrome APIs used by their parent extension by exchanging messages with the extension. They can also access the URL of an extension's file with chrome.runtime.getURL() and use the result the same as other URLs.

Distributing Chrome Extensions

They are distributed through Chrome Web Store, initially known as the Google Chrome Extensions Gallery. All users with a Google Account are able to add extensions after developing them. Many Chrome extensions, once installed, have access to the user's data. There are three levels of permissions that an app or extension may request. All extensions must have a clear and singular purpose.

In the News

Fiction cross-reference

Nonfiction cross-reference

  • Google (nonfiction) - an American multinational technology company that specializes in Internet-related services and products, which include online advertising technologies, search engine, cloud computing, software, and hardware.
  • Google Chrome (nonfiction) - a cross-platform web browser developed by Google. It was first released in 2008 for Microsoft Windows, and was later ported to Linux, macOS, iOS, and Android. The browser is also the main component of Chrome OS, where it serves as the platform for web apps.

External links: