Skip to main content

Code Guidelines

Variable naming​

Avoid shorthand for variables. Always try to use descriptive, full names for variables.

Exceptions might be common shorthand like i, idx, ctx, txn, elem, e, err, etc.

const comp = e.target;               ❌  

const clickedComponent = e.target;   ✅

Exhaustive deps​

Always adhere to exhaustive deps.

Props​

Try to ensure that variables don't change names as they're passed as props within your own components.

Mutation​

Don't mutate props (except by setters, i.e. setState(value) ).

Don't mutate variables in the body of a function component, unless they're in the scope of another function.

Hook Formatting​

useEffect(()=>{},[])

useEffect(()=>{
    // code
},[]);

cosnt something = useCallback(
    ()=>{

    },
    []
)

const something = useCallback(()=>{
    // code
},[]);

Anonymous Values​

Always provide a comment or variable for anonymous values.

const something = myVariable * 3.14;               ❌

const something = myVariable * 3.14; // times pi   ✅

const PI = 3.14
const something = myVariable * PI;                 ✅