pogo-scaffold

Code project launcher

  1. Pull down HTML5 Boilerplate
  2. JS folder
* Clear
  * Add AMD config
  * Questions
    * Is this a responsive heavy site?
  * Load in throttle-debounce https://github.com/cowboy/jquery-throttle-debounce
     * Lodash?
        * use custom lodash builder to remove functionality not needed like template
  1. CSS folder
    • Clear
    • Add Sass/Stylus
      • Variables
      • Compass / Nib
      • Mixins
      • Normalise + ie7 support
      • Brand
        • Use sections detailed on html5doctor?
        • Typography
        • Forms
        • Tables
      • Modules folder
    • Print Stylesheet
  2. Clear unnecessary root files
  3. Build and watch
    • Add grunt file
  4. Unit test
    • Mocha
    • phantom JS
  1. Templating language
* Handlebars
  * with require plugin https://github.com/SlexAxton/require-handlebars-plugin
* Dust.js http://akdubya.github.com/dustjs/
  * Used by LinkedIn https://engineering.linkedin.com/frontend/client-side-templating-throwdown-mustache-handlebars-dustjs-and-more
  1. Responsive Design
* Responsive Tables solution http://www.zurb.com/playground/playground/responsive-tables/index.html
* Catering for ie < 9 http://the-taylors.org/blog/2012/09/02/responsive-styles-respecting-old-ie-6-7-8
  1. CSS Declarations
  2. BEM
  3. Grouping
  4. Font
  5. Color
  6. Display
  7. Float
  8. Box Model
  9. width
  10. height
  11. padding
  12. margin
  13. border
  14. Background

Sass

  • Inuit.css [Sass] https://github.com/csswizardry/inuit.css
  • Compass http://compass-style.org/
  • Bourbon http://thoughtbot.com/bourbon/

Less

  • Twitter Bootstrap [Less]

Stylus

  • Nib [Stylus] http://visionmedia.github.com/nib/

CSS

  • https://github.com/csswizardry/CSS-Guidelines
  • http://smacss.com/
  • https://github.com/necolas/idiomatic-css
  • BEM http://coding.smashingmagazine.com/2012/04/16/a-new-front-end-methodology-bem/

JavaScript

  • https://github.com/necolas/idiomatic-js