├── .DS_Store ├── .vscode └── settings.json ├── README.md ├── index.html └── src ├── .DS_Store ├── css ├── components │ ├── background.css │ ├── componentes.css │ ├── footer.css │ └── header.css ├── global │ └── global.css ├── pages │ ├── area-usuario.css │ ├── cadastro.css │ ├── contato.css │ ├── home.css │ ├── index.css │ ├── login.css │ ├── planos.css │ ├── produtos.css │ ├── rec-senha.css │ └── termos.css ├── style.css └── utils │ ├── cor.css │ └── fontes.css ├── img ├── .DS_Store ├── background-img │ ├── .DS_Store │ └── background.png ├── cadastro │ └── harry-carta.png ├── contato │ ├── beatriz.png │ ├── dayane.png │ ├── lais.png │ ├── leticia.png │ ├── linkedin.png │ └── victor.png ├── favicon │ └── favicon.png ├── home │ └── homem-com-caixa-home.png ├── icon-header │ └── user-icon.png ├── logo-img │ ├── .DS_Store │ └── logo.svg ├── pagina-inicial │ ├── .DS_Store │ ├── logos │ │ ├── funko-logo.png │ │ ├── hp-logo.png │ │ ├── logo-lotr.png.png │ │ ├── marvel-logo.png │ │ └── star-wars-logo.png │ └── produtos-pag-inicial.png ├── planos │ ├── .DS_Store │ ├── box-g.png │ ├── box-m.png │ └── box-p.png └── readMe │ └── Screenshot_2023-07-14_at_4.53.57_PM.png ├── js ├── .DS_Store ├── controller │ ├── cadastroController.js │ ├── enderecoController.js │ ├── loginController.js │ ├── produtoController.js │ ├── recSenhaController.js │ └── usuarioController.js ├── model │ ├── .DS_Store │ ├── enderecoModel.js │ └── usuarioModel.js ├── script.js ├── scriptCadastro.js ├── scriptLogin.js ├── scriptRecSenha.js └── view │ ├── areaUsuarioView.js │ ├── cadastroView.js │ ├── enderecoView.js │ ├── loginView.js │ ├── produtosView.js │ ├── recSenhaView.js │ └── slideShowView.js └── pages ├── area-usuario.html ├── cadastro.html ├── contato-logado.html ├── contato.html ├── home.html ├── login.html ├── planos.html ├── produtos.html ├── rec-senha.html └── termos.html /.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Vimlm/geekBox/e909537ea4ba78cd5ba669c9c71689abd9ed659f/.DS_Store -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "liveServer.settings.port": 5501 3 | } -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # The Frontenders/ GeekBox 2 | Este projeto consistiu em desenvolver o front end para apresentar uma plataforma 3 | de serviço por assinatura em que as pessoas usuárias precisam entrar em uma lista 4 | de espera. 5 | 6 | ## Tecnologias Utilizadas 7 | O projeto foi desenvolvido utilizando as seguintes tecnologias: 8 | 9 | **TRELLO**: Utilizado para a divisão das tarefas. 10 | **FIGMA**: Utilizado para a criação do design do site. 11 | **UNSPLASH**: Utilizado para a curadoria de imagens. 12 | **BRANCHES/GitHub**: Utilizado para trabalhar em grupo com mais facilidade. 13 | **HTML**: Utilizado para estruturar o conteúdo da página. 14 | **CSS**: Utilizado para estilizar a página e torná-la visualmente atraente. 15 | **JavaScript**: Utilizado para criação de usuário, validação de usuário, manipulação do dom, criar avisos interativos com o usuário, requisições com API Via CEP com AJAX, modularizar o projeto, implementar o conceito de fila e carrossel de imagens. 16 | 17 | ## Estrutura do Projeto 18 |  19 | 20 | 21 | ## Funcionalidades 22 | O site possui as seguintes funcionalidades: 23 | 24 | - Login; 25 | - Recuperação de senha; 26 | - Área de cadastro para assinatura da box. 27 | 28 | ## Executar o projeto 29 | - Para visualizar o preview online do projeto clique [aqui](https://vimlm.github.io/geekBox/); 30 | 31 | ## Visualizar o projeto 32 | - Clicando [aqui](https://github1s.com/Vimlm/geekBox) você consegue ver ele online; 33 | - Caso prefira faça o clone do projeto em uma pasta de sua preferência e abra a pasta em um editor de texto da sua preferência; 34 | 35 | ## Conclusão 36 | O projeto GeekBox consiste em 11 páginas navegaveis, nas quais apresentamos a empresa e os serviços de assinatura, sendo eles em três modalidades, que variam de acordo com o tamanho/valor da box (P, M ou G). 37 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 |
5 | 6 | 7 | 8 | 9 |Um pedacinho do universo geek para a sua casa, todo mês dentro de uma caixa cheia de surpresas!
41 | 42 | 43 |Novos temas, novos itens. Descubra tudo o que vem por aí e dê um UP na sua coleção!
38 |Aqui você garantee seus itens misteriosos cuidadosamente selecionados, que somados valem mais do que o valor pago! 55 | São tês opções (P, M e G) para você escolher conforme suas necessidades :)!
56 |