Addons con Jetpack

415 views

Published on

Ejemplo de un "Hola Mundo" usando Jetpck

Published in: Technology, Art & Photos
  • Be the first to comment

  • Be the first to like this

Addons con Jetpack

  1. 1. Creando AddOns con Jetpack jetpack.png
  2. 2. Pasos <ul><li>Descargar el SDK
  3. 3. Descomprimir el archivo
  4. 4. Ingresar a la carpeta raíz del SDK y ejecutar por consola: source /bin/activate
  5. 5. Ejecutar cpx docs para activar documentación de Jetpack
  6. 6. Ingresar a la capeta examples ejecutando cd examples y crear la carpeta para el AddOn ejecutando mkdir holamundo </li></ul>jetpack.png
  7. 7. Pasos <ul><li>Dentro de la carpeta holamundo, crear la carpeta lib y el archivo package.json (al mismo nivel)
  8. 8. Crear dentro de la carpeta lib, un archivo llamado main.js
  9. 9. Editamos el archivo package.jason
  10. 10. {
  11. 11. &quot;name&quot;: &quot;holamundo&quot;,
  12. 12. &quot;description&quot;: &quot;Decir al mundo Hola Mundo&quot;,
  13. 13. &quot;author&quot;: &quot;yo (http://www.yo.org)&quot;,
  14. 14. &quot;version&quot;: &quot;0.1&quot;,
  15. 15. &quot;license&quot;: &quot;MPL 1.1/GPL 2.0/LGPL 2.1&quot;,
  16. 16. &quot;main&quot;: &quot;main&quot;
  17. 17. } </li></ul>jetpack.png
  18. 18. Pasos <ul><li>Modificar el archivo main.js que se encuentra dentro de la carpeta lib con el siguiente codigo:
  19. 19. {
  20. 20. exports.main=function(){
  21. 21. console.log(&quot;Vengo a decir al mundo Hola Mundo&quot;);
  22. 22. }
  23. 23. Regresamos a la carpeta holamundo y ejecutamos el comando cpx xpi para empaquetar nuestro addon.
  24. 24. Abrimos Firefox y en el menu Archivo en la opción Abrir Archivo buscamos nuestro .xpi.
  25. 25. Instalamos en AddOn.
  26. 26. En la barra de URL escribimos about:addons y podremos ver nuestro AddOn Instalado.
  27. 27. Ingresamos a la consola JavaScript para verificar el mensaje. </li></ul>jetpack.png
  28. 28. Que hemos hecho? <ul><li>Iniciamos Jetpack.
  29. 29. Creamos la jerarquia de directorios.
  30. 30. Creamos archivo .jason que contiene la descripción de nuestro AddOn.
  31. 31. Adicionamos al archivo main.js la funcionalidad de nuestro AddOn.
  32. 32. Genramos el paquete con el comando cpx xpi
  33. 33. Instalamos nuestro addOn.
  34. 34. Verificamos que funciona. </li></ul>jetpack.png
  35. 35. Donde puedo encontrar más Información? <ul><li>Sitio oficial de Jetpack https://jetpack.mozillalabs.com/
  36. 36. Blogs de Jetpack https://mozillalabs.com/jetpack/2010/06/10/extending-firefox-with-jetpack-presentation-vanjs/
  37. 37. En Mozilla Hispano http://www.mozilla-hispano.org/presentacion-de-jetpack/
  38. 38. En la documentación de Jetpack ejecutando el comando cpx docs </li></ul>jetpack.png

×