Mobile First: Instagram

Objetivo:

Desenvolver uma versão mobile first do Instagram utilizando apenas HTML5 e CSS3.

Preview: Instagram Codenation

Tópicos:

Neste desafio, você vai praticar os seus conhecimentos em:

• HTML5;
• CSS3;
• Metodologia BEM CSS.

Observações:

• As imagens estão disponíveis na pasta assets;
• As imagens de cada personagem estão dentro de sua respectiva pasta, por exemplo: assets/profiles/black-panther/;
• A imagem de perfil dos personagens é identificada por nome_do_personagem-profile.jpg;
• O site deve ser Mobile First;
• Não utilize frameworks CSS como Bootstrap, Foundation e afins.

Requisitos:

• Node v13.8.0 - ou superior, instalado em seu computador;
• Live Server. ​

O Live server é um módulo NPM que permite servir localmente páginas HTML, sem a necessidade de instalar plugins adicionais no navegador, ou em seu editor.

Uma vez que o nodejs esteja instalado em seu computador, abra o terminal e execute o seguinte comando: npm install -g live-server

Após a instalação, você deverá navegar até o diretório contendo seus arquivos HTML e executar o comando: live-server ./[nome-da-pasta ou arquivo html]

Screenshots de Referência

Versão Mobile:

Versão Desktop: