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.
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.
- 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.
- 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.
- 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.
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.
<script src="https://kit.fontawesome.com/1da2c8f5eb.js" crossorigin="anonymous"></script>
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>
<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;
azul destaque: #183b56
texto corrido: #424767
azul texto menu: #171f38e6
verde ícones: #418b78