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

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:
> 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.

  • Login to see the comments

Webapps: introduction and publishing on Firefox OS

  1. 1. Webapps, case study and Publishing applications on Firefox OS @jgferreiro
  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:
  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 Plaftform for: Listen Share Download The best Electronic Music from Emerging artists
  19. 19. Página principal music4deejays. @jgferreiro
  20. 20. @jgferreiro Adaptive design to any device Responsive Design!
  21. 21. How do I published my app in Firefox marketplace?
  22. 22. Publishing @jgferreiro
  23. 23. Publishing Firefox Marketplace @jgferreiro
  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)
  29. 29. More information:
  30. 30. Interesting links @jgferreiro • 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