🗳️ How I Built an Online Voting Platform Using JavaScript and LocalStorage

Recently, I worked on a fun project: creating a simple online voting platform. The idea was to allow users to securely vote online, while an admin oversees and approves everything. I built it using HTML, CSS, JavaScript, and localStorage for data management. This blog will walk you through the development journey, the challenges I faced, and the solutions that helped bring it all together.

🛠️ Key Features of the Platform

1. Login and Registration System: Users register with basic details (like name, voter ID), while the admin has a dedicated login for system management.
2. Admin Approval: To ensure only verified users can vote, each registration request needs to be approved by the admin.
3. Poll Management: The admin can create and delete polls and manage voting options.
4. Voting System: Registered and approved users can vote in any active poll.
5. Check Status Page: Users can check if their registration request is approved, pending, or rejected.

🚧 Challenges and Solutions

1. Admin Approval Workflow

Initially, I planned to let users register and vote instantly, but I realized that an admin approval process was needed to keep things legitimate. So, I created an approval system where:

• Registration requests were stored in localStorage as pending (accountRequests).
• Approval: If approved, the user’s details were moved to the registered users list, allowing them to log in and vote.
• Rejection: Requests were saved permanently for record-keeping, even if they were denied.

2. Status Tracking for Users

To keep users updated, I added a Check Status page, which was a bit challenging at first. I ended up assigning each registration request a unique ID, allowing users to check the status of their request. This way, users could see if they were approved, pending, or rejected.

3. Dynamic Poll Creation

Allowing the admin to create polls with multiple options was essential, but it took some work! I set up a form that allowed the admin to add options dynamically, which were stored in a polls array in localStorage for easy retrieval during voting.

4. Managing Votes

I wanted to prevent duplicate voting and ensure that results were saved securely. To achieve this, each vote was linked to the user’s ID and poll ID, ensuring that a user could only vote once per poll.

🏗️ Final Project Structure

The final online voting system had the following components:

• Login and Registration Pages: Basic user and admin authentication.
• Admin Panel: Full control over poll creation, registration approvals, and user management.
• Voting System: Users can cast their vote securely, with results stored in localStorage.
• Check Status Page: A user-friendly way for users to check the status of their registration.

🌟 What’s Next?

While this project worked great as a local solution, it could benefit from moving to a backend with MongoDB for larger-scale applications. For now, I’m sticking with localStorage, but it was a valuable experience in managing data and access without a backend.

Building this online voting platform was a rewarding journey, and I learned so much about handling user data and building secure workflows. If you’re interested, feel free to check out the live project or explore the GitHub repository to dive deeper into the code. Thanks for reading, and happy coding! 😄