Getting started on Firefox OS apps with AngularJS
This post was originally published on Coding Glamour.
The part that amazes me most about working day to day with Firefox OS
is the incredible way that the existing web eco-system can be reused to
target mobile phones. We have seen this with using Weinre to remote debug the FFOS system, using emscripten to cross compile C code into javascript,
or just the ease of reusing jQuery within your Firefox OS app; something
that I would have killed for back in the days when doing WPF.
Development in JavaScript frameworks has exploded since the mid-2000s,
with new players emerging every other day, and application frameworks like
Ember.jsor AngularJS now
taking the lead, giving website developers extremely powerful components
at a fraction of the costs. The great thing about Firefox OS is that we
can take advantage of the developments in these areas, rather than waiting
for a new release from Apple or Google to react on the changing world.
However, building great web applications doesn't end with picking
an application framework. Perhaps the most scaring part here is to pick
a UI framework, or to get over the data binding syntax. The good thing
here is: been there, done that. We have explored a variety of UI libraries,
application frameworks and we have experienced first hand which are the
pitfalls when building for Firefox OS. That's why we're releasing
application boilerplate for writing great looking and structured mobile
applications. For an impression: the application can be found on comoyo.github.com/ffos-list-detail (visit in any modern
browser).
Things we have addressed here:
- Routing for bookmarkable segments in the application
- Separation in controllers, views and services through AngularJS
- Incorporating a UI library with the Firefox OS building blocks, that was also used to build the core UI layer (how is that for native!)
- Animations between views (slide and modal, plus reverse), optimized to also run smooth on low spec phones
- Compatibility to also run on Android, iOS and desktop browsers
- Example app manifest + cache manifest for offline usage
- RequireJS build system for javascript combination / minification
The source of the application (fork and start hacking!) can be found on github.com/comoyo/ffos-list-detail.
Comments on Hacker News
There are 0 comments on this article, read them on Coding Glamour.