JavaScript and HTML Code Style Guide

Spacing/tabs

4 spaces (no tabs)

Console.logs

console.error and console.warn are ok but no console.logs (even if commented out) debugging

Braces

On same line except when line continuation and then brace on line by itself outdented to line up with start of original line. Example:

if (curStaging.nStage.coding.displayText.length === 0
        && var1
        && var2
) {
    // Code
}

Variables

Use let for variables that will be changing and const for variables that won't.

Strings

Open Question: We need to decide on a singlequote-vs-doublequote-vs-backquote converion.

Template Literals vs. String Expression

Open Question: We need to decide on which of these two we prefer in our ES6 code.

Functions

Function names are camel case with lower case starting letter

If a function is intended only for use within the class, start it with an underscore then lower case letter

Only spaces after commas in argument list and after close paren but before brace E.g. getTumorSizeString(curStaging) {

Use public class field syntax for binding functions - ex. handleChange = () => { ... };

Semi-colons

Semi-colons should be used at end of every line

Imports

Group like imports (e.g., material UI components, react, flux-specific, styling, etc.) but no introductory comment Styling should always be last (import of css)

Compiler Warnings

No compiler warnings. Eliminate runtime warnings as much as possible (may be from a reused component)

HTML Styling

First choice is always a CSS file named the same as the react component it styles.

Inline styling is typically required by Material UI components

CSS class names and HTML element ids should use all lowercase with dashes

ES6 Class names camel case starting with cap letter

JIRA: Create linter that can be run manually on selected code files

Dates

Make sure all date formatting and parsing is done using moment library instead of custom formatting functions. If you see any legacy cases of this in code you are editing, please replace them or add a JIRA to do it.

Questions?

Should we be using single quotes vs. double quotes for strings?