Espaço do Autor

PT-BR

• Nome: Luiz Felipe Sousa Moureau Linhares
• Idade: 20 anos
• Universidade: UFRJ (Física Médica)
• Email de Contato: luizfelipesmoureau@gmail.com
• Hospedado em: https://www.e-commerce-mococa.tk
• Tecnologias utilizadas: JQuery, HTML, CSS, JS (and node for hosting)

EN-US

• Name: Luiz Felipe Sousa Moureau Linhares
• Age: 20 years old
• University: UFRJ (Medical Physics)
• Contact: luizfelipesmoureau@gmail.com
• Hosted at: https://www.e-commerce-mococa.tk
• Used technologies: JQuery, HTML, CSS, JS (and node for hosting)

FR-FR

• Nom et prénom: SOUSA MOUREAU LINHARES, Luiz Felipe
• Âge: 20 ans
• Université: UFRJ (Physique Médical)
• Addresse email: luizfelipesmoureau@gmail.com
• Hébergé sur: https://www.e-commerce-mococa.tk
• Technologies utilisées: JQuery, HTML, CSS, JS (et node pour le hosting)

Preview

Video: https://youtu.be/NlXhHzLluBA

Site: https://www.e-commerce-mococa.tk

Avaliação Front-End JR N1

Leia atentamente até o final.

Nossa avaliação tem como foco analisar como o candidato no desevolvimento do front-end da página proposta. Avaliamos qualidade de código, versionamento, uso de automatizadores, uso de preprocessadores e javascript(vanilla, jquery ou react).

OBS.: Evite bootstrap e outros similares, pois queremos avaliar o seu código na implementação dos itens.

Link do layout a ser desenvolvido: https://www.figma.com/file/Jgjk8tdDaQ4nHFHgQuNTLL/Avalia%C3%A7%C3%A3o-Front-end-JR.?node-id=0%3A1

01 - O Básico a ser executado para concorrer a vaga

• Fork o repositório e inicie o desevolvimento;
• Atenção para responsividade. Note que no repositório existe uma pasta src com alguns assets(Caso necessário, pois já tem tudo no figma). A fonte usada no layout é "Roboto", uma fonte google.

Finalizando esses itens você terá terminado a etapa 01 da avaliação.

OBS.: Interações e funcionalidades não sugeridas no layout serão levadas em consideração. Atenção aos detalhes do layout.

02 - Elementos de interação

• O banner prinicipal é do tipo slider e possui uma navegação na direita, no crop de desktop, e abaixo do banner, no crop de mobile. Precisamos que ao navegar o nome e a páginação nessa área sejam atualizados. OBS.: Você não precisa fazer o slider do zero. Utilize plugins como Slick, Owl carousel ou qualquer outro para fazer esse item do projeto.

• Menu. Sempre que clicarmos/ou no hover no ícone de menu hamburguer precisamos exibir o menu.

• Quando usuário clicar no botão de comprar na prateleira precisamos que exiba o lightbox de produto adicionado e o botão de compra deve ficar sinalizado como item comprado.

• PLUS: Junto com a ação de exibição do lightbox atualize a quantidade de itens na sacola presente na direita header.

Finalizando esses itens você terá terminado a etapa 02 da avaliação.

EXTRA

• Se você chegou até aqui você já é bem top! Essa etapa é um extra, e um diferencial para quem quiser se descatar. Note que no header existe elementos sem interação. Como contato e busca. Desenvolva uma solução para um desses elementos.

OBS. 01: O candidato esta livre para trabalhar com a estrutura e tecnologia que preferir, exceto bootstrap e similares.

OBS. 02: Finalizando a prova envie o link do fork para o e-mail: rafael.augusto@agencian1.com.br.