Coding Quality Standards for JavaScript Frameworks

Coding quality standards are coding conventions designed to produce high-quality code that is easily readable by others who are doing code reviews or stumble across your code later in its lifetime. When code is written to standard naming and writing conventions, it makes it easier to follow. When these conventions are clear and logical, then it can lead to higher quality code, in regards to readability and changes to, or further building upon the code.

Coding conventions really are up to the workplace. Every different workplace that you encounter may do things a little differently, particularly in their guidelines for naming components, methods, attributes, variables, file structure, etc.

We often think about overarching coding conventions, or style guides, when it comes to a base language (in this case, JavaScript), however, it also can be extremely useful to follow a set of conventions when we are working with a particular framework or library to make it more tidy and intelligible.

What we provide here is a short brief on some standards that we’ve found for a few of the most popular JavaScript frameworks.

‍React

‍React does not have a formal style guide laid out by the community, as people are still converging on an agreed upon set of guidelines to follow. There has been some discussion from various parties such as this piece, Our Best Practices for Writing React Components, and this one, A Better File Structure For React/Redux Applications, and An Opinionated Guide To React.js Best Practices And Conventions.

‍Angular / Angular 2

‍Angular comes with its very own style guide for developers to follow. This makes it easy for developers to work on projects across different organizations in the same manner. However, others still have style guides they prefer to follow or to extend on Angular’s style guide, such as John Papa’s guide to Angular 2, which has also been endorsed by the Angular team.

‍Vue

‍There are fewer style guides available for Vue.js than there are for other popular frameworks. This is perhaps because the community as a whole is not as large as some others. Pablo Silva’s guide is a well laid out and, more importantly, well thought out guide for developers to follow and adopt as they wish.

If you’re currently working with a framework other than the big 3, then a quick Google search of your_framework + “style guide” can help immensely with finding a repeatable way of styling your code and files.

Ultimately, the way that you write and structure code is up to you, or your workplace. If your workplace does not have a formal specification, it is recommended to follow one of the style guides above, or come up with one to follow along with your fellow devs. Chat about it in meetings and with management, as an agreed upon structure makes it easier for everyone involved.