🔍 Construindo uma plataforma online de votação: desafios, soluções e aprendizados chave

Ei, pessoal! 👋 Recentemente, trabalhei em uma plataforma de votação online simples e segura online voting platform para meu mini-projeto da faculdade, e queria compartilhar como fiz isso. Desde gerenciar registros de usuários até configurar um sistema de aprovação administrativa, esse projeto me ensinou muito sobre a construção de aplicações web funcionais usando JavaScript e localStorage. Neste post do blog, vou guiá-lo através do desenvolvimento da plataforma, os desafios que encontrei e como os superar.

🎯 Visão Geral do Projeto: O que me Propus a Construir

O objetivo era criar uma plataforma de votação simples que pudesse lidar com:

• Registros de Usuários: Permitir que os eleitores se cadastrem com seus dados.

• Votação: Permitir que os usuários votem de forma segura em enquetes.

• Controle Administrativo: Habilitar um administrador para gerenciar as enquetes, aprovar/rejeitar registros de usuários e supervisionar o processo de votação.

Inicialmente, considerei usar um backend completo com MongoDB, mas queria manter as coisas simples, então usei localStorage para gerenciar os dados dessa versão inicial do projeto.

🌟 Principais Recursos:

1. Páginas de Login e Registro: Os usuários podem criar uma conta ou fazer login.

2. Aprovação do Administrador: O registro de usuários requer a aprovação do administrador antes que eles possam votar.

3. Sistema de Votação: Usuários cadastrados podem votar em enquetes ativas.

4. Painel de Administrador: O administrador pode criar e gerenciar enquetes, visualizar pedidos de usuários e controlar quem pode votar.

🛠️ Processo de Desenvolvimento: Como Construí a Plataforma

1. Configurando o Projeto

Eu comecei construindo um simples sistema de login e registro usando HTML, CSS, JavaScript e localStorage para gerenciar dados de usuário. A conta de administrador estava hardcoded, mas usuários podiam se registrar fornecendo seu nome completo, ID de eleitor e senha. No entanto, rapidamente percebi que permitir que qualquer pessoa se registrar e votar sem a aprovação do administrador não era a melhor ideia.

2. Adicionando Aprovação do Administrador para Registros

Para tornar a plataforma mais segura, eu Introduzi um sistema de aprovação de administrador. Sempre que um usuário se registra, sua solicitação é armazenada no localStorage e marcada como “pendente”. O administrador então pode revisar e aprová-la ou rejeitá-la.

🚧 Desafios com Aprovação de Administrador:

• Rastreando Solicitações Pendentes: Eu precisava ter certeza de que usuários aguardando aprovação não seriam capazes de votar ainda.

• Aprovando Usuários: Assim que aprovado, os dados do usuário precisavam ser movidos da lista “pendente” para a lista “usuários registrados” no localStorage.

✅ Solução:

Eu configurei um simples sistema onde:

1. Solicitações de registro foram armazenadas no localStorage sob uma chave especial (accountRequests).

2. Quando o admin aprovou um usuário, seus detalhes foram movidos para a lista users, concedendo-lhes acesso ao sistema de votação.

3. Se rejeitado, a solicitação permaneceu no localStorage para referência futura, para que o admin pudesse manter o registro de todas as decisões.

3. Criando e Gerenciando Pesquisas

A página de admin permitia a criação de enquetes dinâmicas, onde o admin podia adicionar múltiplas opções de voto. Os dados da enquete eram armazenados no localStorage e apresentados aos usuários assim que eles se logavam e eram aprovados.

📝 Criando Enquetes:

• Enquetes são criadas pelo admin com um formulário que permite opções dinâmicas. O formulário permite que o admin adicione quantas opções forem necessárias para cada enquete.

• Usuários podem então visualizar essas enquetes e votar.

4. Tratamento de Votos e Resultados

O sistema de votação foi projetado para ser simples: assim que os usuários se logavam e fossem aprovados pelo admin, eles podiam ver as enquetes ativas e votar.

🗳️ Desafios de Votação:

• Evitar Votos Duplicados: Eu precisava garantir que os usuários só podiam votar uma vez por enquete.

• Armazenando Resultados: Os votos eram salvas no localStorage, vinculadas à usuário e enquete específicos.

✅ Solução:

Cada voto estava ligado ao ID do usuário e à enquete específica. Isso garantiu que cada usuário pudesse votar apenas uma vez, e os resultados foram armazenados com segurança no localStorage.

5. Exibindo Status de Registro do Usuário

Eu quis garantir que os usuários soubessem se o seu registro havia sido aprovado, rejeitado ou ainda pendente. Para isso, eu adicionei uma página “Verificar Status” onde os usuários podiam entrar com o ID de registro para verificar seu status de aprovação.

📋 Desafios de Status:

• Manter Status do Usuário: Fazer o rastreamento de cada pedido de registro e associá-lo com o status correto foi difícil.

✅ Solução:

Cada pedido de registro foi atribuído um ID único, e os usuários podiam entrar com este ID para ver se seu pedido foi aprovado, rejeitado ou ainda pendente. Esta página de status simples melhorou a experiência do usuário, dando feedback em tempo real sobre seu pedido.

🔑 Desafios Chave e Como Eu Solucionei

1. Gerenciar Pedidos de Usuários e Aprovações de Administrador

Inicialmente, eu não sabia como estruturar o sistema de aprovação. Depois de algumas tentativas e erros, decidi usar o localStorage para gerenciar o processo de aprovação de usuários. Isso deixou o sistema simples e permitiu atualizações rápidas pelo admin.

2. Tratando Enquetes Dinâmicas

Permitir que o admin adicione opções de voto dinamicamente foi desafiante mas recompensador. Eu implementei isso permitindo que o admin crie enquetes com quantas opções forem necessárias, que foram salvas como arrays no localStorage.

3. Armazenando Votos e Evitando Votos Duplicados

Umas partes complicadas foi garantir que usuários só podiam votar uma vez por enquete. Eu resolvi isso ligando votos à ID do usuário e à ID da enquete, garantindo que cada usuário só pudesse votar uma vez.

💡 O que Eu Aprendi

Construir esta plataforma de votação me ensinou muito sobre o tratamento de dados do usuário, criando fluxos de aprovação e gerenciando conteúdo dinâmico com localStorage. Aqui estão algumas das lições chave:

• Gerenciamento de Contas de Usuário: Eu aprendi a gerenciar contas de usuário, incluindo o tratamento de registros pendentes e aprovações.

• localStorage para Persistência de Dados: Este foi o primeiro projeto em que usei extensivamente o localStorage e foi uma grande experiência de aprendizado. Ele funciona bem para pequenos projetos, mas pode precisar ser substituído por um banco de dados como MongoDB para escalabilidade.

• Construindo um Painel de Administração: Criar uma página de admin para gerenciar usuários e enquetes deu-me visão sobre as complexidades do controle administrativo em um sistema.

🌟 Melhorias Futuras

Enquanto a versão atual do platforma funciona ótimo para votações de pequena escala, estou considerando migrá-lo para uma solução mais robusta no futuro:

• Integração com MongoDB: Para projetos maiores, migrar para MongoDB ofereceria melhor persistência de dados e escalabilidade.

• Implementação de Backend: Usar Express.js para o backend permitiria melhor manuseio de dados e gerenciamento mais fácil de contas de usuário e enquetes.

Para agora, estou satisfeito com a maneira como o platforma turnou. É simples, seguro e funcional para o escopo do projeto.

---

Conheça a plataforma em funcionamento: Plataforma de Votação Online
Explore o código no GitHub: Repositório do Sistema de Votação

---

Em resumo 🥜

A construção deste plataforma de votação online foi uma experiência de aprendizado fantástica. De gerenciar o cadastro de usuários e aprovações de administradores à criação de enquetes dinâmicas e garantindo a segurança dos dados, cada desafio ajudou-me a crescer como desenvolvedor. Estou animado em aplicar essas aprendizados em projetos futuros, e espero que este post inspire você a construir algo semelhante!

Obrigado por ler, e sinta-se livre para compartilhar suas opiniões ou perguntas abaixo! 😄