John Aaron Nelson

New Force.com Project

April 07, 2015

  1. Insure dependencies are configured correctly
  2. Open an empty Sublime Text. Create new MavensMate Project. Give it a name like app-name. It will create the folder and structure for the project. It's only necessary to fill out the first tab. Insure your MavensMate settings are pointing you to the correct folder to store the project.
    ctrl+shift+m
  3. Create "spa/appName" path. We create the two layer structure so when Gulp builds the resources, they are in the correct folder. "cd" to the new dir and run the "Cs Angular" Yeoman generator to create front end app.
  4. Yo
  5. We will name the static resource appNameStatic and pick the packages we are comfortable with (Angular 1.3, jQuery 2, RESTAngular, ui-router, Bootstrap, Angular UI, less, js, and html
  6. Let it run.  It may take a few minutes.
  7. go to appName folder and run Gulp Build.
    1. go to package.json, and remove the gulp-ng-annotate line
    2. run "npm install gulp-ng-annotate --save-dev" may need to be run
  8. Insure folder structure looks like ...
    .../[app-name]
       |-config
       |-resource-bundles //Generated By Gulp Build
       |---appNameStatic.resource 
       |-----assets
       |-------images
       |-----fonts
       |-----scripts
       |-----styles
       |-spa
       |---[appName]
       |-----bower_components
       |-----db
       |-----dist
       |-----e2e
       |-----gulp
       |-----node_modules
       |-----src
       |-------app
       |---------[main]
       |---------[view]
       |-------assets
       |---------images
       |---------less
       |-------components
       |---------[data]
       |---------[navbar]
       |---------[component]
       |-src
       |---classes
       |---components
       |---pages
       |---staticresources
       |----appName..xml //The XML file is bundled with the Resource-Bundles Zip
       |---triggers
  9. Start Development : spa/appName/src is the folder in which we will develop our SPA app.
When app is ready to be tested
  1. Run json-server on a stub to create a test REST endpoint
  2. Run Gulp Serve to start the web server

John Nelson

Written by John Nelson, who lives and works in Chattanooga, building things for Clearbit.