Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/jorgecj/exercicio-2-alternativo-desafio-hyperativa-teste-front-end-

Essa é uma solução alternativa ao exercício 2 do Desafio-Hyperativa-Teste-Front-end.
https://github.com/jorgecj/exercicio-2-alternativo-desafio-hyperativa-teste-front-end-

css-inline html html5

Last synced: about 8 hours ago
JSON representation

Essa é uma solução alternativa ao exercício 2 do Desafio-Hyperativa-Teste-Front-end.

Awesome Lists containing this project

README

        

# Exercício 2 do Desafio Hyperativa
# Resolução alternativa para teste para estágio Front-end
## Instruções para utilização do projeto:
Não tem segredo, as instruções de utilização, são as mesmas da outra versão desse exercício. Primeiramente, você irá precisar instalar a extensão Live Server em seu Visual Studio Code. Caso já tenha esta extensão instalada, basta navegar utilizando o terminal de sua preferência até o local onde deseja baixar o repositório. Após isso, coloque no seu terminal o comando `git clone (chave ssh)`. Vou dar um exemplo de como ficará o comando: `git clone [email protected]:JorgeCJ/Exercicio-2-ALTERNATIVO-Desafio-Hyperativa-Teste-Front-end-.git`. O arquivo será baixado em seu computador e para abri-lo basta clicar com o botão direito na pasta escrita `exercício2 alternativo` e escolher a opção Abrir com Code, o que fará com que o exercício seja aberto no editor de código fonte Visual Studio Code. Clique no arquivo `index.html` do exercício em questão e aperte `Ctrl + Shift + p`. Abrirá uma pequena tela na parte superior do seu Visual Studio Code e você deverá selecionar a opção `Live Server: Open with Live Server`. Após todas estas etapas, finalmente poderá verificar o projeto funcionando em seu navegador `:D`.

## Observações sobre o desenvolvimento dos exercícios:
Estava observando o projeto e pensei se existia alguma forma de reduzir ainda mais a quantidade de imagens utilizadas, daí tive uma ideia. Decidi baixar como imagem o modelo do site do Zeplin. E para conseguir colocar links, apenas coloquei tags âncoras sobre essa única imagem. Após isso, coloquei os textos e os posicionei corretamente. E com isso, o projeto estava pronto, utilizando apenas `UMA ÚNICA` imagem. Foi até mais simples, nem precisei utilizar o Paint 3D.

### Mais detalhes:
Se quiser verificar o exercício 2 da versão alternativa funcionando, basta clicar [aqui](https://exercicio-2-alternativo-desafio-hyperativa-teste-front-end.vercel.app/).

## Tecnologias utilizadas:
- [HTML](https://developer.mozilla.org/pt-BR/docs/Web/HTML)
- [Visual Studio Code](https://visualstudio.microsoft.com/pt-br/downloads/)