Airbnb React style guide rules

The Airbnb React style guide defines tens of well-thought-out rules. This is a great resource and a foundation for your next React project. I highly recommend looking into them. You can find the Airbnb React style guide at https://github.com/airbnb/javascript/tree/master/react.

However, everyone should find their own style. Mine just adapts a few things from the Airbnb:

• comma-dangle: Airbnb advises that you leave a trailing comma at the end of array multiline elements, lists, or object multiline key-value lists. This is not what I'm used to. I prefer the JSON style, which does not leave a trailing comma:

// My preference
const hero = {
  firstName: 'Dana',
  lastName: 'Scully'
};

const heroes = [
  'Batman',
  'Superman'
];

// Airbnb style guide
const hero = {
  firstName: 'Dana',
  lastName: 'Scully',
};

const heroes = [
  'Batman',
  'Superman',
];

• react/jsx-filename-extension: In my opinion, this rule should be changed in the style guide. It tries to convince you to use the .jsx extension for files using JSX. I don't agree with this. I would like to quote Dan Abramov's comment on this matter:

• no-use-before-define: This is a smart rule. It prevents you from using variables and functions that are defined later, besides the fact that the JavaScript hoisting mechanism lets you to do so. However, I like to put my StyleSheets in the bottom on every component file. Hence, I have relaxed this rule to allow usage of variables before their definition.

I also prefer an indentation of four spaces for clarity when I copy snippets into this book.