Skip to content

7. Code Styleguide

designbygio edited this page Oct 20, 2021 · 3 revisions

Javascript

All JavaScript code is linted with Eslint and formatted with Prettier.

Prefer the object spread operator ({...anotherObj}) to Object.assign()

Place requires in the following order:

Built in Node Modules (such as path)
Local Modules (using relative paths)

All the Css are linted with Stylelint and formatted with Prettier.

To create a Css Module, simply call the css file with the component name and then use .module.css extension. If there is not much of style, we include the style in the page or component it self.

Css

  • Always create separate file for your css and include them as Css module with the file name convention: componentname.modue.css
  • Follow mobile-first approach
  • For detailed spacing like margins and paddings, prefer the usage of px
  • Avoid using descendant selectors as they can be expensive. For more info about it: https://medium.com/@devdevcharlie/things-nobody-ever-taught-me-about-css-5d16be8d5d0e
  • We do not use !important rule for any reason. There is always a natural way to make some CSS rules more important than others and we prefer that way.