home page - main section
home page - features section
home page - working steps
home page - top voted issues
register page (citizen and head)
login page (citizen and head)
citizen dashboard
citizen dashboard - problems list
list of problems
problem reporting page
Head dashboard - main
Head dashboard- monitoring issues
Head dashboard - updating problem status
Head dashboard over view
head - problems overview

Community Reporter

Inspiration

Local issues often go unnoticed due to a lack of direct communication between citizens and authorities.
A small unattended issue can turn into a bigger problem.
Since local heads are often unaware of on-ground situations, we built a platform to enable real-time problem reporting and monitoring by the community.

What it does

Citizens can register, log in, and report issues with titles, descriptions, images, dates, and locations.
Reported problems are visible to all and can be upvoted by others in the community.
Local heads access their dashboard to monitor issues, prioritize them, and update statuses to reviewing, completed, or rejected.
Citizens cannot vote on problems once they are marked Completed.

How we built it

Built using the MERN stack:

Frontend: HTML, CSS, JavaScript, React.js
Backend: Node.js, Express.js
Database: MongoDB Atlas
APIs tested with Postman
Development done in VS Code

“Some parts of the code ( API setup, basic frontend structure) were generated with the help of ChatGPT and GitHub Copilot and modified by the team.”

Challenges we ran into

Implementing role-based routing and dashboard control.
Restricting votes for completed problems.
Handling and previewing image uploads properly.
Designing a clean, responsive UI with limited tools.

Accomplishments that we're proud of

Delivered a fully functional web app for community-driven issue tracking.
Created custom dashboards based on user roles with secure login.
Enabled real-time voting and prioritization to support local action.
Promoted civic involvement and transparency.

What we learned

Full-stack web development using the MERN stack.
Managing conditional rendering and user access based on roles.
Image handling, RESTful API building, and real-time UI updates.
How tech can create a real social impact in governance.

What's next for Community Reporter

Add map-based issue tracking using geolocation.
Enable push/email notifications for updates.
Build a mobile-friendly version for easier access.
Partner with local authorities for real-world deployment and feedback.

Community Reporter Logo

Built With

Submitted to

Hidden Leaf Hackathon

Created by

I contributed as a backend developer for the Community Reporter project by building the server-side logic using Node.js, Express.js, and MongoDB Atlas. I developed RESTful APIs to manage user authentication, problem reporting, voting, and status updates, ensuring secure and efficient communication between the frontend and backend. I implemented role-based access control to separate citizen and head functionalities, and structured routes and controllers to maintain a scalable and organized backend. Throughout development, I used Postman to test and validate all API endpoints for reliable performance.

Gnaneswar Thavva
CS student passionate about problem-solving, competitive programming & full-stack dev. Loves learning, building, and collaborating.
I contributed to the frontend of the Community Reporter project using React.js to build dynamic, role-based dashboards for citizens and local heads. I designed responsive pages such as login, register, and report forms using HTML, CSS, and JavaScript. I implemented conditional rendering to tailor the user interface based on roles and problem status. Additionally, I integrated APIs to enable real-time interaction between the frontend and backend.

Duvvu Gnana Prasanna

Updates

Gnaneswar Thavva started this project — Jun 17, 2025 11:48 AM EDT

Leave feedback in the comments!

Log in or sign up for Devpost to join the conversation.