DEV Community

loading...

There is no official style guide for React

metamn
design and code
Originally published at metamn.io on ・1 min read

And we clearly miss it.

Style guides

Style guides associated with programming languages enhance code quality and code reuse.

When code follows a style guide it is easy to understand and to extend by anybody else who also follows the same style guide.

Usually a style guide incorporates industry best practices. It does without doubt, thus adopted by many, offering a true relief for its users.

React, unfortunately, has no official style guide provided by Facebook. This role is taken voluntarily by AirBnb, and it is questionable.

Just some bits:

  • Use .jsx as file extension instead of .js — a suggestion with doubt, against the gut, at least for me personally.
  • Pass params as list instead of array, which contradicts the loose coupling general coding principle.
// bad
function getFullName(user) {
  const firstName = user.firstName;
  const lastName = user.lastName;

  return `${firstName} ${lastName}`;
}

// good
function getFullName(user) {
  const { firstName, lastName } = user;
  return `${firstName} ${lastName}`;
}

// best
function getFullName({ firstName, lastName }) {
  return `${firstName} ${lastName}`;
}

As a conclusion I do not use any styleguide for now. I rather wait for the official styleguide to come out.

It’s not that the AirBnb styleguide is wrong. The fact is that even React itself doesn’t stick to it.

Update

Resources

Discussion (0)