Front-end Architecture Outline

The purpose of this outline is to help build an outline of the Front-end architecture to be used by a project.

The goal is not to determine which framework or approach is better, but to define in clear terms how your web app will be constructed.

What's needed

• Fleshing out of all the various options for each category. I've tried to include a couple of examples on each, but it's by no means complete.
• Linking to articles and resources for more details on each category.
• Addition of new categories that are missing.

General

VCS

• Git
• Subversion

Code Repository Location

• GitHub
• BitBucket

Integration Testing Tool

• Selenium
• BAS
• Cucumber.js

Testing Tools

• Sauce Labs

API's for Data

• [URL's to API's]
• [Docs on API's]

Build System

• Grunt

Browser Support

• IE 7-Latest
• Chrome Latest

Resources

• [Link to browser usage information]
• [Link to caniuse.com

HTML

Templating Library

• Mustache
• Handlebars
• Smarty, etc
• HAML
• Jade

Style Guide

• http://google-styleguide.googlecode.com/svn/trunk/htmlcssguide.xml#HTML_Style_Rules

CSS

Folder/File Organization

Style Guides

Articles

• CSS Style Guides - CSS Tricks

The List

• Idiomatic CSS

Naming Conventions

• SMACSS
• OOCSS
• BEM

Unit Testing Tool

• Overview
• Hardy

Pre-processor

• Less
• Sass
• Stylus

Pattern Library

• Pure.css
• Bootstrap

Documentation Tool

• CSSDoc
• KSS
• Style Docco

Articles

On CSS Documentaiton

JavaScript

Style Guide

Unit Testing Tool

• Jasmine
• Mocha
• YUI Test

Functional Testing tool

• Karma
• Yeti

Logging Infrastructure

• http://mixu.net/minilog/
• http://pimterry.github.io/loglevel/

MV* Framework

Resources

• [TodoMVC.com](http://todomvc.com]
• Journey Through The JavaScript MVC Jungle

Frameworks

• Angular
• Backbone
• Ember.js
• Knockout.js
• YUI3

Other Libraries

• Modernizr
• Moment.js

Compiler

• None
• CoffeeScript
• Dart

Documentation Tool

• YUIDoc
• Selleck
• JSDoc 3

Module Loader

• Require.js
• YUI3