CivicCircle β€” Connecting Communities Through Acts of Kindness

🌍 Inspiration

During the pandemic, many people struggled with isolation, limited mobility, and reduced access to everyday help. Yet, in every neighbourhood, there were also people willing to help β€” they just lacked a simple, trusted way to connect.

CivicCircle was inspired by the idea that social good starts locally. We wanted to build a digital circle where neighbours could support one another through small acts β€” picking up groceries, tutoring, sharing tools, or just checking in on someone nearby.

Our guiding equation for impact was simple:

Each small action contributes to a stronger, more connected society.


🧠 What We Learned

Through this project, we learned how to turn a social concept into a technical product. We practiced:

  • Designing a full-stack web app (React + Express + SQLite).
  • Implementing authentication, RESTful APIs, and simple real-time messaging.
  • Writing clear, modular code that teammates could collaborate on asynchronously.
  • Using GitHub for version control and CI/CD pipelines.
  • Balancing user empathy with technical feasibility in design.

We also deepened our understanding of ethical design β€” ensuring privacy, accessibility, and inclusivity were core to our decisions.


πŸ› οΈ How We Built It

CivicCircle is built using a modern, lightweight stack:

  • Frontend: React (Vite) + Tailwind CSS for responsive design.
  • Backend: Node.js with Express.js, using SQLite for simplicity.
  • Authentication: JSON Web Tokens (JWT).
  • APIs: RESTful routes for users, requests, volunteers, and messages.
  • Deployment: Vercel (frontend) and Render (backend).

Architecture overview:

React (frontend)  ↔  Express (backend API)  ↔  SQLite (database)

We started by sketching wireframes, then built the data model around requests and volunteer interactions. Each user can create or respond to community help requests. Once accepted, they can chat and mark the request as complete.


βš™οΈ Challenges We Faced

Every hackathon project comes with learning moments. Our main challenges were:

  • Time management: Balancing feature ambition with the 2-week deadline.
  • Database design: Structuring volunteer relationships cleanly between users and requests.
  • Authentication flow: Handling token refresh and access control efficiently.
  • UI polish: Making the app mobile-responsive and intuitive under tight time.
  • Collaboration: Coordinating commits and merges from distributed teammates.

Despite these challenges, we managed to complete a functional MVP, demonstrate the full user journey, and deploy it online β€” all while maintaining a focus on social good.


πŸ’‘ What’s Next

After the hackathon, we plan to:

  • Add a map-based view to locate nearby help requests.
  • Introduce reputation badges for volunteers.
  • Expand to multi-language support for accessibility.
  • Partner with local NGOs and community organizations to pilot CivicCircle in real neighbourhoods.

Our vision: Better World = Connected Communities + Active Kindness

Share this project:

Updates