Skip to content

Esse projeto, tem como referência o Linktree, foi criado um "Single Page" com uso apenas de Html e Css, para solucionar o problema em compartilhamento de múltiplos links. A partir de agora será implementado algo semelhante a um tutorial para iniciantes.

Notifications You must be signed in to change notification settings

brunoro7/rocketShareLinks

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

9 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Projeto Rocket Share Links

Contexto:

Este projeto foi desenvolvido enquanto participava da Maratona Explorer 2.0 realizada pela RocketSeat e foi desenvolvido por Bruno Ro7.

Seu contexto principal foi utilizar HTML5 para construir uma Single Page, similiar ao LinkTree. E utilizar o CSS para adicionar estilo e posicionar os elementos.

Obs: Para uma melhor prática, e ajuda aos iniciantes curiosos, utilei HTML semântico para tornar a página mais acessível e melhor ranqueada de acordo com o CodeSniffer.


Técnologias usadas:

Front-end:

Desenvolvido com: CSS3, HTML5, MarkDown;


Demo:

==> https://brunoro7.github.io/ - base da url <== Esse deve ser um print ou gif da tela do site por inteiro


Escopo do Projeto:

Este projeto tem como base as seguintes finalidades:

  • Criar um Single Page de compartilhamento de links;
  • Aprender e exercitar a estruturação e criação do Html e do Css;
  • Trabalhar a parte semântica do código, usando o Code Sniffer como referência;
  • Exercitar a manipulação de elementos na tela;
  • Treinar nomeclatura de classes únicas e compostas(ou seja, ex: class="classe1 classe2");
  • Entender o funcionamento de variáveis dentro do Css;
  • E tornar a página em um modelo responsivo, Mobile First;

Objetivos e Próximos Passos:

O ponta pé inicial surgiu de uma idéia após estar finalizando a Maratona, percebi que muitas pessoas que estão entrando no mundo Tech e começando a programar, ainda sentem muita dificuldade, e precisam tanto de referências, quanto de alguns tutoriais e exemplos para se desenvolverem.
E pensando nisso, e em como posso ser útil também para a comunidade, resolvi dar um updgrade nesse projeto, e iniciar um mini-tutorial misto com desafios, para ajudar a desenvolver os fundamentos, desde como colocar esse projeto na sua máquina, como deixa-lo com a sua cara, entender o que é o famoso "Mobile First", e também através do GitHubPages deixar seu site exposto pra todos.
Este é um ponto de partida, então aos poucos pretendo aumentar o tamanho do projeto e surgir com novos, desafios, implementos e etc.
Lembrando entrei na área a pouco mais de um ano, e ainda sou apenas um apenas um estudante, que está tentando compartilhar um pouco do conhecimento adiquirido, e através disso praticar um poucos mais, caso aconteçam erros, encontre algo mal-interpretável, tenha sugestões ou qualquer outro tipo de solicitação ou acréscimo, pratique a empatia e ajude tanto o projeto quanto a mim evoluir.
Muito Obrigado! E partiu que é #MaoNaMassa:


Instalação do projeto localmente:

Para cada um dos passos, haverá um exemplo do comando a ser digitado para fazer o que está sendo pedido, caso tenha dificuldades e o exemplo não seja suficiente, sinta-se a vontade para me contatar em bruno.ro7c@gmail.com.

  1. Abra o terminal e crie um diretório no local de sua preferência com o comando mkdir:
  mkdir projetos

obs: lembrando que 'projetos' é o nome para o diretório, podendo ser qualquer outro nome;

  1. Entre no diretório que acabou de criar e depois clone o projeto:
  cd projetos
  1. Faça o clone o projeto:
  git clone git@github.com:brunoro7/rocketShareLinks.git
  1. Entre na pasta do projeto:
  cd rocketShareLinks

obs: para a etapa 5, já é esperado que você tenha instalado o VsCode, ou algum editor que você já conheça, caso esse seja o caso, pode pular essa etapa.

  1. Abra o seu editor de preferência, nesse caso usaremos o VsCode:
  code .

=> Esse comando acima, irá abrir o seu VsCode já com tudo que está incluso nesse diretório.


Desafios:

! Em contrução

Desafio 1

Aqui deverá conter um tutorial refente ao desafio.


Desafio 2

Aqui deverá conter um tutorial refente ao desafio.


Desafio 3

Aqui deverá conter um tutorial refente ao desafio.


Desafio 4

Aqui deverá conter um tutorial refente ao desafio.


Desafio 5

Aqui deverá conter um tutorial refente ao desafio.



Tutoriais:

! Em contrução

Mini-Tutorial Desafio 1

Aqui deverá conter um tutorial refente ao desafio.


Mini-Tutorial Desafio 2

Aqui deverá conter um tutorial refente ao desafio.


Mini-Tutorial Desafio 3

Aqui deverá conter um tutorial refente ao desafio.


Mini-Tutorial Desafio 4

Aqui deverá conter um tutorial refente ao desafio.


Mini-Tutorial Desafio 5

Aqui deverá conter um tutorial refente ao desafio.



About

Esse projeto, tem como referência o Linktree, foi criado um "Single Page" com uso apenas de Html e Css, para solucionar o problema em compartilhamento de múltiplos links. A partir de agora será implementado algo semelhante a um tutorial para iniciantes.

Topics

Resources

Stars

Watchers

Forks