This pages describes the Wheel code style and naming conventions.

Naming conventions

Files and directories

Directories

• Directory names only contain lowercase letters and numbers.

JavaScript Files

File names use camelcase naming.

• Files which contain a class start with an uppercase
• Files which don't export a class start with a lowercase

JavaScript

Classes

• Classes use camelcase and start with an uppercase

class ThisIsAnExampleClass {
}

Variables

• Variables use camelcase and start with a lowercase
• If a variable is a private field in a class then it starts with an underscore

let myVariable = 14;

class ExampleClass {
    constructor(opts) {
        this._privateField = 'Some value';    
    }
}

Constants

• Constants are written uppercase with underscores

const THIS_IS_A_CONSTANT = 1;

Counters

• In loops, simple counter variables like i, j, k or x, y, z are used.

for (let y = 0; y < 10; y++) {
    for (let x = 0; x < 10; x++) {
    }
}

CSS

Classnames

• Classnames are written in lowercase separated by hyphens (kebab case)

.resource-wrapper {
    float: left;
}

IDs

• IDs use camelcase and start with a lowercase.

#rootContainer {
    float: left;
}

Code style

Javascript

Blank lines

• Functions should not contain blank lines.

Semi colon

• Statements should be terminated with a semi colon.

someVariable = 15; // This statement is terminated by a semi colon.

String

• Strings use a single quote character.

let example = 'This is a string with single quotes.';

Brackets

• Brackets are used Egyptian style

if (condition) {
    // Do something...
} else {
    // Do something else...
}

Indentation

• Indentation is done with four spaces

Comments

• Comments start with an uppercase

// This comment starts with an uppercase...

Parentheses

• A parentheses follows the function name immediately

function getOutputPath() {};

Variable assignment alignment

• When multiple lines contain variable assignments then the "=" character is aligned

someVariable    = 14;
anotherVariable = 'This is a string';

Object declaration

• When an object is declared on multiple lines then the property values are aligned
• An object should not have a dangling last comma
• If it's an object declaration then the first property should have an indention of eight spaces

let someObject = {
        numberProp:        16,
        thisIsAStringProp: 'The value of a string property'
    };

Fluent

• It is preferred to use fluent interfaces when possible
• The first call is made on the next line of the context with each consecutive call on the next line

this
    .doSomething()
    .doAnotherThing();

Last line

• A file should end with an empty line