{"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":"calidad-primeros-5-sencillos-pasos-para-pelusa-su-codigo-con-github-flujos-de-trabajo-en-javascript-proyecto","status":"publish","type":"post","link":"https:\/\/thecodest.co\/es\/blog\/quality-first-5-easy-steps-to-lint-your-code-with-github-workflows-in-javascript-project\/","title":{"rendered":"La calidad ante todo 5 sencillos pasos para eliminar la pelusa de su c\u00f3digo con flujos de trabajo de GitHub en el proyecto JavaScript"},"content":{"rendered":"<p>\u00bfQu\u00e9 debemos hacer cuando el <a href=\"https:\/\/thecodest.co\/es\/dictionary\/why-do-projects-fail\/\">proyecto<\/a> es peque\u00f1o o el cliente a\u00fan no sabe si merece la pena invertir m\u00e1s? Obviamente, en el <strong><a href=\"https:\/\/thecodest.co\/blog\/product-building-with-mvp-why-is-this-worth-implementing\/\">Fase MVP del proyecto<\/a><\/strong>, <a href=\"https:\/\/thecodest.co\/es\/dictionary\/what-is-code-refactoring\/\">c\u00f3digo<\/a> El estilo o las pruebas unitarias no son la m\u00e1xima prioridad. Los inversores suelen querer tener un buen <a href=\"https:\/\/thecodest.co\/es\/dictionary\/how-to-make-product\/\">producto<\/a> y vamos, si funciona, no hace falta probarlo, \u00bfno?<\/p>\n\n\n\n<p>En realidad, tengo algo de experiencia en <strong><a href=\"https:\/\/thecodest.co\/contact\">crear aplicaciones desde cero<\/a><\/strong>incluso sin utilizar las mejores pr\u00e1cticas. Algunas circunstancias empresariales me obligaron a buscar el compromiso entre los planes presupuestarios de un inversor y la lista de \"cosas bonitas\" del desarrollador. Por suerte, si utilizas GitHub, la mayor\u00eda de los problemas habituales relacionados con la calidad del c\u00f3digo pueden resolverse en unos minutos.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>En este art\u00edculo, voy a mostrarte c\u00f3mo utilizar los flujos de trabajo de GitHub en el entorno Node.js para estandarizar tu c\u00f3digo base.<\/strong><\/h2>\n\n\n\n<p>Algunas suposiciones antes de empezar:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Est\u00e1 familiarizado con NPM y la consola Linux.<\/li>\n\n\n\n<li>Tienes alguna experiencia con preprocesadores de estilo, cargadores de m\u00f3dulos, bundlers, etc.<\/li>\n\n\n\n<li>Ya sabe para qu\u00e9 sirven los linters y tiene muchas ganas de utilizarlos en sus proyectos.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>1. Estructura t\u00edpica de un proyecto JavaScript<\/strong><\/h2>\n\n\n\n<p>Si alguna vez has utilizado <a href=\"https:\/\/thecodest.co\/es\/blog\/javascript-tools-in-action\/\">JS<\/a> marcos como <a href=\"https:\/\/thecodest.co\/es\/blog\/hire-vue-js-developers\/\">Vue<\/a> o <a href=\"https:\/\/thecodest.co\/es\/blog\/conditional-component-visibility-in-react\/\">React<\/a>...puedes encontrar f\u00e1cilmente algunas cosas en com\u00fan entre ellos, por ejemplo..:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><em>\/src<\/em> con toda su l\u00f3gica JS y componentes,<\/li>\n\n\n\n<li><em>\/prueba<\/em> para las pruebas unitarias y e2e,<\/li>\n\n\n\n<li><em>\/activos<\/em> para estilos, im\u00e1genes, etc.<\/li>\n<\/ul>\n\n\n\n<p>Aunque estemos hablando de <a href=\"https:\/\/thecodest.co\/es\/blog\/hire-javascript-developer\/\">JavaScript<\/a> proyecto, trabajamos en <a href=\"https:\/\/thecodest.co\/es\/dictionary\/what-is-node-js-used-for\/\">Nodo<\/a> as\u00ed que, obviamente, tambi\u00e9n deber\u00eda haber algunas cosas de Node como <em>paquete.json<\/em>, <em>paquete-lock.json<\/em> y <em>\/node_modules<\/em> en nuestro directorio ra\u00edz.<\/p>\n\n\n\n<p>Todas estas cosas est\u00e1n en su sitio - eso es lo que llamamos el <strong>convenci\u00f3n<\/strong>. Los frameworks se inventan para proporcionar algunas convenciones razonables, por lo que normalmente, ni siquiera necesitamos preocuparnos por el patr\u00f3n de dise\u00f1o inicial. Como en este ejemplo, quiero explicar algunos enfoques, no voy a aplicar ninguna soluci\u00f3n lista para usar como Vue CLI.<\/p>\n\n\n\n<p><strong>Es hora de entender qu\u00e9 se esconde bajo todos estos guiones m\u00e1gicos de pelusa.<\/strong><\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>2. Ampliaci\u00f3n del t\u00edpico proyecto Node<\/strong><\/h2>\n\n\n\n<p>Para proporcionar soluciones de alta calidad, los linters son lo primero con lo que debemos empezar al configurar un nuevo proyecto. Centr\u00e9monos en dos linters - Stylelint para estilos (<em>*.scss<\/em>) y ESLint para archivos fuente (<em>*.js<\/em>). Ambos linters est\u00e1n disponibles en NPM y son bastante f\u00e1ciles de configurar. Usar linters requiere pasar por el proceso de instalaci\u00f3n, a\u00f1adir archivos de configuraci\u00f3n y definir scripts de proyecto. Hag\u00e1moslo paso a paso.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>3. A\u00f1adir Stylelint<\/strong><\/h2>\n\n\n\n<p>La instalaci\u00f3n de Stylelint en el entorno Node es realmente sencilla. Seg\u00fan <a href=\"https:\/\/stylelint.io\/user-guide\/get-started\">documentos oficiales<\/a>S\u00f3lo tienes que correr:<\/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>y esperar a que termine.<\/p>\n\n\n\n<p><em>stylelint-config-standard<\/em> proporciona un conjunto predeterminado de reglas de linting y puede sustituirse por cualquier paquete que se adapte mejor a sus necesidades (p. ej. <a href=\"https:\/\/www.npmjs.com\/package\/stylelint-config-airbnb\">Al estilo Airbnb<\/a>). A continuaci\u00f3n, cree un nuevo archivo oculto <em>.stylelintrc.json<\/em>que es el archivo de configuraci\u00f3n de Stylelint, responsable de cargar nuestras reglas predefinidas:<\/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>Ahora mismo, lo \u00fanico que falta es alg\u00fan script NPM (o scripts) declarado en el archivo package.json para empezar a linting nuestros archivos SCSS. Esta es mi propuesta:<\/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' --sintaxis scss --fix -f verbose -color\"\n}<\/code><\/pre>\n\n\n\n<p>Como puedes ver, he declarado el script que contiene <strong>-fijar<\/strong> Esta opci\u00f3n se utiliza antes de enviar los cambios al repositorio.<\/p>\n\n\n\n<p><strong>Recuerde: es una mala pr\u00e1ctica utilizar <em>-fijar<\/em> en tu flujo de CI, porque entonces el c\u00f3digo que pasas a producci\u00f3n no tiene el estilo correcto en el repositorio.<\/strong> Por eso necesitamos los dos guiones.<\/p>\n\n\n\n<p>Vamos a probar nuestro linter creando un fichero <em>\/activos\/scss\/estilos.scss<\/em> con alg\u00fan contenido, como:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"css\" class=\"language-css\">cuerpo {\n                    color de fondo: #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>Deber\u00edas ver en tu consola algo como esto:<\/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 Sangr\u00eda esperada de 2 espacios sangr\u00eda\n\n1 fuente comprobada\n\n~\/Codest\/Projects\/github-workflow-demo\/assets\/scss\/styles.scss\n\n1 problema encontrado\n\nnivel de gravedad \"error\": 1\n\nsangr\u00eda: 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 \u00a1ERR! Estado de salida 2<\/code><\/pre>\n\n\n\n<p>Esto significa que nuestro linter funciona.<\/p>\n\n\n\n<p>La salida muestra exactamente qu\u00e9 l\u00ednea causa un error y describe el problema a resolver. Algunos problemas no se pueden solucionar autom\u00e1ticamente, ya que necesitan la decisi\u00f3n de un desarrollador, pero en la mayor\u00eda de los casos, basta con ejecutar el mismo comando con <strong>-fijar<\/strong> as\u00ed que vamos a ejecutarlo.<\/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>Ahora deber\u00eda ver una salida verde sin errores encontrados:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"bash\" class=\"language-bash\">stylelint '**\/*.scss' --sintaxis scss --fix -f verbose --color\n\n\n1 fuente comprobada\n\n\/Users\/wojciechbak\/Codest\/Projects\/github-workflow-demo\/assets\/scss\/styles.scss\n\n0 problemas encontrados<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>4. A\u00f1adir ESLint<\/strong><\/h2>\n\n\n\n<p>Este paso es casi el mismo que el anterior. Vamos a instalar ESLint, definir un conjunto de reglas por defecto y declarar dos scripts NPM invocables - uno para CI, otro para pre-push. \u00a1Vamos a ir a trav\u00e9s de esto!<\/p>\n\n\n\n<p>Si utilizas NPM en tu trabajo diario, quiz\u00e1s quieras instalar ESLint de forma global. Si no es as\u00ed, consulte las instrucciones de instalaci\u00f3n en <a href=\"https:\/\/eslint.org\/docs\/user-guide\/getting-started\">documentos oficiales<\/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>Cuando el comando eslint est\u00e9 disponible en su m\u00e1quina, simplemente ejec\u00fatelo en su proyecto:<\/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>Siguiendo las instrucciones que aparecen en tu terminal, s\u00f3lo tienes que tomar algunas decisiones de proyecto como:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Javascript o <a href=\"https:\/\/thecodest.co\/es\/dictionary\/typescript-developer\/\">TypeScript<\/a><\/li>\n\n\n\n<li>Al estilo Airbnb o al estilo Google<\/li>\n\n\n\n<li>tipo de configuraci\u00f3n (archivo JSON, archivo JS o inline en <em>paquete.json<\/em>)<\/li>\n\n\n\n<li>M\u00f3dulos ES (<em>importaci\u00f3n\/exportaci\u00f3n<\/em>) o <em>requiere<\/em> sintaxis<\/li>\n<\/ul>\n\n\n\n<p>En este lugar vale la pena escribir unas palabras sobre el formateador de c\u00f3digo llamado Prettier. Est\u00e1 totalmente estandarizado y es compatible con la mayor\u00eda de los editores de c\u00f3digo (por ejemplo, VS Code). Prettier proporciona muchos conjuntos de reglas predefinidas de estilo de c\u00f3digo, trabaja con linters y puede ser un gran apoyo en la b\u00fasqueda de la m\u00e1xima calidad del c\u00f3digo. Para saber qu\u00e9 es exactamente Prettier, visite este enlace <a href=\"https:\/\/prettier.io\/docs\/en\/comparison.html\">comparaci\u00f3n<\/a> de los documentos oficiales.<\/p>\n\n\n\n<p>Si se hace, el archivo de configuraci\u00f3n de ESlint (p.ej. <em>.eslintrc.json<\/em>dependiendo de lo que hayas elegido antes) deber\u00eda aparecer en tu directorio ra\u00edz, en alg\u00fan lugar junto a <em>.stylelintrc.json<\/em> creado antes.<\/p>\n\n\n\n<p>Ahora tenemos que definir scripts en <em>paquete.json<\/em> igual que para los archivos SCSS:<\/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>\u00a1Enhorabuena! ESLint est\u00e1 listo para usarse ahora mismo. Comprobemos si funciona correctamente. Crear <em>\/src\/index.js<\/em> con alg\u00fan contenido:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\">console.log(\"algo\");<\/code><\/pre>\n\n\n\n<p>Ejecutar 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>El resultado deber\u00eda ser el siguiente:<\/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 Declaraci\u00f3n de consola inesperada no-console\n\n\u2716 1 problema (0 errores, 1 advertencia)<\/code><\/pre>\n\n\n\n<p>Esta advertencia no desaparecer\u00e1 despu\u00e9s de utilizar <em>-fijar<\/em> porque <strong>linters no afecta al c\u00f3digo potencialmente significativo. S\u00f3lo sirven para estilizar el c\u00f3digo<\/strong>incluyendo espacios en blanco, nuevas l\u00edneas, punto y coma, comillas, etc.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>5. Definici\u00f3n de flujos de trabajo de GitHub<\/strong><\/h2>\n\n\n\n<p><a href=\"https:\/\/help.github.com\/en\/actions\/configuring-and-managing-workflows\/configuring-a-workflow\">Flujos de trabajo de GitHub<\/a> son algo bastante bien documentado. Si\u00e9ntase libre de profundizar en esto, pero por ahora, voy a implementar un flujo de trabajo simple para pelusa nuestro c\u00f3digo despu\u00e9s del empuje al repositorio remoto (obviamente, alojado en GitHub).<\/p>\n\n\n\n<p>Cree <em>\/.github\/workflows<\/em> y el nuevo <em>calidad del c\u00f3digo-workflow.yml<\/em> ya que los flujos de trabajo de GitHub deben definirse con archivos YAML.<\/p>\n\n\n\n<p>Para ejecutar un flujo de trabajo adecuado, tenemos que responder a algunas preguntas:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u00bfCu\u00e1ndo queremos ejecutar nuestro flujo de trabajo (en push, en pull request, en merge, etc.)?<\/li>\n\n\n\n<li>\u00bfQueremos excluir algunas situaciones (como push to branch master)?<\/li>\n\n\n\n<li>\u00bfQu\u00e9 entorno debemos configurar para ejecutar correctamente nuestros comandos (en este ejemplo, Node)?<\/li>\n\n\n\n<li>\u00bfNecesitamos instalar dependencias? En caso afirmativo, \u00bfc\u00f3mo debemos almacenarlo en cach\u00e9?<\/li>\n\n\n\n<li>\u00bfQu\u00e9 pasos debemos dar para completar la comprobaci\u00f3n?<\/li>\n<\/ul>\n\n\n\n<p>Despu\u00e9s de algunas consideraciones y algunas horas de trabajo con docs ejemplo <em>.yml<\/em> puede tener este aspecto:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"yaml\" class=\"language-yaml\">nombre: Calidad del c\u00f3digo\n\non: 'push\n\ntrabajos:\n  calidad del c\u00f3digo:\n    nombre: Lint source code\n    se ejecuta en: ubuntu-latest\n    pasos:\n    - usa: actions\/checkout@v1\n\n    - nombre: Setup Node\n      usa: actions\/setup-node@v1\n      con:\n        node-version: '12.1'\n\n    - nombre: Cache dependencies\n      usa: actions\/cache@v1\n      con:\n        ruta: .\/node_modules\n        key: $(( runner.OS ))-dependencies-$(( hashFiles('<strong>**\/package-lock.json')<\/strong> ))\n        restaurar-llaves: |\n          $(( runner.OS ))-dependencias-$(( env.cache-name ))-\n          $(( runner.OS ))-dependencias-\n          $(( runner.OS ))-dependencias-\n\n    - nombre: Instalar dependencias\n      ejecutar: |\n        npm install\n\n    - nombre: Lint files\n      run: |\n        npm run lint<\/code><\/pre>\n\n\n\n<p>GitHub proporciona todo el material ambiental que necesitamos. En la \u00faltima l\u00ednea estamos ejecutando el comando <strong><em>npm run lint<\/em><\/strong> que antes no estaba definido:<\/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>Tenga en cuenta que en nuestro flujo de trabajo no estoy usando <strong>:arreglar<\/strong> comandos.<\/p>\n\n\n\n<p>Una vez realizados todos estos pasos, puede disfrutar de este hermoso resultado de GitHub antes de fusionar su 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>","protected":false},"excerpt":{"rendered":"<p>La calidad del c\u00f3digo es una parte crucial del proceso de desarrollo, especialmente cuando se quiere trabajar de forma eficiente a largo plazo. Existen muchos enfoques y buenas pr\u00e1cticas, incluido todo el tema de las metodolog\u00edas \u00e1giles, pero la mayor\u00eda de ellos est\u00e1n relacionados con alg\u00fan gran proyecto empresarial dirigido por al menos 6 personas.<\/p>","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\/es\/blog\/calidad-primeros-5-sencillos-pasos-para-pelusa-su-codigo-con-github-flujos-de-trabajo-en-javascript-proyecto\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\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\/es\/blog\/calidad-primeros-5-sencillos-pasos-para-pelusa-su-codigo-con-github-flujos-de-trabajo-en-javascript-proyecto\/\" \/>\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 minutos\" \/>\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\":\"es\",\"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\":\"es\",\"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\":\"es\",\"@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\":\"es\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/#organization\",\"name\":\"The Codest\",\"url\":\"https:\\\/\\\/thecodest.co\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@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\":\"es\",\"@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\\\/es\\\/author\\\/thecodest\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"La calidad ante todo 5 sencillos pasos para eliminar las pelusas de su c\u00f3digo con los flujos de trabajo de GitHub en el proyecto JavaScript - 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\/es\/blog\/calidad-primeros-5-sencillos-pasos-para-pelusa-su-codigo-con-github-flujos-de-trabajo-en-javascript-proyecto\/","og_locale":"es_ES","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\/es\/blog\/calidad-primeros-5-sencillos-pasos-para-pelusa-su-codigo-con-github-flujos-de-trabajo-en-javascript-proyecto\/","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 minutos"},"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":"es","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":"La calidad ante todo 5 sencillos pasos para eliminar las pelusas de su c\u00f3digo con los flujos de trabajo de GitHub en el proyecto JavaScript - 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":"es","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":"es","@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":"es"},{"@type":"Organization","@id":"https:\/\/thecodest.co\/#organization","name":"The Codest","url":"https:\/\/thecodest.co\/","logo":{"@type":"ImageObject","inLanguage":"es","@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":"es","@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\/es\/author\/thecodest\/"}]}},"_links":{"self":[{"href":"https:\/\/thecodest.co\/es\/wp-json\/wp\/v2\/posts\/3524","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/thecodest.co\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/thecodest.co\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/thecodest.co\/es\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/thecodest.co\/es\/wp-json\/wp\/v2\/comments?post=3524"}],"version-history":[{"count":9,"href":"https:\/\/thecodest.co\/es\/wp-json\/wp\/v2\/posts\/3524\/revisions"}],"predecessor-version":[{"id":8622,"href":"https:\/\/thecodest.co\/es\/wp-json\/wp\/v2\/posts\/3524\/revisions\/8622"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/thecodest.co\/es\/wp-json\/wp\/v2\/media\/3525"}],"wp:attachment":[{"href":"https:\/\/thecodest.co\/es\/wp-json\/wp\/v2\/media?parent=3524"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/thecodest.co\/es\/wp-json\/wp\/v2\/categories?post=3524"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/thecodest.co\/es\/wp-json\/wp\/v2\/tags?post=3524"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}