DEV Community

Gloria Asuquo
Gloria Asuquo

Posted on

Javascript Style Guides

A style guide contains general rules about how to write code. They could include a better way to indent, where to place a function etc.

Here is a list of JavaScript Style Guides to checkout:

●Google JavaScript Style Guide
🔗https://google.github.io/styleguide/jsguide.html
●Airbnb JavaScript Style Guide
🔗https://github.com/airbnb/javascript
●Idiomatic.JS
🔗https://github.com/rwaldron/idiomatic.js
●StandardJS
🔗 https://standardjs.com/
Enter fullscreen mode Exit fullscreen mode

Top comments (10)

Collapse
 
darkwiiplayer profile image
𒎏Wii 🏳️‍⚧️

I find it hard to take any style guide seriously that thinks spaces are a proper way of indenting code.

Collapse
 
amiceli profile image
amiceli

I agree, but it's good basics. For example in my company we use AirBnB style guide but, without semi colon ;)

Collapse
 
glowreeyah profile image
Gloria Asuquo

I find it wild to not use semi colon in my code

Thread Thread
 
darkwiiplayer profile image
𒎏Wii 🏳️‍⚧️

What's the point of typing extra clutter that adds no value to the code?

Collapse
 
joelbonetr profile image
JoelBonetR 🥇 • Edited
A style guide contains general rules about how to write code. They could include a better way to indent, where to place a function etc.

I'd better define them like that:

Style guides contain general rules about how the code should look like. Those rules are opinionated with few to zero basis on anything. They are not meant to solve any issue other than having a project's entire codebase looking the same way, thus reducing the fatigue of devs involved on it.

As personal opinion on that, you should just stick to what the project states for the reason above, use Prettier (VSCode extension) with format on save enabled to avoid having to learn the style guides on each project you jump into, thus being released of that styling job which can be automated easily.

This way you code once with your own style and it gets formatted when saving according to the defined styles (usually in a Prettier.rc or an ESLint.rc file).

i.e. If your opinion is that using tabs is better than using spaces then use tabs always, if the project has spaces in the config, prettier will handle that for you. In your own projects you can set it to tabs and code the same way.


Didn't bring a linter but a lantern 🤷🏽‍♂️😅

Collapse
 
glowreeyah profile image
Gloria Asuquo

Thank you for sharing

Collapse
 
yuridevat profile image
Julia 👩🏻‍💻 GDE • Edited

Thanks for sharing, Gloria. I didn't know about them, but they this is actually very useful at my current stage, so thank you!!

Collapse
 
glowreeyah profile image
Gloria Asuquo

You're welcome
I'm glad you find it helpful

Collapse
 
amiceli profile image
amiceli

I did not know Iomatic.JS and there are very useful rules. Thanks for sharing ;)

Collapse
 
glowreeyah profile image
Gloria Asuquo

It's my pleasure