Doing mobile web apps can be challenging, not that it’s really harder than doing desktop style app, it’s just different. Working with mobile you need to focus on simplicity & performance.

When I started dabbling into doing mobile web apps with Backbone.js I really wanted to abstract from the start the mobile part to focus on building great apps. That’s why I builded Backbone Mobile Components.

It’s 7 components that helps you creating mobile apps with backbone easier. It also follows the backbone mantra, it does not get in the way of your architecture, you just extend those components like you would in backbone.js & there you go.

So the demo is a bit.. well.. underwhelming. I really wanted to have a Hacker news reader clone but that will have to wait. Some ameliorations are also be coming along later.

Complete documentation & download is here.

One nice thing is that those components are very well documented, that should help understanding what’s happening behind scene. They are also unit tested, but I am far from full coverage.

Here what you get:

Master page view

Easily setup a page view system for your mobile app.

Master topbar view

Creates a fixed top toolbar with buttons, sub menu & dynamic page title

Master menu view

Let you create a side action menu that can tie-in easily in the topbar.

Master popin view

Let you create mobile overlays easily

Master list view

Helping you handle list views that are pretty coming in mobile apps.

Mobile animation component

Helps you serve animation to device that can handle it.

Utilities component

Utilities that you can use throughout your app like a phone object that tells you everything we can know about the device.

Wrapping up

As you guys can imagine these components are derivative of my work at CakeMail, I hope to provide a better demo & better fledged CSS components soon.