Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.
Develop 
plugin for 
Mozilla Firefox 
and structure a JavaScript-based 
application
Modular JavaScript
• CommonJS 
• AMD 
• Harmony (ECMAScript.next)
CommonJS 
A Module Format Optimized For The Server
// package/lib is a dependency we require 
var lib = require('package/lib'); 
// some behavior for our module 
function fo...
AMD 
Asynchronous Module Definition
“CommonJS AMD format”
Proposal for defining modules where both the module and 
dependencies can be asynchronously loaded.
define( 
module_id, 
[dependencies], 
definition function 
);
AMD & CommonJS 
A module that works in both server-side and client-side
UMDjs 
https://github.com/umdjs/umd
Develop for Firefox
Classic 
Traditional, classic, or XUL extensions
<menu id="xulschoolhello-hello-menu" label="&xulschoolhello.hello.label;" 
accesskey="&xulschoolhello.helloMenu.accesskey;...
Add-on SDK 
HTML, CSS, JavaScript
Using the Add-on SDK you can create Firefox add-ons using 
standard Web technologies: JavaScript, HTML, and CSS. 
! 
The S...
Sources 
• Writing Modular JavaScript With AMD, CommonJS 
& ES Harmony written by Addy Osmani 
• Mozilla developers networ...
Thanks. Questions? 
Afshin Mehrabani 
@afshinmeh
Develop plugin for Mozilla Firefox and structure a JS-based application
Nächste SlideShare
Wird geladen in …5
×

Develop plugin for Mozilla Firefox and structure a JS-based application

1.592 Aufrufe

Veröffentlicht am

How to develop a plugin for Mozilla Firefox and structure a JS-based application using AMD, CommonJS and Harmony.

Veröffentlicht in: Software
  • Loggen Sie sich ein, um Kommentare anzuzeigen.

Develop plugin for Mozilla Firefox and structure a JS-based application

  1. 1. Develop plugin for Mozilla Firefox and structure a JavaScript-based application
  2. 2. Modular JavaScript
  3. 3. • CommonJS • AMD • Harmony (ECMAScript.next)
  4. 4. CommonJS A Module Format Optimized For The Server
  5. 5. // package/lib is a dependency we require var lib = require('package/lib'); // some behavior for our module function foo(){ lib.log('hello world!'); } // export (expose) foo to other modules exports.foo = foo;
  6. 6. AMD Asynchronous Module Definition
  7. 7. “CommonJS AMD format”
  8. 8. Proposal for defining modules where both the module and dependencies can be asynchronously loaded.
  9. 9. define( module_id, [dependencies], definition function );
  10. 10. AMD & CommonJS A module that works in both server-side and client-side
  11. 11. UMDjs https://github.com/umdjs/umd
  12. 12. Develop for Firefox
  13. 13. Classic Traditional, classic, or XUL extensions
  14. 14. <menu id="xulschoolhello-hello-menu" label="&xulschoolhello.hello.label;" accesskey="&xulschoolhello.helloMenu.accesskey;" insertafter="helpMenu"> <menupopup> <menuitem id="xulschoolhello-hello-menu-item" label="&xulschoolhello.hello.label;" accesskey="&xulschoolhello.helloItem.accesskey;" oncommand="XULSchoolChrome.BrowserOverlay.sayHello(event);" /> </menupopup> </menu>
  15. 15. Add-on SDK HTML, CSS, JavaScript
  16. 16. Using the Add-on SDK you can create Firefox add-ons using standard Web technologies: JavaScript, HTML, and CSS. ! The SDK includes JavaScript APIs which you can use to create add-ons, and tools for creating, running, testing, and packaging add-ons.
  17. 17. Sources • Writing Modular JavaScript With AMD, CommonJS & ES Harmony written by Addy Osmani • Mozilla developers network - developer.mozilla.org
  18. 18. Thanks. Questions? Afshin Mehrabani @afshinmeh

×