Blog - HubSpot Product Team

Tech Talk: Getting Started with Chrome Extensions

Written by Erik Munson | Apr 20, 2015

We've built our share of web apps at HubSpot. Web apps are awesome. They provide users with an accessible and portable experience through a tool they already know how to use: their browser.

But what if you want your app to work alongside the web apps users are spending their time on? How do you give your users the experience they want, where they want it?

Those are precisely the questions we asked when building Sidekick and a Chrome Extension turned out to be the way we could achieve the experience our users wanted. Chrome Extensions allow developers to build apps that enhance and extend both the web apps' users' visit and the browser itself. Extensions make some features possible that users have come to expect from built-in app platforms — like real-time notifications — without many of the downsides of built-in app development. Best of all, extensions are written in the same languages we use every day to build web apps — HTML, CSS, and JavaScript.

In this talk, I explain what a Chrome Extension is and why you might want to build (or use) one. I also show some simple examples of how they can be utilized to provide a positive user experience; many of which might not be possible with a standard web app. 

 

Some resources:

Google’s Getting Started Docs for Chrome Extensions: This page will give you a head start on creating your first extension, and point you in the right direction. Not too much architectural info, but a good place to start if you like to jump right into coding.

Chrome Extension Architectural Overview: This will walk you through how Chrome Extensions are architected at a high-level. Not much detail on API usage or specific code, but great for understanding the bigger picture and how your extension actually interacts with the browser.

Chrome Extension Sample Gallery: A full-featured example gallery with the ability to search for specific features or API usages to look at how they can be built in a real-world context. A fantastic resource for getting ideas and inspiration when trying to decide how to make use of the Chrome Extension APIs.

Chrome Platform API Reference: A complete run-down of all the JavaScript APIs available to extensions. Great for when you need info on a particular API and want it straight from the authors.