alcocoha / clarovideo-test

Este un examen requerido para la vacante de Front-end developer

CLAROVIDEO TEST

Esta es una prueba para la vacante Front-end developer para el proyecto de ClaroVideo

DESCRIPCIÓN

Esta prueba consiste en replicar dos de las vistas actuales de claro video web, se necesitará revisar que endpoints se están consumiendo para traer la lista de películas disponibles y el detalle de la película seleccionada.

REQUERIMIENTOS TECNICOS GENERALES

• Se deberá usar react y react-redux.
• El desarrollo deberá incluir pruebas unitarias.
• Se deberá de subir la prueba a un repositorio publico.
• En el repositorio deberá existir un README con las instrucciones para levantar el proyecto y correr pruebas unitarias.
• La aplicación deberá subirse a un hosting o nube.

PASOS

1. Creación de repositorio en Github
2. Creación de proyecto react con redux
3. Creación de pruebas unitarias
4. Publicación en hosting

PASOS PARA CORRER EL PROYECTO EN LOCAL

1. Clonar el repositorio https://github.com/alcocoha/clarovideo-test.git
2. Instalar el administrador de paquetes de Node.js instalando Node.js
3. Instalar react con la siguiente instrucción

   npm install react

4. Entrar a la carpeta del proyecto "clarovideo-test"
5. Correr la aplicación con la siguiente instrucción

   npm start

DEPENDENCIAS UTILIZADAS

Instalar las siguientes dependencias:

Axios

Permite hacer conexiones HTTP externas

npm install --save axios

Router dom

Es un enrutador que permite reescriben secciones de una página en lugar de cargar páginas nuevas completas desde un servidor tipo SPA

npm install --save react-router-dom

Redux

Permite almacenar mi estado en un Store, este estado solo va a poder cambiar a través de acciones

npm install --save redux

React-redux

Permite almacenar mi estado en un Store, este estado solo va a poder cambiar a través de acciones

npm install --save react-redux

IMPORTANTE: Estudiando un poco más sobre redux y react decidí instalar react-redux para optimizar la funcionalidad del proyecto

Redux-thunk

Permite conectar con los action y en lugar de devolver un objeto devuelve una función con una acción asyncrona

npm install --save redux-thunk

React tooltip

Permite generar un tooltip dinamico

 npm install --save react-tooltip

LIGA DEV

http://jorgehdev.esy.es/

PRUEBAS UNITARIAS

Las pruebas unitarias se realizaron con Jest, un framework que se instala al momento de enviar la instrucción create-react-app.

Para correr las pruebas una vez instalado el proyecto se ejecuta la siguiente instrucción desde npm

npm test

RESPONSIVE

DONE

DATOS IMPORTANTES REDUX

1. Store: Unica fuente de la verdad
2. State: es de solo lectura
3. Reducers: Los cambios se realizan unicamente con reducers(Funciones puras)