Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Webapps: introduction and publishing on Firefox OS

822 views

Published on

This presentation has been created especially for the event of Firefox OS Madrid from November 28, 2014.

In this talk I try the following:

> Webapps: What are they? Advantages and disadvantages.
> Case Study: Music4deejays.com
> How to publish an app in the Market place of Firefox OS.

I hope you find it utilidad'. For anything you have my contact details in the presentation.

A greeting.
Jorge Ferreiro.

Published in: Internet
  • Be the first to comment

Webapps: introduction and publishing on Firefox OS

  1. 1. Webapps, case study and Publishing applications on Firefox OS @jgferreiro jgferreiro.me@gmail.com
  2. 2. What is a webapp?
  3. 3. What is a webapp? @jgferreiro A webapp is: an optimised version for mobile devices of a web page
  4. 4. What is a webapp? @jgferreiro Why to make webapps? • Flexibility: Any page can "become" a webapp. • Multiplatform: one design, multiple devices. • No updates: Since is a webpage users always access the latest version. • The only requirement is that the web should be responsive (having a design that suits according to the resolution of the device)
  5. 5. What is a webapp? @jgferreiro Cons of a webapp • Although the performance of web apps is good and getting better and better, native applications are usually superior. • There may be some limitation in using some apis depending on the platform that we are developing. • You will need to use a framework (eg, phonegap) to publish your app in some stores of applications (Android / Ios)
  6. 6. What is a webapp? Examples of webapps @jgferreiro Candy rain 2 Openwapp Cameran
  7. 7. How to develop a webapp?
  8. 8. Technologies @jgferreiro Combining HTML5 + CSS3 + JAVASCRIPT + + HTML5 JS CSS3
  9. 9. Tools kit @jgferreiro Useful Tool: Firefox OS simulator
  10. 10. If the idea is to turn a website into a webapp... How do we do that? Web webapp
  11. 11. App manifest
  12. 12. App manifest  JSON file to be configured according to the needs of your application Required! @jgferreiro
  13. 13. App manifest @jgferreiro Other interesting properties.  Locales: Allows you to set various languages for the same application.
  14. 14. App manifest @jgferreiro  Permissions: indicates which APIs your application is using: contacts, alarms, notifications, geolocation ... More info about how to configure your manifest: https://developer.mozilla.org/es/Apps/Build/Manifest#permisos
  15. 15. My webapp: Music4deejays
  16. 16. A few months ago I had an idea...
  17. 17. And what motivates me to do it?  Passion for electronic music  Today it is very difficult for artists and producers to be known.  I love launching projects that solve real problems.
  18. 18. What is music4deejays.com? Plaftform for: Listen Share Download The best Electronic Music from Emerging artists
  19. 19. Music4deejays.com Página principal music4deejays. @jgferreiro
  20. 20. Music4deejays.com @jgferreiro Adaptive design to any device Responsive Design!
  21. 21. How do I published my app in Firefox marketplace?
  22. 22. Publishing @jgferreiro jgferreiro.com/music4deejays-web jgferreiro.com/music4deejays.webapp
  23. 23. Publishing Firefox Marketplace @jgferreiro https://marketplace.firefox.com/developers/submit/
  24. 24. Publishing App type + manifest route @jgferreiro
  25. 25. Publishing @jgferreiro Error .htaccess must be configured for apache servers Add to .htaccess: AddType application/x-web-app-manifest+json .webapp
  26. 26. Publishing App requirements Añadir al .htaccess: AddType application/x-web-app-manifest+ json .webapp @jgferreiro
  27. 27. Publishing Information Añadir al .htaccess: AddType application/x-web-app-manifest+ json .webapp @jgferreiro
  28. 28. Publishing @jgferreiro Few more steps and… Ready! Now we only need to wait until the app is approved (2 to 5 days normally) https://marketplace.firefox.com/app/music4deejays/
  29. 29. More information: Info@music4deejays.com www.music4deejays.com
  30. 30. Interesting links @jgferreiro • https://marketplace.firefox.com/developers/d ocs/deploy • Curso HTML5 para Firefox OS. • Pautas para el desarrollo de aplicaciones • Distribuir tu aplicación
  31. 31. Questions?
  32. 32. Thank you Keep in touch! @jgferreiro jgferreiro.me@gmail.com

×