PhoneGap Starter Kit

When I started to use the PhoneGap service to build mobile apps I had some dificulties on about where to begin or what should I use to get a very good looking app, even a simple “hello world” app was a bit difficult to do, so, here I will present a pack that I did with the basic stuff to start building a mobile app on PhoneGap.

cordova-phonegap-build

As covered in another post of mine, the PhoneGap is a handy tool that allow web developers to develop native mobile apps just using HTML, CSS and Javascript, for more details about the PhoneGap tool, take a look on that introduction.

The PhoneGap Starter Kit, as I like to call, is a pack with the very basic stuff to start a simple app throuh PhoneGap. This pack includes:

  1. Basic standard folder structure
  2. Index file ready to start
    • includes correct declaration of headers, script files, style files, meta tags
  3. File configuration to compile the app
    • icons, title, description, author
  4. Sample declaration of a plugin
    • needed to access native device resources (battery plugin in this case)
  5. Third party pop-up lib, bootbox
    • with bootbox is possible to add theme to the pop-ups instead of only using the native OS pop-up
    • Switch button style (to be more like device native)
  6. Bootstrap
    • Brings ease to start enviroment
    • Is resposive
    • Theme support
    • Accept many JS plugins
  7. Elements mods
    • Samples checkbox and selectbox modifications to looks like native device
  8. Dropdown Menu
    • Also responsive
  9. Custom Theme
    • Provided by Bootswatch just to show how to setup the theme

 

 

With this very basic kit is possible to compile a simple app on PhoneGap and start it nativelly on and Android, iOS or Windows Phone device.

Also, bellow are some additional links that can help on development:

  • Bootsnip: Many sample codes (forms, layouts, components)
  • Bootswatch: Theme gallery for bootstrap
  • Plugins: Plugins to interact with device resources
  • Cordova: Main lib of the PhoneGap
Advertisements