Skip to content

A simple template for starting an Angular JS / PhoneGap / Topcoat based app.

License

Notifications You must be signed in to change notification settings

calendee/phonegap-topcoat-angular-template

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

phonegap-topcoat-angular-template

This is essentially a boilerplate to generate a Phonegap app based on the Topcoat CSS framework using AngularJS for routing, etc. The app comes with a main application area and a sidebar menu. This app is NOT an Angular JS rewrite of Topcoat elements.

Prerequisites:

  • Node installed
  • Grunt / Grunt CLI installed
  • Phonegap installed
  • Phonegap CLI Installed

Installation:

  • Clone the app

> git clone https://github.com/calendee/phonegap-topcoat-angular-template.git ~/MyAwesomeApp

  • Install the Phonegap directories

> phonegap create ~/MyAwesomeApp --name "MyAwesomeApp" --id "com.REPLACE-THIS-WITH-SOMETHING.MyAwesomeApp"

  • Delete some PhoneGap cruft (Careful with this!)

> cd ~/MyAwesomeApp; rm -rf www/spec; rm www/spec.html; rm www/js/index.js; rm www/css/index.css; rm www/index.html

  • Install the Require Node Modules

> cd ~/MyAwesomeApp; npm install

  • Run Grunt to put all content into the www directory and to create the iOS platform specific code and start the iOS simulator

> cd ~/MyAwesomeApp; grunt; phonegap run ios

Start Customizing:

To customize the app, make ALL your changes in the ~/MyAwesomeApp/src/ directory. ALL assets should be placed in the ~/MyAwesomeApp/src/ directory. Do NOT edit anything in the ~/MyAwesomeApp/www/ directory as it will be overridden when you run grunt. If you need new assets to be compiled, copied etc into the www directory, edit Grunt.js so that the build process moves them as required.

Once your changes are completed, build and go as follows: > cd ~/MyAwesomeApp; grunt; phonegap run ios

OR

> cd ~/MyAwesomeApp; grunt; phonegap build ios

NOTE : I create a symlink to the ~/MyAwesomeApp/www/ directory so that code changes can be viewed in a web browser without having to run in the iOS simulator for every single change. Depending on your setup, you will do this differently.

> ln -s ~/MyAwesomeApp/www/ /usr/local/zend/apache2/htdocs/MyAwesomeApp

Git Ignore Issues:

The supplied Git Ignore file is configured to ignore most of the PhoneGap generated contents. At this time, I've ignored everything I don't feel is necessary to track. If you have different criteria than me, modify the .gitignore file to your hearts content.

Credits:

License

Original author: Justin Noel Copyright (c) 2013 Calendee LLC All rights reserved.

This project is available under the MIT license. See LICENSE.

About

A simple template for starting an Angular JS / PhoneGap / Topcoat based app.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published