Vortex Hardware Systems é um projeto acadêmico desenvolvido como parte das atividades da disciplina de Programação Web. O principal objetivo é aplicar os conhecimentos adquiridos sobre desenvolvimento front-end por meio da criação de uma loja virtual fictícia especializada em componentes de hardware de alta performance.
Este repositório apresenta um site funcional que simula uma experiência real de navegação e compra, com páginas de produtos, sistema de carrinho, benchmark interativo e finalização da simulação de compra.
O projeto visa consolidar os seguintes aprendizados:
- Estruturação de páginas web com HTML5
- Estilização e layout com CSS3
- Interatividade e lógica de navegação com JavaScript
- Armazenamento local de dados utilizando LocalStorage
- Utilização de bibliotecas externas como Chart.js e ScrollReveal
- Organização modular de arquivos e rotas para publicação via GitHub Pages
- Desenvolvimento de interface responsiva, acessível e centrada na experiência do usuário
Acesse o projeto publicado via GitHub Pages:
🔗 https://therenanofc.github.io/Vortex-Hardware-Systems
- HTML5 – Estrutura semântica e responsiva
- CSS3 – Design responsivo, layout flexível e estilos customizados
- JavaScript (Vanilla) – Manipulação do DOM, lógica de carrinho e armazenamento local
- LocalStorage – Persistência de dados no navegador
- Chart.js – Exibição de benchmarks interativos com gráficos de barras
- ScrollReveal – Animações sutis ao rolar a página
- Git & GitHub – Versionamento e hospedagem
- Página inicial com introdução institucional e seções interativas
- Catálogo de produtos com imagens, descrições e botões de adicionar ao carrinho
- Carrinho dinâmico com possibilidade de ajuste de quantidades e remoção
- Cálculo automático do valor total
- Gráfico de benchmarks de produtos adicionados
- Imagens dos produtos diretamente no gráfico
- Simulação de finalização da compra com confirmação
- Navegação simples e intuitiva entre as páginas
- Design adaptável a diferentes dispositivos (responsivo)
O projeto é voltado tanto para fins acadêmicos quanto para aqueles que desejam compreender, na prática, como construir uma estrutura de e-commerce básica com recursos interativos, sem a utilização de frameworks ou bibliotecas complexas.
Este projeto é uma representação fictícia e não possui fins comerciais. Todos os produtos, marcas e imagens utilizadas são meramente ilustrativos e foram inseridos para fins educacionais. O foco principal é demonstrar a aplicação técnica e a organização de um projeto front-end funcional e esteticamente agradável.
Este projeto está sob a Licença MIT – consulte o arquivo LICENSE para mais informações.
Renan
GitHub: @TheRenanOfc
Flavio
GitHub: @FlavioBenevenuto
Projeto acadêmico desenvolvido em 2025.