Skip to content

DiegosXe/7DaysOfCode-OptimusTech-HTML5-CSS3

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

13 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation


OptimusTech


Sumário

🔹 Descrição do Projeto

🔹 Desafios

🔹 Deploy

🔹 Tecnologias Utilizadas

🔹 Site do Desafio

🔹 Instrutora do Desafio

🔹 Desenvolvedor


Descrição do Projeto

Para praticar a essência do Front-end, foi proposto um desafio de 7 dias utilizando HTML e CSS. O desafio consistia em desenvolver uma página real a partir de um layout no Figma, algo que todo desenvolvedor terá que fazer no seu dia-a-dia no mercado. Para concluir esse desafio, foram utilizados conceitos básicos como div, section, inline para imagens, medidas responsivas em CSS, além de coisas mais avançados como Flexbox, Grid e muitos outros, coisas que qualquer pessoa entrando na área de Front-end precisa conhecer.


Desafios

Dia 1

  • Já no primeiro dia, você vai ser apresentado com o layout de uma página no Figma, analisá-lo e usá-lo para criar o cabeçalho da sua página, que contém um logo, links para outras páginas e alguns botões.

Dia 2

  • Aqui você desenvolverá a segunda seção da página, que é um 'Sobre nós', algo muito básico e presente na maioria das páginas empresariais. Nessa seção, você terá diferentes partes de texto, cada uma com um tamanho, cor e alinhamento diferente.

Dia 3

  • Nesse dia você vai precisar trabalhar bastante com alinhamento no CSS, e conhecimentos de Flexbox ou Grid vão facilitar muito a sua vida! A seção se chama 'Métricas e resultados' e contém 4 blocos de texto lado a lado, cada um com diferentes blocos internos.

Dia 4

  • Chegou a hora de brincar com imagens, o pesadelo de muitas pessoas! Nessa seção, você terá algumas partes de texto e uma imagem ilustrativa que terá que ser alinhada corretamente. O uso de medidas responsivas é algo que poderá te ajudar bastante.

Dia 5

  • Esse será provavelmente o dia mais desafiador, pois você desenvolverá a seção de 'Vagas' da página, que contém diferentes grupos de blocos agrupados e diversas informações sobre as vagas abertas.

Dia 6

  • Chegando quase no final, você desenvolverá a seção de 'Depoimentos', que envolverá conhecimentos de mudança de cor de background, tamanho de fontes e alinhamento de texto e de imagens.

Dia 7

  • No sétimo e último dia do desafio, você criará a parte mais inferior da página: o rodapé. Mas não é um rodapé qualquer, ele contém, entre outras coisas, um formulário para cadastro de e-mail com um valor pré-definido e também um botão, ambos perfeitamente alinhados. Você irá fechar com chave de ouro!

Deploy

https://diegosxe.github.io/7DaysOfCode-OptimusTech-HTML5-CSS3/


Tecnologias Utilizadas

  • HTML5
  • CSS3

Site do Desafio

Logo do 7 Days of Code


Instrutora do Desafio

Giovanna Moeller


Desenvolvedor


Diego Borelli Dias

About

No description or website provided.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published