Superturbocharging Firefox OS app development with node-firefox
🚀🚀🚀🚀🚀🚀🚀

Soledad Penadés

was: Apps Engineer
now: Tech Evangelism at Mozilla

• @supersole
• #devrel / #apps / #devtools in irc.mozilla.org
• Based in London, so ~11-20h GMT

WebIDE

WebIDE

• In Firefox release now!
• Get started in creating apps quickly
• Helps you install simulators
• Launch apps in runtimes

But... what if you want to build more complex apps, using Browserify, Coffee Script, or...?

You need a build step

• Leave WebIDE
• Go to the command line
• Call your build toolchain
• Back to WebIDE to deploy

THIS IS NOT EFFICIENT

We are engineers, and

ENGINEERS OPTIMISE

How can we
make this efficient?

What could we
automate here?

• We already have a build script
• What's left is deploying
• That's what we're using WebIDE for...
• Can we do that programmatically...
• ... with our build script?

Every Firefox runtime has a debugger server

Clients connect to the server to use its functionalities

WebIDE is a client

Each of these functionalities is provided by an actor

Example:

list the installed apps

• find the webApps actor
• then run the getAll command
• and get a list of apps in response

Another example:

installing an app

• zip the app contents
• find the webApps actor
• call the uploadPackage command in the actor, with the zip
• (the uploadPackage command returns a File actor)
• call the install command in the actor using the results of the previous call
• done!

We can do that too!

We just need to establish a TCP connection to the debugger port and we're done, just need to parse a few packets here and there \o/

EWWW PARSE PACKETS WHAT NO I WANT TO WRITE JAVASCRIPT

Us too!

node-firefox

node.js modules to interact with debugging servers
=== build and run your app without ever leaving the command line!

Starting a simulator?

var startSimulator
  = require('node-firefox-start-simulator');
  
startSimulator({ version: '2.2' })
  .then(function(simu) {
    console.log('Listening in port', simu.port);
  });
  

DEMO TIME

Example 1:

Starting a simulator, installing and launching an app

Example 2:

Building an app with Browserify, installing it and reloading on CSS changes, using Gulp as task runner

What works today?

• find-ports
• find-simulators
• start-simulator
• connect
• find-app
• install-app
• launch-app
• reload-css

Philosophy

Deliberately simple

• one module per action
• only promises, no callbacks AND promises
• as few dependencies as possible

Consistent

• if you know how to use a module, you know how to use the rest

Dream ideas

(or: what we can't do yet)

Dream ideas

• "WebCLI" - a command line WebIDE equivalent
• Launch the Firefox debugger on exceptions
• Control/debug any browser with Valence

Sole's dream idea:

Firefox OS custom editions

Custom builds generated with a script!

• selected apps
• settings
• shareable
• remixable!

How do we get there?

• Better multiplatform support
• Better testing
• More modules: console, logs, screenshot, etc.
• More examples: optimising assets before installing, instant app manifest validation...
• You!
• We're not you, so we can't see or do things the way you do

Contribute!

github.com/mozilla/node-firefox

Breaking news

As of this week you can have WebIDE run a pre-deploy script

But you still cannot do all that node-firefox can!

Please don't ask questions yet.

Play with the project first 😎

Thanks!

@supersole

soledadpenades.com