Writing apps for Firefox OS phones
Life on Planet Firefox

Cooking up an app for the Firefox OS is in no way difficult. All you need is a good measure of HTML and a dash of CSS. A few drops of JavaScript will bring it all to life.
Although the smartphone software market seems polarized between iOS and Android these days, other contenders are filling out or creating their own niches. Mozilla, for example is aiming at the modest part of the market share: the very low end phones. That doesn't mean that Firefox OS phones are bad. Quite the contrary. The few models I've seen so far are perfectly adequate considering their price tag. Additionally, they are real smartphones, with a great potential market in developing countries or for those who think that spending more than 100 bucks on a phone is a waste, which, let's face it, is most people.
Firefox OS can do most, if not all, of what you can do in Android and iOS, and it's easy to make apps for it. If you can write HTML5, CSS3, and JavaScript to create web apps, you've already mastered 90% of what you need to know. Even if you are bit rusty with your web technologies, I'll try to show you in this article how to get from idea to marketplace quickly and easily.
The Hardware
Having a real device on which to test your software definitely helps. The good news is that Firefox OS handsets are cheap, and you can pick up a ZTE Open for less than US$ 80 (or as little as EUR 39 if you live in Spain). Even if you don't have a physical device, however, you can run, test, and debug your app using the Firefox OS Simulator.
The Simulator
The Firefox OS Simulator is a Mozilla add-on that lets you run a Firefox OS emulator (Figure 1) and test your apps [1]. After installing it, go to the Tools | Web Developer | Firefox OS Simulator.
The simulator comprises two parts: the dashboard and the emulator proper. From the dashboard, from left to right and top to bottom, you can run the emulator, see a list of apps you have installed in the emulator, and add a directory or an URL that contains the manifest of Firefox OS app (more about that later). On the far right, within the list of apps, you can Refresh individual apps on the emulator when you make changes and Connect Firefox's integrated web development tools to the emulator to debug your JavaScript code, HTML, or CSS.
If you have a Firefox OS handset, you can also Push your app to it. To do this, you first have to configure your phone by going to Settings on your device; then, scroll down and choose Device Information | More Information | Developer and check the Remote Debugging option. Next, connect your handset to your computer using the USB data cable, and … Presto! Your device will pop up on the dashboard.
The emulator itself, apart from simulating a handset, has two menus at the top. File allows you to Quit the emulator, and App allows you to Refresh an installed app.
Note that the Firefox OS emulator is still in a very early stage of development; hence, it's slow and resource hungry. It may also behave weirdly, lock up, or show results that are inconsistent with what you would see on a real phone, which can be annoying and sort of defeats the purpose of an emulator in the first place. However, unless you have a real Firefox OS device, it's the best you can do.
The Assets
Before you start writing your app, you will want to grab the assets that Mozilla has to offer [2] and that you can use freely in your project. Not only will this make your life easier, it will also help maintain a consistent look and feel across all apps on the system.
The bag of goodies you really want to get is the Building blocks package, which includes all the fonts, icons, images, and CSS files (including styles for buttons, the status bar, etc.) that you need to design an app. Additionally, it includes plenty of examples to help you see how these resources are used, as well as sample JavaScript code to power the whole lot. For comprehensive advice and even more examples to help you use the assets, check out the Building Firefox OS website [3].
Buy this article as PDF
(incl. VAT)
Buy Linux Magazine
Direct Download
Read full article as PDF:
Price $2.95
News
-
Titan Linux is a New KDE Linux Based on Debian Stable
Titan Linux is a new Debian-based Linux distribution that features the KDE Plasma desktop with a focus on usability and performance.
-
Danielle Foré Has an Update for elementary OS 7
Now that Ubuntu 22.04 has been released, the team behind elementary OS is preparing for the upcoming 7.0 release.
-
Linux New Media Launches Open Source JobHub
New job website focuses on connecting technical and non-technical professionals with organizations in open source.
-
Ubuntu Cinnamon 22.04 Now Available
Ubuntu Cinnamon 22.04 has been released with all the additions from upstream as well as other features and improvements.
-
Pop!_OS 22.04 Has Officially Been Released
From the makers of some of the finest Linux-powered desktop and laptop computers on the market comes the latest version of their Ubuntu-based distribution, Pop!_OS 22.04.
-
Star Labs Unveils a New Small Format Linux PC
The Byte Mk I is an AMD-powered mini Linux PC with Coreboot support and plenty of power.
-
MX Linux Verison 21.1 “Wildflower” Now Available
The latest release of the systemd-less MX Linux is now ready for public consumption.
-
Microsoft Expands Their Windows Subsystem for Linux Offerings With AlmaLinux
Anyone who works with Windows Subsystem for Linux (WSL) will now find a new addition to the available distributions, one that’s become the front-runner replacement for CentOS.
-
Debian 11.3 Released wIth Numerous Bug and Security Fixes
The latest point release for Debian Bullseye is now available with some very important updates.
-
The First Alpha of Asahi Linux is Available
Asahi Linux is the first distribution to fully support Apple Silicon and is now available for testing.