Construindo o MecPrice: aprendizados reais ao desenvolver um sistema web para oficinas mecânicas.

Durante minha transição para a área de tecnologia, decidi transformar um problema real do meu dia a dia em um projeto prático de software.

O resultado foi o MecPrice, um sistema web criado para orçamentos automotivos e controle básico de estoque, pensado especialmente para a realidade do chão de oficina.

👉 Demo online: https://giobom.github.io/MecPrice

Mais do que um aplicativo funcional, o MecPrice se tornou um laboratório de aprendizado em engenharia de software, onde cada funcionalidade reflete decisões técnicas, erros corrigidos e evolução de código.

🎯 O problema que motivou o projeto

Na prática, muitas oficinas ainda utilizam:

• Papel,
• Anotações soltas,
• Aplicativos genéricos que não refletem o processo real do mecânico.

Isso gera:

• Erros de cálculo,
• Dificuldade em manter histórico,
• Falta de organização de peças e valores.

O objetivo do MecPrice nunca foi competir com ERPs completos, mas sim:

Criar uma ferramenta simples, clara e funcional, enquanto eu aprendia a construir software do jeito certo.

🧱 Tecnologias e decisões iniciais

Optei por uma stack propositalmente enxuta:

• HTML5 – estrutura semântica
• CSS3 – layout responsivo e identidade visual limpa
• JavaScript Vanilla – lógica, estado e interação
• LocalStorage – persistência local
• GitHub Pages – deploy e versionamento
• PWA (Service Worker + Manifest) – instalação e uso offline

Essa escolha me permitiu entender profundamente:

• Manipulação do DOM,
• Organização de arquivos,
• Fluxo de dados,
• Ciclo de vida de uma aplicação web.

Assim como na mecânica, comecei com as ferramentas manuais antes das pneumáticas.

🧩 Arquitetura e evolução do sistema

Com a evolução do projeto, ficou claro que o sistema precisava de organização lógica, não apenas visual.

Hoje o MecPrice é dividido em duas grandes responsabilidades, acessadas por abas:

🔹 Aba Orçamento

• Cadastro de cliente e serviço
• inclusão de peças (nome, quantidade e valor)
• Cálculo automático:
• Total de peças
• Mão de obra
• Total geral
• Geração de orçamento visual
• Exportação em PDF
• Salvamento e recuperação do último orçamento via localStorage

🔹 Aba Estoque

• Cadastro de peças com:
• Nome, SKU, categoria
• Custo, preço
• Quantidade atual e estoque mínimo
• Alerta visual de estoque baixo
• Backup e restauração em JSON
• Edição, entrada e saída de itens

🔄 Integração Estoque ⇄ Orçamento

Um dos pontos mais importantes da versão atual é a integração direta entre estoque e orçamento:

• Peças do estoque aparecem como sugestão no orçamento
• O preço pode ser preenchido automaticamente
• Ao adicionar uma peça ao orçamento:
• O estoque é baixado automaticamente
• Ao remover a peça:
• O estoque é devolvido

Esse fluxo simula um processo real de oficina e me ensinou muito sobre:

• Consistência de estado
• Validações
• Efeitos colaterais no código

📱 MecPrice como PWA

O sistema foi estruturado como um Progressive Web App:

• Pode ser instalado no Windows, Android e iOS
• Funciona offline
• Possui ícones, manifest e service worker configurados
• Experiência próxima de aplicativo nativo

Implementar PWA me fez entender melhor:

• Cache de arquivos
• Ciclo de vida do service worker
• Experiência do usuário além do navegador

🧠 Principais aprendizados técnicos

Durante o desenvolvimento, alguns aprendizados se tornaram muito claros:

• Código cresce, e refatoração é inevitável
• Separar responsabilidades evita bugs futuros
• Delegação de eventos melhora manutenção
• Persistência local exige cuidado com consistência
• Escrever código legível é tão importante quanto funcionar

Aprendi que:

Funcionar é o mínimo — manter e evoluir é o verdadeiro desafio.

🚀 Próximos passos planejados

O MecPrice continua sendo um projeto vivo. Entre os próximos passos estão:

• Melhorias no layout para uso em telas menores
• Histórico de múltiplos orçamentos
• Autenticação simples
• Migração futura para backend (API REST)
• Banco de dados relacional
• Versão mobile dedicada

Cada evolução será mais um passo no meu aprendizado como engenheiro de software.

🔚 Conclusão

O MecPrice não nasceu de um tutorial, mas de uma necessidade real.

Ele representa minha transição da mecânica para a tecnologia de forma prática e consciente.

Construir esse sistema me mostrou que:

• Projetos reais ensinam mais do que exemplos genéricos
• Experiência anterior não atrapalha — acelera
• Aprender tecnologia fica mais fácil quando existe propósito

Se você está em transição de carreira, meu conselho é simples:

👉 construa algo que resolva um problema que você conhece.

O código evolui. Você também.

#ProjetoPessoal #JavaScript #HTML #CSS #PWA

#EngenhariaDeSoftware #TransicaoDeCarreira #AprendizadoNaPratica