Mobox

Mobile app prototype in a box.

Mobox is intended to serve as a starting place for manufacturing a mobile app using a simple toolset: Haml, Sass, and CoffeeScript. It lets you develop client-side web apps quickly without getting in the way, and takes care of the heavy lifting by assembling everything w/ Sprockets and Phonegap.

Mobox includes the tools that I (David Beveridge) find easiest to work with, including:

• Phonegap (Cordova) 2.0.0
• Haml for your homepage
• Sass for styles
  • 1140 Grid for fluid layout
  • Compass for all that CSS3 goodness
• CoffeeScript
  • jQuery, because you can't live without it.
  • Spine.js for some structure in your JS
    • Spine Mobile, if you're into that
  • Haml-JS for client-side templates
  • GFX & jQuery Transit for hardware-accelerated animation
  • Hammer.js for multi-touch events

Mobox is also a build tool for your app, and can assemble the web, iOS, and Android versions.

• App Design
• Marketing
• Deployment
• Profitability

For iOS apps, you'll need XCode and ios-sim. ios-sim can be installed with homebrew:

brew install ios-sim

gem install mobox
mobox new[my_app]
cd my_app

Start the preview server with

mobox server

and visit http://localhost:3000

See below. Builds will be output in build/[platform name].

mobox build:ios:create
mobox build:ios

Running mobox build:ios:create will prompt you for a namespace and app name, which you must fill out in the correct format.

mobox build:android:create

Before you can actually run the app, you must start your emulator (assuming you already set up an AVD with the Android SDK):

build/android/cordova/emulate

Then you can build the app:

mobox build:android

Running mobox build:android:create will prompt you for a namespace and app name, which you must fill out in the correct format.

You'll find everything you need to build your app in the src directory.

The main page your app runs in.

Put your images here.

Put your javascript/coffeescript here

Root for your Spine.js Application

Put your sass/css/scss files here.