Notice: Undefined index: order_next_posts in /nas/content/live/gadgetmag/wp-content/plugins/smart-scroll-posts/smart-scroll-posts.php on line 194

Notice: Undefined index: post_link_target in /nas/content/live/gadgetmag/wp-content/plugins/smart-scroll-posts/smart-scroll-posts.php on line 195

Notice: Undefined index: posts_featured_size in /nas/content/live/gadgetmag/wp-content/plugins/smart-scroll-posts/smart-scroll-posts.php on line 196

FirefoxOS tips and tricks for developers

We’re happy to have had a flying visit from Mozilla’s Christian Heilmann this issue, who brings you a getting-started guide to Firefox OS development...

Firefox OS Geeksphone

Firefox OS isn’t just any mobile operating system – it’s powered completely by web technologies. Why does that matter? Once the platform matures you’ll find its speed, customization and intuitive user experience a boon. Since you’re already ‘in’ the web, you can get rid of lengthy app downloads and do things that traditional mobile operating systems simply can’t.

For developers, though, the advantages are even greater. Since Firefox OS is built on an open platform, using a Linux kernel to boot into a web runtime environment, developing and customising user experiences has never been easier. Since it uses the same Mozilla Gecko web engine that powers the Firefox web browser, a Firefox OS-powered smartphone’s hardware is exposed to Mozilla’s web APIs. This means that every feature you can imagine can be developed as a web application. Interested? Here’s how to get started today…

How to get started

Firefox OS is HTML5. There is no Java, C# or Objective C. Firefox OS gives developers full access to the mobile phone’s functionality with HTML5, CSS and JavaScript. A mobile website can be very easily transformed into a Firefox OS application. You just need to define the offline data using AppCache and LocalStorage or IndexedDB and specify the name and access rights of the app in a manifest.

An example manifest looks like this:

{   "name": "My App",
"description": "My elevator pitch goes here",
"launch_path": "/",
"icons": {
     "128": "/img/icon-128.png"
"developer": {
     "name": "Your name or organization",
     "url": ""
"default_locale": "en"

The offline definitions are needed in any case, so that the app can also be made to run on iOS and Android. If you have an existing HTML5 app in the web, you’re only two steps away from joining in with Firefox OS:

1. Create an open app manifest.
2. Register the app in the Firefox OS Marketplace

Creation of the app is not bound to a specific IDE or work environment. As is also the case in web development, everything can be used from vi on the command line, right up to Eclipse; whatever you feel most comfortable with. So far, there is still no defined SDK and developers don’t have to register or pay fees. Mozilla’s fundamental idea is to keep the web free and accessible for everybody, and Firefox OS reflects this.

Security levels for apps

In an open app manifest, the developer defines what the app should be called, which icons are used and which of the mobile phone’s functions the app has access to. With Firefox OS apps, there are generally three security levels that define everything the app has ‘permission to do’. This is necessary to ensure, for example, that not every app is allowed to send text messages or make phone calls without the end user knowing about it. The three different security levels are hosted, privileged and certified.

A detailed listing of everything that apps are allowed to do and which security levels are required can be found under App permissions.

Put briefly, the various security levels indicate the following…

Hosted app: This app can be stored on your own server, therefore making it easy to amend and maintain. However, as Mozilla does not manage the server and cannot vouch for its security, the app will only be permitted to access a fraction of the hardware.

Privileged app: This app has greater access, must be certified by the Mozilla Marketplace Team and include a Content Security Policy. Furthermore, privileged apps must have a signature and require installation via the Firefox Marketplace.

Certified apps: These define the functionality of the operating system and can therefore access everything. These can only be created by Mozilla and its partners.

The type of app dictates the web APIs that may be used.

Web APIs

Apps in Firefox OS can access the hardware via web APIs. Unlike conventional platforms for HTML5, such as iOS and Android, developers have direct access to the various hardware components of the mobile phone via JavaScript. For example, they can read out the battery charge level as a percentage with window.navigator.battery.level, or make the phone vibrate for one second with a simple window.navigator.vibrate(1000). This functionality is defined as a web API standard and is also already supported by other browsers.

All app types are also capable of penetrating deeper into the system, but not automatically; clearance is required from the user. This is what the Web Activities feature is for.

First own app

There are various possibilities for testing the app. The simplest of these works directly from the desktop, using the Firefox OS Simulator add-on. This simulator can be started up easily via the browser: Tools>Web Developer>Firefox OS Simulator. Here, you’ll receive a simulated mobile phone with Firefox OS, a console displaying errors and information, and the possibility to test apps in Firefox OS from the hard drive. You will get the best results by using Firefox Nightly as your browser. In the meantime, the first Firefox OS smartphones have hit the market, meaning that developers can now test their apps directly on the hardware.

Developers can also launch a new app. The Boilerplate app from Robert Nyman can be used as a basis. This app adjusts automatically to the screen and offers all available Web Activities in the form of buttons in the interface. In addition, the app can also be installed from the web by means of a button, without having to be logged into the Marketplace.

App distribution, Firefox OS Marketplace and adaptive app search

The Firefox Marketplace is an app store, where developers can market apps and users can search for apps. Developers also have the possibility of simply creating apps with an ‘Install’ button in the web.

This allows developers to promote their apps on their own websites. Instead of sending visitors to an app store, they simply switch from the site to the app. This is exactly what happens during an adaptive app search in Firefox OS. The search results are the mobile-optimised websites and all required offline data can be downloaded, if the visitor chooses to install the app.

With the adaptive app search, the search box doesn’t just help users to find the apps on the phone, but also those in the Mozilla Marketplace and on the web. Rather than having to know the name of the app, you simply search for whatever it is you’d like to have, for example, ‘Football’.