Variables/Data

• Variable names
  • lowerCamelCase
• Constant names
  • UPPER_SNAKE_CASE
  • This includes environment variables
• No magic numbers
  • Always use constants where applicable
  • If you find yourself changing the same value in multiple places it should probably be a constant
• JSON key names
  • lower_snake_case for constant values (e.g. data returned by API)
  • lowerCamelCase if using them in a similar way to const and let
• DON'T USE var
• Always use const if the value won't change
• Otherwise use let

---

Functions

• Function names
  • Should be short and descriptive (indicative of what function does)
  • Don't add 'function' on the end of the function name
  • e.g. getData(), not getDataFunction()
• Function declarations
  • Named arrow functions where possible
    • e.g. const func = (x, y) => { ... }
  • Otherwise use function keyword assigned to a const
    • e.g. const func = function (x, y) { ... }
    • This is most similar to the arrow function so makes it uniform/easy to read
• Avoid anonymous functions where possible (function names are useful for error tracing and indicating what it does)
  • Exception to this is for callback functions

---

Brackets

• Put opening curly brackets on the same line of if, for and while, not on a new line
• Always use curly braces, even if one statement follows the if, for, while, etc.
• Be smart when using brackets for compound if conditions -> Make it READABLE

---

Errors

• Use err for naming the error when catching it
• Throw meaningful error messages

---

Code Layout

• Put imports at the top
• Put constants/variable declarations below imports
• Put the entry point of the program at the bottom (e.g. main())
• Put the first method called by main() at the top below the constants
• Put called methods below the caller
• Use semicolons (although Prettier should automatically add these when you auto-format)

---

Comments

• Don't commit commented out code to master, unless it's for a very good reason

---

React

• Use functions, not classes, to make React components
• Use useState() to handle state