log inhelp

View
 

phonegap project structure

Page history last edited by Dilawer Hussain 1 month, 3 weeks ago

WORK IN PROGRESS!!

 

When you are building your project for multiple platforms how should you structure your code? Look no further! This article should answer your questions. Basically it breaks down to two techniques: keeping your www folder as a separate project in your RCS or using symlinks to include it into multiple targets for building. 

 

Git Submodule

 

1.) Create your project which will contain index.html and any CSS, JS assets and put into its own Git repo.
2.) Submodule as WWW folder into your [platforms] of choice.

 

Eg.

 

  MyFancyProj
  |- index.html
  |- app.css
  '- app.js

 

And then...

 

   MyFancyProj-iOS
   |- iphone specific code here
   '- www <-----------------actually a submodule pointing at MyFancyProj

 

SVN Externals

 

In Subversion, you can utilize the svn:externals property to create a shortcut to another location in Subversion.  This is extremely useful when you have a non-compiled codebase such as HTML/CSS/JavaScript that can and should be used in various directory structures.

 

1. Create a folder for your common/shared assets (HTML, Javascript, CSS, images, etc.).  You'll want to call it www so place it in a structure where it can be easily identified.  

 

For example, you'll create the MyFancyProj folder with app under it, and all your static assets under that.

MyFancyProj
|- app.js   
|- controllers
|- models
|- views

 

2. Commit that folder to a common location in subversion.

3. Create the folder for your actual application (whether it's iOS, Android, etc.).

4. Commit that structure to subversion.

 

MyFancyProj-iOS
|-MyFancyProjName
  |-Resources 
  |-Classes
etc... 
|-Frameworks
|-Products

 

You should setup and run your PhoneGap app, which will create the www folder in the physical file structure.  Import that folder as you normally would for an iOS project.  You'll see the PhoneGap plugin automatically creates the index.html and phonegap-X.X.X.js file.  It's important to note that this phonegap.js file is iOS specific and will not run properly on other devices.  Now you can create the svn:externals property which will allow you to add your app directory (with your actual application code) from the same location the Android will use.

 

There are several ways to create the entry in svn:externals depending on what tools you use.  If you use TortoiseSVN, it's very simple to edit this property.

 

To do it via command line (you must have command line version of subversion installed):

 

1. In command line or terminal window, navigate to the top-level folder for your application (MyFancyProj-iOS in the example above)

2. Use the propedit command to add an entry to svn:externals. If you don't have a default editor configured, you'll need to use the --editor-cmd parameter, and give subversion the location of your preferred text editor.

 svn propedit svn:externals .

 

3. When your text editor opens, enter the following (replacing the URL shown with the URL to the location in source control to your MyFancyProj folder).  This creates a folder under MyFancyProj-iOS called www that links to the source control location.

 

 www http://yourdomain/svn/yourfolderstructure/trunk/MyFancyProj/

 

4. Save and close the editor

5. Commit the changes

 

Symlinking

 

todo:

 

CUSTOM BUILD TOOLING

 

todo:

 

 

PDF version