Hi, I am Trishul

Browser Extensions

MozFest 2018
@trishulgoel
WHAT

@trishulgoel
One size fits All

@trishulgoel


@trishulgoel

WHY

@trishulgoel
USABILITY

@trishulgoel

@trishulgoel


@trishulgoel


@trishulgoel


@trishulgoel

TREE STYLE TAB

@trishulgoel


@trishulgoel

WORD COUNT

@trishulgoel

PRIVACY

@trishulgoel

@trishulgoel


@trishulgoel


@trishulgoel


Facebook Containers

@trishulgoel


@trishulgoel

ADBLOCK PLUS

@trishulgoel

JUST BCOZ
WHY NOT

@trishulgoel

@trishulgoel
TABBY CAT


@trishulgoel


@trishulgoel

YOUTUBE CONTROLLER

@trishulgoel

ADDONS.MOZILLA.ORG

@trishulgoel
REVIEWS & RATINGS

@trishulgoel

@trishulgoel


@trishulgoel

SECURITY

@trishulgoel

@trishulgoel


@trishulgoel

@trishulgoel

Want to build one?

@trishulgoel
HOW?

@trishulgoel
Structure of an extension

Manifest.json
Content Scripts
Background Scripts
Page action
Browser action
Options page
Web accessible resources
@trishulgoel


@trishulgoel
Content Scripts

javascript that executes once the page load is complete
@trishulgoel
Background Scripts

Javascript that executes in background :P
@trishulgoel
Page Action



Browser Action
@trishulgoel

Options Page
A HTML page which helps to set extension's preferences

@trishulgoel
Webextension APIs

@trishulgoel
Tabs API


@trishulgoel
Notifications API

@trishulgoel

Notifications API


@trishulgoel
BrowserAction API

@trishulgoel

BrowserAction API


@trishulgoel
webRequest API


@trishulgoel

Lets get started
@trishulgoel

LINK PAINTER
@trishulgoel


@trishulgoel


@trishulgoel

WORD COUNTER
@trishulgoel


@trishulgoel


@trishulgoel

SECURITY
@trishulgoel





@trishulgoel

DEBUGGING
@trishulgoel

about:debugging
Load temporary addon
Select manifest.json

@trishulgoel

chrome://extensions
Load Unpacked
Select extension Folder

@trishulgoel

TOOLS
@trishulgoel

WEB-EXT
A command line tool designed to speed up extension development process





@trishulgoel

webextensions.tech
@trishulgoel

http://bit.ly/publishAddon
@trishulgoel

Resources
- http://bit.ly/webextensions
- http://bit.ly/webexttutorials
- http://bit.ly/web-ext
- http://bit.ly/publishAddon
@trishulgoel

@trishulgoel

make most of your browsers
By Trishul Goel
make most of your browsers
make most of your browsers using extensions | Mozfest
- 1,004