/upMiner-test-dev

Projeto para entrevista da empresa upLexis

Primary LanguageTypeScriptMIT LicenseMIT

Sobre

Em uma entrevista foi pedido os sequintes requisistos:

  • Desenvolver as páginas do layout fornecido com a maior fidelidade possível, de acordo com os seguintes requisitos:
  • Implementar rotatividade automática no carrosel de banners (1).
  • Exibir uma nova Página de Detalhes ao clicar no botão "Saiba Mais" (2) de cada Card (Levando as informações fornecidas dentro do card para a Página de Detalhes).
  • Página Principal: Filtrar os cards ao clicar em uma categoria da barra cinza (3) (Destacando em laranja a categoria selecionada).
  • Página Principal: Ordenar os cards ao selecionar a opção (Preço ou Lançamento) dentro do INPUT SELECT (4).
  • Implementar o layout responsivo para os breakpoints 480px e 1200px.
  • Utilizar um framework JS (React/Angular/Vue).

Diferenciais 🆙

  • Utilizar SASS como pré-processador CSS.
  • Utilizar o padrão BEM CSS.
  • Utilizar VUE como framework JS.

Ultilizado ✅

  • React
  • react-icons
  • axios
  • json-server
  • nuka-carousel
  • react-router-dom
  • webpack
  • babel
  • SASS

Instação 🆗

  • Faça o Download do projeto
  • abra com o seu editor de texto preferido
  • abra um terminal no local raiz do projeto
  • siga as etapas abaixo

Instale as dependências.

yarn 

Para executar o servidor com todos os itens do card e menu.

yarn server

Para executar a aplicação.

yarn dev

Para visualizar o site que se encontra na porta 8080

localhost:8080