the why, what, and how
of the ISP boilerplate

http://xiw.cx/isp-bp

problemS

 

Every project requires integration with various vendor libraries (e.g. registration package, comments).

Without a CMS this work was being done over and over, typically creating lots of bugs right before a project had to launch

A SOLUTION

 

www.preview.nationalgeographic.com/specialprojects/boilerplate/

 

A living baseline of code that can be:

 

  • verified through the Quality Assurance process
  • used at the start of a project, to highlight conflicts throughout development
  • improved over time

DIagram: HOW THIngs fit together

 

MORTAR

MORTAR IS...

  • a living styleguide
  • a custom framework of UI patterns branded for NGS
  • a usable collection of CSS, Javascript, and HTML examples
  • like Twitter Bootstrap or Zurb Foundation, but built and maintained in house

IN an ideal world

 

Mortar handles form while the Boilerplate takes care of function.

The Boilerplate may fill in a few gaps.

Two flavors of boilerplate

template & static

Boilerplate Template

Text

TRADitional CMS

BOilerplate template uses jekyll
A static site generator

Template Pros

  • organized, readable code through tempating
  • change a few variables to update social and comments
  • minification and concatenation of css and javascript
  • minification of html
  • optimization of images
  • file revving automatically breaks the cache
  • watch task compiles and reloads as you work

Template cons

  • familiarity with liquid templating language, jekyll static site generator, and the command line interface

Title Text

Comments
Templating

Boilerplate Static

Boilerplate static

Provides working test code without an opinionated development workflow or environment

Kept in sync with the template branch at all times

QUESTIONS?

ISP Boilerplate

By welch canavan

ISP Boilerplate

  • 1,300