Pipeline Validación de Código

Siguiendo con la construcción de nuestro pipeline para aplicaciones en react, vamos a agregar herramientas para validar el código del repositorio cada vez que realizamos un commit o un PR en el repositorio.

Antes de todo vamos a definir cada uno de estos conceptos.




	* Formato: Para realizar esto usamos las herramientas llamadas linter. Estas herramientas suelen venir con opciones para hacer también el análisis del cóigo. Esto no es nuevo ya en el lenguaje de programación C se utilizaba antes estas herramientas antes de la compilación.

    * Análisis: El análisis del código se puede realizar por medio de los linters o de otras herramientas especializadas, inluso podemos darle puntaje al código y así restringir que no se suba código que no cumpla con ciertas reglas o que esté por de bajo de un 89/100 de puntaje.
    
    * Test: En esta etapa realizamos los tests del código estos pueden ser unitarios o de integración.
    
    * Compilación: En esta etapa compilamos el código y si todo funciona correctamente podemos subirlo al repositorio.

En nuestro pipeline vamos a agregar cada una de las herramientas.

**Nota**: Estas son solo algunas herramientas, existen muchas más, y sobre el análisi de código más adelanteveremos como usar servicios de terceros, ya sea para analizar el código a nivel de seguridad, para validar la calidad del código, etc.

```yaml
stages:
  - stage: CodeValidation
    jobs:
      - job: CodeValidation
        steps:
        - task: NodeTool@0
          inputs:
            versionSpec: '15.x'
          displayName: 'Install Node.js'

        - script: |
            npm install
          displayName: 'npm install'

        - script: |
            npm run lint
          displayName: 'npm lint'

        - script: |
            npm install prettier && npx prettier . --write && npm run prettier
          displayName: 'npm prettier'

        - script: |
            CI=true npm run test
          displayName: 'npm test'

        - script: |
            npm run build
          displayName: 'npm build'
```

Acá te dejo el video de esta configuración por si tienes dudas: