Inspiration
Living in a city, we often encounter various issues such as potholes, broken streetlights, and uncollected trash. However, reporting these problems can be cumbersome, and it’s not always clear if the issues are being addressed. We wanted to create a platform where people can stay informed about the latest news in their city, fostering a sense of community and engagement.
What it does
NReport is a web application that allows users to report neighborhood or city problems directly to the authorities responsible for addressing them. Users can:
- Report issues such as potholes, flood, and burning trash by providing descriptions, uploading photos, and marking the location on a map.
- Track the status of their reports and see updates from the authorities.
- Stay informed with the latest city news through a dedicated news section.
How we built it
NReport was built using modern web development technologies:
- Frontend: We used React for building the user interface, Tailwind CSS for styling, and Vite for bundling and building the project.
- Backend: The backend was developed using Node.js and Express to handle API requests and data processing.
- Database: We used MongoDB to store most of our data with non-primitive data types.
- Authentication: Implemented user authentication and authorization using JWT tokens.
Challenges we ran into
- Integration: Ensuring seamless integration between the frontend and backend was challenging, especially with standarizing REST API made by our team in a short amount of time.
- User Experience: Designing a user-friendly interface that works well on both desktop and mobile devices required significant effort and iterative design changes.
- Data Security: Ensuring the security and privacy of user data was a top priority, which involved implementing robust authentication (jsonwebtoken) and data encryption mechanisms with bcryptjs.
Accomplishments that we're proud of
- Successfully created a functional and intuitive platform that addresses a real need in communities.
- Achieved a smooth and responsive user experience across different devices.
- Implemented a robust reporting and tracking system that allows users to see the status of their reports.
- Developed an integrated news section that keeps users informed about the latest developments in their city with categories, because nowadays it's hard to find the relevant news that we need (Academic, Health, etc).
What we learned
- The importance of user-centered design to improve the application usability.
- Advanced techniques in frontend and backend for managing state and handling asynchronous operations.
- Best practices in backend development for building scalable and secure APIs.
- Effective ways to ensure data integrity and security in a web application.
What's next for NReport
- Mobile Application: Developing a mobile version of NReport to provide users with an even more convenient way to report issues on the go especially with more accurate GPS.
- Enhanced Features: Adding features such as push notifications for report updates, more detailed analytics for authorities, and community discussion boards.
- AI Integration: Exploring the use of AI to automatically categorize and prioritize reports through locals CCTV, making the response process more efficient.
- Partnerships: Collaborating with local governments and organizations to expand the reach and impact of NReport.
- Community Engagement: Introducing features that encourage more community involvement, such as voting on the importance of issues and organizing community clean-up events.
Built With
- express.js
- javascript
- mapbox
- mongodb
- node.js
- react
- restapi
- tailwindcss
- typescript
- vite

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