Skip to content

Latest commit

 

History

History
78 lines (59 loc) · 4.76 KB

README.md

File metadata and controls

78 lines (59 loc) · 4.76 KB

Nibo Front-end Challenge - For PMs

O Trabalho de Conclusão

O grupo deverá trabalhar de forma colaborativa para chegar ao resultado final. Deverão utilizar o GIT como sistema de versionamento, aproveitando-se dos recursos relacionados à branchs, pull-requests e commits. O grupo deverá replicar a Landing Page em questão utilizando técnicas aprendindas durante o curso.

O grupo poderá tirar dúvidas com os jurados ou com qualquer outra pessoa. Porém o código deve ser feito exclusivamente pelos membros do grupo.

Apresentação

No dia escolhido o grupo poderá escolher um ou mais representantes para fazer a apresentação para os Jurados. Esta apresentação não deverá passar de 15 minutos. Deverá ser apresentado através do compartilhamento de tela o resultado final e demonstrado rapidamente a estrutura geral do código HTML e CSS.

Requisitos

Execução

  • Todo o código deverá estar em um único repositório previamente criado no Github do Nibo. Os participantes do grupo deverão seguir o fluxo padrão de desenvolvimento aprendido durante as aulas: clonar o repositório em suas máquinas, criar suas branchs de trabalho e realizar as integrações de código através de pull-requests. Cada pull-request deverá ser aprovado por qualquer membro da equipe, desde que não seja o próprio criador.
  • Será avaliado a qualidade dos commits: deverão ser criados sempre que um pequeno trabalho for concluído, mantendo uma descrição simples e clara sobre o que foi realizado.

Requisitos de negócio

  • Será avaliado a fidelidade visual do resultado final em relação ao layout originalmente proposto. Então os espaçamentos, cores, imagens e tamanhos devem ser respeitados.
  • O menu de navegação localizado ao topo da página deverá manter-se fixo no topo ao rolar a página.

Requisitos técnicos

  • O projeto deverá ser desenvolvido utilizando a última versão do Bootstrap Framework. Será levado em consideração o bom uso das classes CSS e estrutura HTML, as técnicas aplicadas utilizando os recursos do framework e a diversidade na utilização dos seus componentes.
  • Será avaliado o uso de boas práticas para HTML e CSS. Então evite estilos escritos diretamente nas tags HTML, por exemplo.
  • O HTML deve ser totalmente válido, sem erros de escrita e respeitando as regras básicas de herança. Exemplo: não se pode colocar uma <div> dentro de um <a>.
  • O CSS deverá estar em um arquivo separado e sendo chamado corretamente dentro da página HTML.

Avaliação

As notas serão dadas para o grupo. Serão dividas em ___ categorias, gerando uma média simples que dará a nota final do grupo. As notas de cada categoria também serão geradas por uma média simples das notas dadas por cada avaliador. As notas vão de 0 a 10, sendo 0 equivalente a um um trabalho totalmente insatisfatório e 10 equivalente a um trabalho totalmente satisfatório.

A banca será composta por 4 avaliadores, todos desenvolvedores Front-end.

As categorias são:

  • Composição Visual: cuidado com a entrega visual, atenção aos detalhes e harmonia geral.
  • Estrutura HTML: técnica aplicada na construção do HTML, contando com a correta utilização das tags, a semântica e a utilização de forma eficiente das tags.
  • Aplicação do Bootstrap: conhecimento aplicado do Bootstrap, utilização de forma eficiente das classes.
  • CSS e classes: Nomenclatura clara e padronizada das classes, utilização de técnicas de CSS e organização do código.
  • Versionamento: Utilização correta dos conceitos aprendidos nas aulas relacionados aos commits, pull-requests e branchs. Nomenclatura, descrição e organização também serão levados em consideração.
  • Disponibilidade: O resultado final deverá estar hospedado em algum servidor com Deploy Contínuo configurado.

Outros recursos

Font awesome

https://fontawesome.com/start

<script src="https://kit.fontawesome.com/1da2c8f5eb.js" crossorigin="anonymous"></script>

Bootstrap

https://getbootstrap.com/docs/5.0/getting-started/introduction/

<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>

Fonte do texto

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Spartan:wght@300;400;500;700&display=swap" rel="stylesheet">
font-family: 'Spartan', sans-serif;

Cores

azul destaque: #183b56
texto corrido: #424767
azul texto menu: #171f38e6
verde ícones: #418b78