{"id":3524,"date":"2019-04-14T08:51:00","date_gmt":"2019-04-14T08:51:00","guid":{"rendered":"http:\/\/the-codest.localhost\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/"},"modified":"2026-04-24T11:32:09","modified_gmt":"2026-04-24T11:32:09","slug":"quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project","status":"publish","type":"post","link":"https:\/\/thecodest.co\/en\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/","title":{"rendered":"Quality first! 5 easy steps to lint your code with GitHub workflows in JavaScript project"},"content":{"rendered":"\n<p>What should we do, when the <a href=\"https:\/\/thecodest.co\/en\/dictionary\/why-do-projects-fail\/\">project<\/a> is small or the customer still doesn\u2019t know if it\u2019s worth investing more? Obviously, at the <strong><a href=\"https:\/\/thecodest.co\/blog\/product-building-with-mvp-why-is-this-worth-implementing\/\">MVP stage of the project<\/a><\/strong>, <a href=\"https:\/\/thecodest.co\/en\/dictionary\/what-is-code-refactoring\/\">code<\/a> styling or unit tests are not the top priority. Investors usually want to have a good <a href=\"https:\/\/thecodest.co\/en\/dictionary\/how-to-make-product\/\">product<\/a> and c\u2019mon &#8211; if it works, it doesn\u2019t need testing, right?<\/p>\n\n\n\n<p>Actually, I have some experience in <strong><a href=\"https:\/\/thecodest.co\/contact\">building apps from scratch<\/a><\/strong>, even without using best practices in the first place. Some business circumstances forced me to look for the compromise between an investor\u2019s budget plans and the developer\u2019s \u201enice-to-have\u201d list. Thankfully, if you use GitHub, most of the common issues related to code quality can be solved in a few minutes.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>In this article, I\u2019m gonna show you how to use GitHub workflows in the Node.js environment to standardize your codebase.<\/strong><\/h2>\n\n\n\n<p>Few assumptions before we start:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>You are familiar with NPM and Linux console.<\/li>\n\n\n\n<li>You have some experience with style preprocessors, module loaders, bundlers, etc.<\/li>\n\n\n\n<li>You know what linters are for and really want to use them in your projects.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>1. Typical JavaScript project structure<\/strong><\/h2>\n\n\n\n<p>If you ever used some <a href=\"https:\/\/thecodest.co\/en\/blog\/javascript-tools-in-action\/\">JS<\/a> frameworks like <a href=\"https:\/\/thecodest.co\/en\/blog\/hire-vue-js-developers\/\">Vue<\/a> or <a href=\"https:\/\/thecodest.co\/en\/blog\/conditional-component-visibility-in-react\/\">React<\/a>, you can easily spot some common things between them, e.g.:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><em>\/src<\/em> directory with all your JS logic and components,<\/li>\n\n\n\n<li><em>\/test<\/em> directory for unit and e2e tests,<\/li>\n\n\n\n<li><em>\/assets<\/em> directory for styles, images, etc.<\/li>\n<\/ul>\n\n\n\n<p>Even if we are talking about <a href=\"https:\/\/thecodest.co\/en\/blog\/hire-javascript-developer\/\">JavaScript<\/a> project, we work in <a href=\"https:\/\/thecodest.co\/en\/dictionary\/what-is-node-js-used-for\/\">Node<\/a> environment, so obviously there should be also some Node stuff like <em>package.json<\/em>, <em>package-lock.json<\/em> and <em>\/node_modules<\/em> catalog in our root directory.<\/p>\n\n\n\n<p>All these things are in their place &#8211; that&#8217;s what we call the <strong>convention<\/strong>. Frameworks are invented to provide some reasonable conventions, so usually, we don&#8217;t even need to care about the initial design pattern. As in this example, I want to explain some approaches, I won&#8217;t apply any ready-to-use solutions like Vue CLI.<\/p>\n\n\n\n<p><strong>Time to understand what&#8217;s lying under all these magic lint scripts!<\/strong><\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>2. Extending the typical Node project<\/strong><\/h2>\n\n\n\n<p>To provide high-quality solutions, linters are the first thing we should start with while setting up a new project. Let\u2019s focus on two linters &#8211; Stylelint for styles (<em>*.scss<\/em>) and ESLint for source files (<em>*.js<\/em>). Both of these linters are available on NPM and pretty easy to configure. Using linters requires going through the installation process, adding config files and defining project scripts. Let\u2019s do it step-by-step.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>3. Adding Stylelint<\/strong><\/h2>\n\n\n\n<p>The installation of Stylelint in the Node environment is really simple. According to <a href=\"https:\/\/stylelint.io\/user-guide\/get-started\">official docs<\/a>, you just need to run:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"bash\" class=\"language-bash\">npm install --save-dev stylelint stylelint-config-standard<\/code><\/pre>\n\n\n\n<p>and wait until it\u2019s done.<\/p>\n\n\n\n<p><em>stylelint-config-standard<\/em> provides a default set of linting rules and can be replaced with any package which suits your needs better (e.g. <a href=\"https:\/\/www.npmjs.com\/package\/stylelint-config-airbnb\">Airbnb style<\/a>). Then create a new hidden file <em>.stylelintrc.json<\/em>, which is Stylelint configuration file, responsible for loading our pre-defined rules:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\">{\n    \"extends\": \"stylelint-config-standard\"\n}<\/code><\/pre>\n\n\n\n<p>Right now, the only missing thing is some NPM script (or scripts) declared in package.json file to start linting our SCSS files. Here is my proposition:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\">\"scripts\": {\n    \"lint:scss\": \"stylelint '**\/*.scss' --syntax scss -f verbose --color\",\n    \"lint:scss:fix\": \"stylelint '**\/*.scss' --syntax scss --fix -f verbose \u2014color\"\n}<\/code><\/pre>\n\n\n\n<p>As you can see, I\u2019ve declared the script containing <strong>\u2014fix<\/strong> option &#8211; this one is to use before pushing changes to repository.<\/p>\n\n\n\n<p><strong>Remember &#8211; it\u2019s a bad practice to use <em>\u2014fix<\/em> in your CI flow, because then the code you pass to production is not styled correctly in the repository.<\/strong> That\u2019s why we need both of the scripts.<\/p>\n\n\n\n<p>Let\u2019s test our linter by creating a file <em>\/assets\/scss\/styles.scss<\/em> with some content, like:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"css\" class=\"language-css\">body {\n                    background-color: #fff;\n}<\/code><\/pre>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"bash\" class=\"language-bash\">npm run lint:scss<\/code><\/pre>\n\n\n\n<p>You should see in your console something like this:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"bash\" class=\"language-bash\">&gt; stylelint '**\/*.scss' --syntax scss -f verbose --color\n\nassets\/scss\/styles.scss\n\n2:21  \u2716 Expected indentation of 2 spaces   indentation\n\n1 source checked\n\n~\/Codest\/Projects\/github-workflow-demo\/assets\/scss\/styles.scss\n\n1 problem found\n\nseverity level \"error\": 1\n\nindentation: 1\n\nnpm ERR! code ELIFECYCLE\n\nnpm ERR! errno 2\n\nnpm ERR! github-workflow-demo@1.0.0 lint:scss: `stylelint '**\/*.scss' --syntax scss -f verbose --color`\n\nnpm ERR! Exit status 2<\/code><\/pre>\n\n\n\n<p>This actually means that our linter works!<\/p>\n\n\n\n<p>The output shows exactly which line causes an error and describes the issue to solve. Some issues are not fixable automatically as they need a developer\u2019s decision, but in the majority of cases, you just need to run the same command with <strong>\u2014fix<\/strong> option, so let\u2019s run it.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"bash\" class=\"language-bash\">npm run lint:scss:fix<\/code><\/pre>\n\n\n\n<p>Now you should see green output with no errors found:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"bash\" class=\"language-bash\">stylelint '**\/*.scss' --syntax scss --fix -f verbose --color\n\n\n1 source checked\n\n\/Users\/wojciechbak\/Codest\/Projects\/github-workflow-demo\/assets\/scss\/styles.scss\n\n0 problems found<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>4. Adding ESLint<\/strong><\/h2>\n\n\n\n<p>This step is almost the same as the one before. We&#8217;re gonna install ESLint, define some default rules set and declare two callable NPM scripts &#8211; one for CI, one for pre-push. Let&#8217;s go through this!<\/p>\n\n\n\n<p>If you use NPM in your daily work, perhaps you&#8217;d like to install ESLint globally. If you don&#8217;t, please check the installation instructions in <a href=\"https:\/\/eslint.org\/docs\/user-guide\/getting-started\">official docs<\/a>.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"bash\" class=\"language-bash\">npm install -g eslint<\/code><\/pre>\n\n\n\n<p>When eslint command is available on your machine, just run this in your project:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"bash\" class=\"language-bash\">eslint --init<\/code><\/pre>\n\n\n\n<p>Following further instructions displayed in your terminal, just make a few project decisions like:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Javascript or <a href=\"https:\/\/thecodest.co\/en\/dictionary\/typescript-developer\/\">TypeScript<\/a><\/li>\n\n\n\n<li>Airbnb style or Google style<\/li>\n\n\n\n<li>configuration type (JSON file, JS file or inline in <em>package.json<\/em>)<\/li>\n\n\n\n<li>ES modules (<em>import\/export<\/em>) or <em>require<\/em> syntax<\/li>\n<\/ul>\n\n\n\n<p>In this place it\u2019s worth to write a word about code formatter called Prettier. It\u2019s fully standardized and compatible with most of code editors (e.g. VS Code). Prettier provides many sets of predefined code styling rules, co-works with linters and can be a great support in chasing top quality of the code. To understand what exactly Prettier is, visit this <a href=\"https:\/\/prettier.io\/docs\/en\/comparison.html\">comparison<\/a> from official docs.<\/p>\n\n\n\n<p>If it&#8217;s done, ESlint config file (e.g. <em>.eslintrc.json<\/em>, depending on what you&#8217;ve chosen before) should appear in your root directory, somewhere next to <em>.stylelintrc.json<\/em> created before.<\/p>\n\n\n\n<p>Now we have to define scripts in <em>package.json<\/em> file, same as for SCSS files:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\">\"scripts\": {\n    \"lint:js\": \"eslint '**\/*.js' --ignore-pattern node_modules\/\",\n    \"lint:js:fix\": \"eslint '**\/*.js' --ignore-pattern node_modules\/ --fix\"\n}<\/code><\/pre>\n\n\n\n<p>Congrats! ESLint is ready to use right now. Let&#8217;s check if it works correctly. Create <em>\/src\/index.js<\/em> file with some content:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\">console.log(\"something\");<\/code><\/pre>\n\n\n\n<p>Run linter:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"bash\" class=\"language-bash\">npm run lint:js<\/code><\/pre>\n\n\n\n<p><code><br><\/code>The output should look like this:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"bash\" class=\"language-bash\">&gt; eslint '**\/*.js' --ignore-pattern node_modules\/\n\n~\/Codest\/Projects\/github-workflow-demo\/src\/index.js\n\n1:1  warning  Unexpected console statement  no-console\n\n\u2716 1 problem (0 errors, 1 warning)<\/code><\/pre>\n\n\n\n<p>This warning won&#8217;t disappear after using <em>&#8211;fix<\/em> option, because <strong>linters doesn&#8217;t affect potentially meaningful code. They are only for code styling<\/strong>, including white-spaces, newlines, semicolons, quotation marks etc.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>5. Defining GitHub workflows<\/strong><\/h2>\n\n\n\n<p><a href=\"https:\/\/help.github.com\/en\/actions\/configuring-and-managing-workflows\/configuring-a-workflow\">GitHub workflows<\/a> are a pretty well-documented thing. Feel free to dig deeper into this, but for now, I&#8217;m gonna implement a simple workflow to lint our code after the push to the remote repository (obviously, hosted on GitHub).<\/p>\n\n\n\n<p>Create <em>\/.github\/workflows<\/em> directory and new <em>code-quality-workflow.yml<\/em> file in there as GitHub workflows have to be defined with YAML files.<\/p>\n\n\n\n<p>To run a proper workflow, we have to answer a few questions:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>When do we want to run our workflow (on push, on pull request, on merge etc.)?<\/li>\n\n\n\n<li>Do we want to exclude some situations (like push to branch master)?<\/li>\n\n\n\n<li>What environment do we need to setup to run our commands correctly (in this example &#8211; Node)?<\/li>\n\n\n\n<li>Do we need to install dependencies? If so, how should we cache it?<\/li>\n\n\n\n<li>What steps do we need to make to complete the check?<\/li>\n<\/ul>\n\n\n\n<p>After some considerations and few hours of work with docs example <em>.yml<\/em> file can look like this:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"yaml\" class=\"language-yaml\">name: Code quality\n\non: 'push'\n\njobs:\n  code-quality:\n    name: Lint source code\n    runs-on: ubuntu-latest\n    steps:\n    - uses: actions\/checkout@v1\n\n    - name: Setup Node\n      uses: actions\/setup-node@v1\n      with:\n        node-version: '12.1'\n\n    - name: Cache dependencies\n      uses: actions\/cache@v1\n      with:\n        path: .\/node_modules\n        key: $(( runner.OS ))-dependencies-$(( hashFiles('<strong>**\/package-lock.json')<\/strong> ))\n        restore-keys: |\n          $(( runner.OS ))-dependencies-$(( env.cache-name ))-\n          $(( runner.OS ))-dependencies-\n          $(( runner.OS ))-\n\n    - name: Install dependencies\n      run: |\n        npm install\n\n    - name: Lint files\n      run: |\n        npm run lint<\/code><\/pre>\n\n\n\n<p>GitHub provides all environmental stuff we need. In the last line we&#8217;re running command <strong><em>npm run lint<\/em><\/strong> which was not defined before:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\">\"scripts\": {\n    \"lint\": \"npm run lint:js &amp;&amp; npm run lint:scss\"\n}<\/code><\/pre>\n\n\n\n<p>Note that in our workflow I&#8217;m not using <strong>:fix<\/strong> commands.<\/p>\n\n\n\n<p>When all these steps are done, you can enjoy this beautiful output from GitHub before merging your Pull Request: <img decoding=\"async\" src=\"https:\/\/camo.githubusercontent.com\/ec82df2be0b1977d857d5f5c1d2d893010fc44a4\/68747470733a2f2f692e696d6775722e636f6d2f425848465370372e706e67\" alt=\"\"> <img decoding=\"async\" src=\"https:\/\/camo.githubusercontent.com\/00e93d296b7bf5b089c7b785ecc1cbd18de54ead\/68747470733a2f2f696d6775722e636f6d2f6f63736e6762362e706e67\" alt=\"\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Code quality is a crucial part of the development process, especially when you want to work efficiently in a long-term manner. There are many approaches and best practices, including whole agile methodologies stuff, but most of them relate to some big, enterprise project conducted by at least 6 people.<\/p>\n","protected":false},"author":2,"featured_media":3525,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[8],"tags":[],"class_list":["post-3524","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-software-development"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v27.3 (Yoast SEO v27.3) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Quality first! 5 easy steps to lint your code with GitHub workflows in JavaScript project - The Codest<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/thecodest.co\/en\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Quality first! 5 easy steps to lint your code with GitHub workflows in JavaScript project\" \/>\n<meta property=\"og:description\" content=\"Code quality is a crucial part of the development process, especially when you want to work efficiently in a long-term manner. There are many approaches and best practices, including whole agile methodologies stuff, but most of them relate to some big, enterprise project conducted by at least 6 people.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/thecodest.co\/en\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/\" \/>\n<meta property=\"og:site_name\" content=\"The Codest\" \/>\n<meta property=\"article:published_time\" content=\"2019-04-14T08:51:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-04-24T11:32:09+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/thecodest.co\/app\/uploads\/2024\/05\/cover-image-137.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1920\" \/>\n\t<meta property=\"og:image:height\" content=\"1080\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"thecodest\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"thecodest\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\\\/\"},\"author\":{\"name\":\"thecodest\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/#\\\/schema\\\/person\\\/7e3fe41dfa4f4e41a7baad4c6e0d4f76\"},\"headline\":\"Quality first! 5 easy steps to lint your code with GitHub workflows in JavaScript project\",\"datePublished\":\"2019-04-14T08:51:00+00:00\",\"dateModified\":\"2026-04-24T11:32:09+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\\\/\"},\"wordCount\":1187,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/thecodest.co\\\/app\\\/uploads\\\/2024\\\/05\\\/cover-image-137.jpg\",\"articleSection\":[\"Software Development\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/thecodest.co\\\/blog\\\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\\\/\",\"url\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\\\/\",\"name\":\"Quality first! 5 easy steps to lint your code with GitHub workflows in JavaScript project - The Codest\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/thecodest.co\\\/app\\\/uploads\\\/2024\\\/05\\\/cover-image-137.jpg\",\"datePublished\":\"2019-04-14T08:51:00+00:00\",\"dateModified\":\"2026-04-24T11:32:09+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/thecodest.co\\\/blog\\\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\\\/#primaryimage\",\"url\":\"https:\\\/\\\/thecodest.co\\\/app\\\/uploads\\\/2024\\\/05\\\/cover-image-137.jpg\",\"contentUrl\":\"https:\\\/\\\/thecodest.co\\\/app\\\/uploads\\\/2024\\\/05\\\/cover-image-137.jpg\",\"width\":1920,\"height\":1080},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/thecodest.co\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Quality first! 5 easy steps to lint your code with GitHub workflows in JavaScript project\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/#website\",\"url\":\"https:\\\/\\\/thecodest.co\\\/\",\"name\":\"The Codest\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/thecodest.co\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/#organization\",\"name\":\"The Codest\",\"url\":\"https:\\\/\\\/thecodest.co\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/thecodest.co\\\/app\\\/uploads\\\/2024\\\/03\\\/thecodest-logo.svg\",\"contentUrl\":\"https:\\\/\\\/thecodest.co\\\/app\\\/uploads\\\/2024\\\/03\\\/thecodest-logo.svg\",\"width\":144,\"height\":36,\"caption\":\"The Codest\"},\"image\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/pl.linkedin.com\\\/company\\\/codest\",\"https:\\\/\\\/clutch.co\\\/profile\\\/codest\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/#\\\/schema\\\/person\\\/7e3fe41dfa4f4e41a7baad4c6e0d4f76\",\"name\":\"thecodest\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/5dbfe6a1e8c86e432e8812759e34e6fe82ebac75119ae3237a6c1311fa19caf4?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/5dbfe6a1e8c86e432e8812759e34e6fe82ebac75119ae3237a6c1311fa19caf4?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/5dbfe6a1e8c86e432e8812759e34e6fe82ebac75119ae3237a6c1311fa19caf4?s=96&d=mm&r=g\",\"caption\":\"thecodest\"},\"url\":\"https:\\\/\\\/thecodest.co\\\/en\\\/author\\\/thecodest\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Quality first! 5 easy steps to lint your code with GitHub workflows in JavaScript project - The Codest","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/thecodest.co\/en\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/","og_locale":"en_US","og_type":"article","og_title":"Quality first! 5 easy steps to lint your code with GitHub workflows in JavaScript project","og_description":"Code quality is a crucial part of the development process, especially when you want to work efficiently in a long-term manner. There are many approaches and best practices, including whole agile methodologies stuff, but most of them relate to some big, enterprise project conducted by at least 6 people.","og_url":"https:\/\/thecodest.co\/en\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/","og_site_name":"The Codest","article_published_time":"2019-04-14T08:51:00+00:00","article_modified_time":"2026-04-24T11:32:09+00:00","og_image":[{"width":1920,"height":1080,"url":"https:\/\/thecodest.co\/app\/uploads\/2024\/05\/cover-image-137.jpg","type":"image\/jpeg"}],"author":"thecodest","twitter_card":"summary_large_image","twitter_misc":{"Written by":"thecodest","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/thecodest.co\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/#article","isPartOf":{"@id":"https:\/\/thecodest.co\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/"},"author":{"name":"thecodest","@id":"https:\/\/thecodest.co\/#\/schema\/person\/7e3fe41dfa4f4e41a7baad4c6e0d4f76"},"headline":"Quality first! 5 easy steps to lint your code with GitHub workflows in JavaScript project","datePublished":"2019-04-14T08:51:00+00:00","dateModified":"2026-04-24T11:32:09+00:00","mainEntityOfPage":{"@id":"https:\/\/thecodest.co\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/"},"wordCount":1187,"commentCount":0,"publisher":{"@id":"https:\/\/thecodest.co\/#organization"},"image":{"@id":"https:\/\/thecodest.co\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/#primaryimage"},"thumbnailUrl":"https:\/\/thecodest.co\/app\/uploads\/2024\/05\/cover-image-137.jpg","articleSection":["Software Development"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/thecodest.co\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/thecodest.co\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/","url":"https:\/\/thecodest.co\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/","name":"Quality first! 5 easy steps to lint your code with GitHub workflows in JavaScript project - The Codest","isPartOf":{"@id":"https:\/\/thecodest.co\/#website"},"primaryImageOfPage":{"@id":"https:\/\/thecodest.co\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/#primaryimage"},"image":{"@id":"https:\/\/thecodest.co\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/#primaryimage"},"thumbnailUrl":"https:\/\/thecodest.co\/app\/uploads\/2024\/05\/cover-image-137.jpg","datePublished":"2019-04-14T08:51:00+00:00","dateModified":"2026-04-24T11:32:09+00:00","breadcrumb":{"@id":"https:\/\/thecodest.co\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/thecodest.co\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/thecodest.co\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/#primaryimage","url":"https:\/\/thecodest.co\/app\/uploads\/2024\/05\/cover-image-137.jpg","contentUrl":"https:\/\/thecodest.co\/app\/uploads\/2024\/05\/cover-image-137.jpg","width":1920,"height":1080},{"@type":"BreadcrumbList","@id":"https:\/\/thecodest.co\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/thecodest.co\/"},{"@type":"ListItem","position":2,"name":"Quality first! 5 easy steps to lint your code with GitHub workflows in JavaScript project"}]},{"@type":"WebSite","@id":"https:\/\/thecodest.co\/#website","url":"https:\/\/thecodest.co\/","name":"The Codest","description":"","publisher":{"@id":"https:\/\/thecodest.co\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/thecodest.co\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/thecodest.co\/#organization","name":"The Codest","url":"https:\/\/thecodest.co\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/thecodest.co\/#\/schema\/logo\/image\/","url":"https:\/\/thecodest.co\/app\/uploads\/2024\/03\/thecodest-logo.svg","contentUrl":"https:\/\/thecodest.co\/app\/uploads\/2024\/03\/thecodest-logo.svg","width":144,"height":36,"caption":"The Codest"},"image":{"@id":"https:\/\/thecodest.co\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/pl.linkedin.com\/company\/codest","https:\/\/clutch.co\/profile\/codest"]},{"@type":"Person","@id":"https:\/\/thecodest.co\/#\/schema\/person\/7e3fe41dfa4f4e41a7baad4c6e0d4f76","name":"thecodest","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/5dbfe6a1e8c86e432e8812759e34e6fe82ebac75119ae3237a6c1311fa19caf4?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/5dbfe6a1e8c86e432e8812759e34e6fe82ebac75119ae3237a6c1311fa19caf4?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/5dbfe6a1e8c86e432e8812759e34e6fe82ebac75119ae3237a6c1311fa19caf4?s=96&d=mm&r=g","caption":"thecodest"},"url":"https:\/\/thecodest.co\/en\/author\/thecodest\/"}]}},"_links":{"self":[{"href":"https:\/\/thecodest.co\/en\/wp-json\/wp\/v2\/posts\/3524","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/thecodest.co\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/thecodest.co\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/thecodest.co\/en\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/thecodest.co\/en\/wp-json\/wp\/v2\/comments?post=3524"}],"version-history":[{"count":9,"href":"https:\/\/thecodest.co\/en\/wp-json\/wp\/v2\/posts\/3524\/revisions"}],"predecessor-version":[{"id":8622,"href":"https:\/\/thecodest.co\/en\/wp-json\/wp\/v2\/posts\/3524\/revisions\/8622"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/thecodest.co\/en\/wp-json\/wp\/v2\/media\/3525"}],"wp:attachment":[{"href":"https:\/\/thecodest.co\/en\/wp-json\/wp\/v2\/media?parent=3524"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/thecodest.co\/en\/wp-json\/wp\/v2\/categories?post=3524"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/thecodest.co\/en\/wp-json\/wp\/v2\/tags?post=3524"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}