SKYLINE UI

• Dependency injection at it's core
• Applications are made up of modules
• Modules can be component libraries
  
• Modules can be whole features
  
• Modules can even be whole applications 
  
• Modules can be worked on separately
• Separate repositories
• Versioned
• Testable
• Mockable

• manages client-side javascript dependencies
• installed through npm
• runs on nodeJS
• runs over git
• created by twitter ( open sourced )
  
  

which millions?

1. jquery
2. angularjs
3. underscore
4. 14,700 registered gui packages

 {
  "name": "hyperv-flr",
  "version": "0.1.2",
  "dependencies": {
    "angular": "1.2.6",
    "jquery": "~1.10.2",
    "emc-ui": "http://stash.lss.emc.com/gui/emc-ui#0.1.12",
    "emc-angular-login": "http://stash.lss.emc.com:gui/emc-login#0.1.4"
  },
  "devDependencies": {
    "angular-mocks": "1.2.6",
    "angular-scenario": "1.2.6"
  }
}

bower install 

• Runs on NodeJS
  
• Grunt itself really useless
  
• Plugins provide the functionality
  
• JSON based config
  
• Define tasks
  
• Run tests
  
• Aggregate and minify ( js, html, css, images )
  
• Cache busting
  
• Git Tagging
  
• Upload to nexus
  
• Build Mobile
  

karma: {
   unit: {
       configFile: 'karma.conf.js',
       singleRun: true
   },
   ...more task definitions...

> grunt karma:unit

grunt.registerTask('release', 
   [ 'clean', 'build', 'copy:release', 'ngtemplates', 'karma:release' ]
); 

{   "name": "emc-ui",
    "version": "1.0.0",
    "main": [
        "release/emc-ui.min.js",
        "release/styles/emc-ui-bootstrap.min.css"
    ],
            

• Enables smaller more agile teams
• The pattern is to build isolated testable, mockable, components
• Build an internal library of small reusable components
  
• Using the popular Github model
• Really about the tools

• As a proxy for the public rest api(s)
• To manipulate and munge JSON
• To store and retrieve user preferences
• To track the user's web session
• WebSockets

• GRUNT ( our build tool )
  
• KARMA ( our test runner )
  
• It's a mocking layer
  
• It's our development server too

• Run Mocha Tests ( Unit and REST )
  
• Run JSHINT
• Package.json is the module definition
• semantic versioning 1.x.x
• Tag is same as GUI release
• Grunt keeps tags in synch

 {
  "name": "emc-rest-hypervflr",
  "private": true,
  "description": "REST for hypervflr",
  "version": "0.0.1",
  "dependencies": {
    "emc-base-server": "ucas-stash.lss.emc.com/raven/emc-base-server.git",
    "emc-rest-login": "ucas-stash.lss.emc.com/raven/emc-rest-login.git",
    "emc-harmony-auth": "ucas-stash.lss.emc.com/raven/emc-harmony-auth.git",
    "underscore": "~1.6.0",
    ...
  },
  "devDependencies": {
     ....

• Sinopia
• npm Enterprise

• Bower
• Npm
• Pull Requests
• Tagged dependencies
• Branch naming schemes
• All development in branches
• Branch away.  No approval necessary!
• No down time - No single point of failure
• Stash is approved by PSO