# Improving Frontend Code Quality and Workflow

DevFeed: [Improving Frontend Code Quality and Workflow](<https://devfeed.tech/articles/improving-frontend-code-quality-and-workflow-19697.md>)

Original publisher: [Read original article](<https://word.bitly.com/post/37725436365>)

Author: Wordbitly

Published: 2012-12-11T18:45:27Z

Content type: tutorial

Language: en

Sources: [Bitly](<https://devfeed.tech/sources/bitly.md>)

Topics: [Front end](<https://devfeed.tech/topics/frontend.md>), [Code quality](<https://devfeed.tech/topics/code-quality.md>), [JavaScript](<https://devfeed.tech/topics/javascript.md>), [Refactoring](<https://devfeed.tech/topics/refactoring.md>), [modules](<https://devfeed.tech/topics/modules.md>), [engineering-culture](<https://devfeed.tech/topics/engineering-culture.md>)

Tags: [code-quality](<https://devfeed.tech/tags/code-quality.md>), [code-review](<https://devfeed.tech/tags/code-review.md>), [coding](<https://devfeed.tech/tags/coding.md>), [coding-style](<https://devfeed.tech/tags/coding-style.md>), [consistency](<https://devfeed.tech/tags/consistency.md>), [frontend](<https://devfeed.tech/tags/frontend.md>), [maintainability](<https://devfeed.tech/tags/maintainability.md>), [refactoring](<https://devfeed.tech/tags/refactoring.md>)

## AI overview

A Bitly frontend engineer describes improving code quality and workflow by introducing shared JavaScript style conventions, evaluating tools and libraries, and adopting CoffeeScript for new frontend code. The article explains how consistent patterns can improve code readability, onboarding, and maintainability.

## Source excerpt

When I started at Bitly as a Frontend Engineer, we were about to launch the new bitly. It was exciting to be so close to a product launch and we were cranking out lots of code each day. It took me a few days to get my bearings in the sprawling codebase and I saw lots of opportunity for refactoring, cleanup, and style normalization as well as some architectural concepts we weren't leveraging. Product launch mode kept us from doing house keeping for the next few months after we released the new product as we collected feedback and iterated on several designs/functionalities. Once we had a chance to take a step back and regroup, I saw that we could be more productive if we invested in a common JavaScript style (both syntax and module level patterns) and re-evaluated which libraries we were leveraging to build the site. When we decided the next feature work would be on save/share modal dialogs, I used this as an opportunity to evaluate my new picks for tools and libraries. The result was a success and allowed us to adopt the new tools and libraries for all new features (see Easily Save and Share the Links You Love). Keep reading to see what tools we ended up using to make us more productive! Coding style guidelines If you've seen frontend JavaScript codebases older than six months with two or more developers working on them, you've seen how hard it is to enforce style. The goal of a style guide (and code conventions in general) is to reduce the amount of friction when switching between different modules in a codebase and increase the consistency and readability of code. If every module follows the same patterns, you can easily get your bearings in code written by your coworkers. Every team should have a common style that is enforced in code review and ideally written in a document that can be referred to for new hires. For JavaScript at Bitly, we mostly use the Google Style Guide without the JSDoc and with a variation that non-method variables are lowercase_with_undersc