Coding Guidelines

This page gathers a bunch of coding guidelines that every contributor should be aware of.

• Read it carefully before any contribution
• Update it as you take some decision about coding convention or when you see recurrent issues about coding style.

---

JavaScript

1. Black boxes

We use Black Box Driven Development to build this App.

File names

Code is splitted into many javascript files. Each Black Box is contained in a single file, whose name is Black Box' name and begins with a capital letter. Other JS files begins with a small letter.

---

CSS

1. Simplified BEM syntaxe

The basic idea is to have simple building blocks made of sub-blocks, but at only one level of depth to avoid long CSS rules.

The rule layout is then:

.block-name {
}

.block-name--one-subblock-name {
}

.block-name--another-subblock-name {
}

/* etc. */

2. Don't use !important

Clean CSS design don't force the use of !important.

---

General improvements

1. Clean code

Make your code more readable :

• Use 4 spaces for CSS, JS, HTML files.

You can automatise it with Beautifier : https://github.com/beautify-web/js-beautify.

2. Valid code

• Check HTML file with W3C : http://validator.w3.org/
• Check JS file with Lint : https://github.com/douglascrockford/JSLint