Skip to content

DanielaCalisaya/frontend-dev-challenge

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

30 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation


Descripción

Frontend DEV Challenge es una prueba de admisión para desarrolladores en HTML, CSS, JavaScript.

Pasos

  1. Crear un fork y entregar el enlace del repositorio de tu usuario. Evaluaremos la prueba en tu repositorio personal.
  2. Utilizar el diseño que debe finalizar y que está disponible en Figma (solo una pantalla): https://www.figma.com/file/FxX6dCznISsNkztnRa59Rf/Figma-Test?node-id=0%3A1
  3. Montar el código en HTML5, CSS3 y JS con efectos y animaciones.
  4. Usar buenas prácticas de HTML para SEO.

Buenas prácticas y sugerencias

  1. Mobile first.
  2. Layout responsive y cross-browser.
  3. Código legible y bien estructurado.
  4. HTML optimizado para SEO.
  5. Idioma del código y comentarios en inglés.
  6. Se puede utilizar una UI lib solo para el GRID, el resto debe ser desarrollado (colores, textos, botones, forms, paddings, margins, etc).
  7. CSS
    a. Usar animaciones simples de hover, animaciones de mensaje del formulario o de búsqueda, etc. b. Usar nomenclatura BEM para estilos.
    c. Utilizar los estilos de color y textos creados en Figma.
    d. Utilizar 8px GRID para espacios, paddings, margins.
    e. Si se considera necesario, se pueden utilizar variables.
  8. JavaScript
    a. No utilizar jQuery, solamente JS puro ES6.
    b. Utilizar la nomenclatura camelCase.
    c. Como sugerencia: recomendamos crear una función de alert para enviar el formulario (puede ser envío falso, solo una alerta), un Listener de scroll para mostrar/ocultar algún botón o el banner fijo/flotante, click del FAQ/Accordion, abrir y cerrar un modal.

Plus

  1. Componer el proyecto en ReactJS (no olvidar añadir el readme al proyecto final).
  2. SCSS/SASS

Fecha límite

  1. Siete días (7 días) a partir del correo electrónico de envío del Desafío Tech. La fecha exacta está en el correo electrónico.
  2. Notificar en el correo electrónico la finalización y enviar solamente la url del repositorio para evaluación.
  3. Utilizar siempre en el correo electrónico la opción "Responder a todos".

-> Daniela Calisaya

Link -> Figma

Para ver este proyecto

      Click derecho sobre el archivo home.html

      -> Mostrar en el explorador de archivos

Releases

No releases published

Packages

No packages published

Languages

  • CSS 49.6%
  • HTML 44.6%
  • JavaScript 5.5%
  • SCSS 0.3%