{"id":8220,"date":"2017-08-03T08:00:27","date_gmt":"2017-08-03T15:00:27","guid":{"rendered":"http:\/\/blog.mozilla.org\/addons\/?p=8220"},"modified":"2017-08-23T15:47:25","modified_gmt":"2017-08-23T22:47:25","slug":"extension-examples-see-apis-action","status":"publish","type":"post","link":"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/","title":{"rendered":"Extension Examples: See the APIs in Action"},"content":{"rendered":"<p>In the past year, we&#8217;ve added a tremendous amount of add-on documentation to<a href=\"https:\/\/developer.mozilla.org\/Add-ons\"> MDN Web Docs<\/a>. One resource we&#8217;ve spent time building out is the <a href=\"https:\/\/github.com\/mdn\/webextensions-examples\">Extension Examples repository<\/a> on GitHub, where you can see sample extension code using various APIs. This is helpful for seeing how WebExtensions APIs are used in practice, and it is especially helpful for people just getting started building extensions.<\/p>\n<p>To make the example extensions easier to understand, there is a short README page for each example. There is also a <a href=\"https:\/\/developer.mozilla.org\/en-US\/Add-ons\/WebExtensions\/Examples\">page<\/a> on MDN Web Docs that lists the JavaScript APIs used in each example.<\/p>\n<p>With the work the <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Tools\">Firefox Developer Tools <\/a>team has completed for add-on developers, it is easier to temporarily install extensions in Firefox for debugging purposes. Feel free to <a href=\"https:\/\/developer.mozilla.org\/en-US\/Add-ons\/WebExtensions\/Temporary_Installation_in_Firefox\">try it out <\/a>with the example extensions.<\/p>\n<p>As we ramp up our efforts for <a href=\"https:\/\/wiki.mozilla.org\/RapidRelease\/Calendar\">Firefox 57<\/a>, expect more documentation and examples to be available on MDN Web Docs and our GitHub repository. There are currently 47 example extensions, and you can help grow it by following these <a href=\"https:\/\/github.com\/mdn\/webextensions-examples\/blob\/master\/CONTRIBUTING.md\">instructions<\/a>.<\/p>\n<p>Let us know in the comments if you find these examples useful, or <a href=\"https:\/\/developer.mozilla.org\/en-US\/Add-ons#Contact_us\">contact us using these methods<\/a>. We encourage you to contribute your own examples as well!<\/p>\n<p>Thank you to all who have contributed to growing the repository.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In the past year, we&#8217;ve added a tremendous amount of add-on documentation to MDN Web Docs. One resource we&#8217;ve spent time building out is the Extension Examples repository on GitHub, &hellip; <a class=\"go\" href=\"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/\">Read more<\/a><\/p>\n","protected":false},"author":144,"featured_media":8108,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[44,295,278886],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v22.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Extension Examples: See the APIs in Action - Mozilla Add-ons Community Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Mozilla\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/\",\"url\":\"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/\",\"name\":\"Extension Examples: See the APIs in Action - Mozilla Add-ons Community Blog\",\"isPartOf\":{\"@id\":\"https:\/\/blog.mozilla.org\/addons\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/blog.mozilla.org\/addons\/files\/2017\/03\/addons-puzzle-fox.png\",\"datePublished\":\"2017-08-03T15:00:27+00:00\",\"dateModified\":\"2017-08-23T22:47:25+00:00\",\"author\":{\"@id\":\"https:\/\/blog.mozilla.org\/addons\/#\/schema\/person\/33edd7d4d73723140487082573041c83\"},\"breadcrumb\":{\"@id\":\"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/#primaryimage\",\"url\":\"https:\/\/blog.mozilla.org\/addons\/files\/2017\/03\/addons-puzzle-fox.png\",\"contentUrl\":\"https:\/\/blog.mozilla.org\/addons\/files\/2017\/03\/addons-puzzle-fox.png\",\"width\":220,\"height\":220,\"caption\":\"Add-ons logo\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/blog.mozilla.org\/addons\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Extension Examples: See the APIs in Action\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/blog.mozilla.org\/addons\/#website\",\"url\":\"https:\/\/blog.mozilla.org\/addons\/\",\"name\":\"Mozilla Add-ons Community Blog\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/blog.mozilla.org\/addons\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/blog.mozilla.org\/addons\/#\/schema\/person\/33edd7d4d73723140487082573041c83\",\"name\":\"Mozilla\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/blog.mozilla.org\/addons\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/f84bd67e8e3ab3bcc9676910aecf5700?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/f84bd67e8e3ab3bcc9676910aecf5700?s=96&d=mm&r=g\",\"caption\":\"Mozilla\"},\"url\":\"https:\/\/blog.mozilla.org\/addons\/author\/mozilla\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Extension Examples: See the APIs in Action - Mozilla Add-ons Community Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/","twitter_misc":{"Written by":"Mozilla","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/","url":"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/","name":"Extension Examples: See the APIs in Action - Mozilla Add-ons Community Blog","isPartOf":{"@id":"https:\/\/blog.mozilla.org\/addons\/#website"},"primaryImageOfPage":{"@id":"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/#primaryimage"},"image":{"@id":"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/#primaryimage"},"thumbnailUrl":"https:\/\/blog.mozilla.org\/addons\/files\/2017\/03\/addons-puzzle-fox.png","datePublished":"2017-08-03T15:00:27+00:00","dateModified":"2017-08-23T22:47:25+00:00","author":{"@id":"https:\/\/blog.mozilla.org\/addons\/#\/schema\/person\/33edd7d4d73723140487082573041c83"},"breadcrumb":{"@id":"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/#primaryimage","url":"https:\/\/blog.mozilla.org\/addons\/files\/2017\/03\/addons-puzzle-fox.png","contentUrl":"https:\/\/blog.mozilla.org\/addons\/files\/2017\/03\/addons-puzzle-fox.png","width":220,"height":220,"caption":"Add-ons logo"},{"@type":"BreadcrumbList","@id":"https:\/\/blog.mozilla.org\/addons\/2017\/08\/03\/extension-examples-see-apis-action\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/blog.mozilla.org\/addons\/"},{"@type":"ListItem","position":2,"name":"Extension Examples: See the APIs in Action"}]},{"@type":"WebSite","@id":"https:\/\/blog.mozilla.org\/addons\/#website","url":"https:\/\/blog.mozilla.org\/addons\/","name":"Mozilla Add-ons Community Blog","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/blog.mozilla.org\/addons\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/blog.mozilla.org\/addons\/#\/schema\/person\/33edd7d4d73723140487082573041c83","name":"Mozilla","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/blog.mozilla.org\/addons\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/f84bd67e8e3ab3bcc9676910aecf5700?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/f84bd67e8e3ab3bcc9676910aecf5700?s=96&d=mm&r=g","caption":"Mozilla"},"url":"https:\/\/blog.mozilla.org\/addons\/author\/mozilla\/"}]}},"_links":{"self":[{"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/posts\/8220"}],"collection":[{"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/users\/144"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/comments?post=8220"}],"version-history":[{"count":0,"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/posts\/8220\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/media\/8108"}],"wp:attachment":[{"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/media?parent=8220"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/categories?post=8220"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.mozilla.org\/addons\/wp-json\/wp\/v2\/tags?post=8220"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}