Nota: Si el tiempo es una limitación, intente resolver lo que considere que es la parte más valiosa del ejercicio. Es mejor enfocar esfuerzos y mostrar la calidad de su trabajo en una parte del ejercicio a resolver todo con mala calidad. En tal caso, describa cómo manejaría las partes del ejercicio que no puede realizar en un archivo Readme.md.
Realice pruebas en diferentes navegadores tales como Chrome, Firefox y Safari, las últimas versiones para realizar testeo en desktop. Misma recomendación para responsive.
Requisitos:
- Utilice un framework que permita ayudar en la creación de interfaces adaptables en diferentes dispositivos web con CSS y JavaScript, tales como Bootstrap / Foundation / Materialize.
- Utilice fuentes de proveedores como lo es Google Font.
- Utilice su propia fuente de iconos.
- Idóneo utilizar preprocesadores como LESS / SASS o cualquier tipo de marco CSS si lo desea. (Si prefiere utilizar CSS puro también es una opción, pero debe argumentar los beneficios)
- En responsive plante la visual y su diagramación.
Solo agregue interacción en el banner principal referente a la votación.
Requerimientos:
- Cree una fuente de datos en formato JSON con la estructura que mejor se adapte al contenido de las casillas de votación y complete el contenido inicial a partir de ella.
- El usuario puede seleccionar el botón "me gusta" o " no me gusta" en la card del banner principal. Ideal plantear un estado para el botón Me gusta o no Me gusta y que el usuario perciba la microinteración.
- Una vez que el usuario hace clic en el botón "Votar ahora", se muestra un mensaje que dice "Tu voto ha sido registrado!" así como un botón de votar de nuevo que vuelve a traer la card inicial.
- No hay límite en la cantidad de votos.
- Las barras de porcentaje deben cambiar dependiendo de los votos positivos o negativos.
- Piense en una forma de conservar los votos actuales para que, si se actualiza la página, los datos no se pierdan. (podría ser local en el navegador o en el servidor si tiene esas habilidades).
- Queremos conocer sus habilidades del DOM JS, así que no use jQuery.
- Puede resolver esta parte con JS y algunos patrones, o el ideal Angular > v4 como framework. Utilice el que le resulte más cómodo.
- Muéstrenos un vistazo de lo que le encanta hacer (y de lo que conoce mejor).
- Escriba en un archivo readme.md para hacer referencia a cualquier aspecto clave que desee mencionar sobre lo que aplicó en el ejercicio y / o cualquier otra información relevante sobre los pasos para poner en marcha el proyecto.
- Envíe un enlace apuntando a su repositorio (Github, Bitbucket) que incluye el recurso. La rama maestra debe contener todo el ejercicio.