Hola chicos en esta ocasión aprenderemos a configurar nuestro proyecto o pruebas técnicas. cuando nos envían alguna tarea para una posición como programador o Ingeniero frontend.

lo primero que comenzaremos sera con crear un nuevo proyecto en el cual simularemos que es nuestro proyecto o prueba técnica en el caso que nos manden algún challenge técnico. Nota: no todas las empresas hacen este tipo de challenges como una tarea que es parte del proceso pero una que otra empresa si te da la oportunidad de enviarte tarea y darte un tiempo limite para resolverlo.

Paso 1

Crear nuestro directorio de trabajo

abriremos nuestra consola y escribiremos el siguiente comando

Linux Distro o OSX
mkdir prueba_tecnica

Windows seria
MD prueba_tecnica

con esto crearemos nuestro directorio de trabajo.

Paso 2

una vez creado el directorio nos movemos a el cd prueba_tecnica

dentro nuestro directorio abrimos nuestro editor de código preferido.

Paso 3

en nuestra consola corremos el siguiente comando npm init nos pedirá llenar una serie de campos... si no queremos llenarlos solo oprime enter hasta que termine de solicitarlos.

Paso 4

Instalamos Jest dentro de nuestro proyecto con cualquiera de estos dos gestor de paquetes ya sea Yarn o NPM

yarn add --dev jest o npm install --save-dev jest

Paso 5

dentro nuestro package.json debemos añadir el script para correr nuestras pruebas el cual debéria quedar de la siguiente manera

{
"scripts": {
"test": "jest"
}
}

de igual manera te dejo la guía de la documentación oficial de Jest
Documentación Oficial de Jest

Paso 6

una vez configurado Jest en nuestro Proyecto procedemos a crear nuestro código o programa al cual le añadiremos pruebas unitarias.

dentro de nuestro editor crearemos nuestro archivo de trabajo puedes nombrarlo como tu desees en mi caso como verificaremos si una cadena de texto es un palíndromo sencillo verdad?.

en mi caso mi archivo se llamara:
isPalindrome.js

este problema se puede resolver de muchas maneras o tener distintos aproachs pero en esta ocasión lo resolví de la siguiente manera.

y el código es el siguiente

*`
var isPalindrome = function(str) {
const reversedString = str.split('').reverse().join('')
return str === reversedString
}

module.exports = isPalindrome
`*

Paso 7

procedemos a testear nuestra solución del código anterior

creamos dentro de nuestro proyecto el siguiente archivo
el nombre puede ser lo que tu desees solo por consistencia lo nombro similar añadiendo la palabra .test antes del nombre de la extension. esto es muy importante para que Jest detecte tus archivos o módulos de pruebas. es importante que dependiendo de la complejidad o arquitectura del proyecto vayas creando la arquitectura adecuada para tus pruebas. en esta ocasión solo es una prueba sencilla pero toma en cuenta que si tu proyecto es de magnitud media o amplia puedas módularizar tus pruebas de manera ordenada.

Creamos nuestro archivo de pruebas.
isPalindrom.test.js

nuestro archivo de pruebas quedaría de la siguiente manera.

const palindrome = require('./isPlindrome')
test('string is a palindrome', () =>{
expect(palindrome('bib')).toBeTruty()
expect(palindrome('nun')).toBeTruty()
expect(palindrome('madam')).toBeTruty()
expect(palindrome('racecar')).toBeTruty()
expect(palindrome('civic')).toBeTruty()
expect(palindrome('ramon')).toBeFalsy()
})

tu puedes añadir tantos casos de uso o pruebas como lo desees en mi caso. solo añadi que puedas saber si la cadena de texto es un palíndromo que es nuestro base case.

una vez terminado nuestro archivo de prueba procederemos a correr nuestras pruebas con el siguiente de los dos comandos en nuestra terminal

npm test o yarn test

automáticamente se ejecutaran las prueba y podremos ver el resultado de las mismas.

esto seria todo por el articulo sobre la integración de Jest en nuestros challenge técnicos si tenemos la oportunidad esto nos dará mayor peso dentro un proceso de selección sobre otros candidatos. sencillo verdad? cabe recalcar que tu puedes crear tus pruebas técnicas tan complejas como las necesites.

te dejo un video explicativo de como lo hice dentro de mi canal de Youtube.

Youtube