Inspiration

I’m a student, and I really wanted to volunteer to help others and grow personally. However, I found it surprisingly hard to locate verified NGOs, suitable volunteering events, and authentic certificates for my resume or college applications. Everything was scattered and unorganized, mainly communicated through random WhatsApp groups.

I realized students need:

  • easy access to nearby events
  • verified NGOs
  • proper certificates
  • clear communication
  • recognition for their efforts

And NGOs need:

  • reliable volunteers
  • easier event management
  • a single communication system

That’s where GiveGo came from, a simple way to connect both sides.

What it does

GiveGo is a pixel-themed volunteering platform where:

🔹 Volunteers can:

  • log in with Google
  • find verified NGO events nearby
  • apply to volunteer
  • join event group chats
  • track volunteering hours
  • gain skills
  • download certificates from completed events

🔹 NGOs can:

  • get verified
  • create detailed events
  • add optional application questions
  • review volunteers
  • manage accepted participants
  • issue customizable certificates

Everything happens in one clean, dark-themed interface.

How we built it

  • Frontend: React with a pixel design and a full dark UI
  • Authentication: Google OAuth
  • Database: Firebase or Supabase, depending on the setup
  • Real-time chat: Firebase Realtime DB or WebSockets
  • Certificate generation: Editable templates turned into downloadable PDFs
  • Role-based dashboards: Separate flows for Volunteers and NGOs

I also used AI tools for debugging, structuring code, planning components, and speeding up development, but I was responsible for the idea, design decisions, and overall architecture.

Challenges we ran into

  • Implementing NGO verification smoothly
  • Making volunteers automatically join event group chats
  • Getting Google OAuth to work without issues
  • Designing a pixel UI that still feels modern
  • Handling event applications and review logic
  • Building a flexible certificate system
  • Managing real-time communication
  • Debugging while under pressure

Each challenge took time but ultimately improved the final product.

Accomplishments that we're proud of

  • Building a fully functioning platform in a limited timeframe
  • Creating a clean and attractive pixel-style UI
  • Developing a smooth flow from event to application, chat, and certificates
  • Successfully integrating Google authentication
  • Creating a genuine tool that helps both students and NGOs
  • Turning a personal challenge into a real product

What we learned

I learned a lot, including:

  • Designing a full role-based system
  • Managing real-time data
  • Integrating Google OAuth
  • Ensuring UI/UX consistency
  • State management across multiple dashboards
  • Dynamically building certificates
  • Using AI as a productivity tool
  • Transforming a personal challenge into a functional product

What's next for GiveGo

  • Add location-based event recommendations
  • Include an in-app certificate designer for NGOs
  • Create a volunteer leaderboard and badges
  • Develop an AI to suggest events based on skills
  • Add an in-app map for events
  • Create a separate mobile app version
  • Offer more certificate templates
  • Introduce multi-language support

GiveGo will continue to evolve, making volunteering easier, more accessible, and more rewarding for everyone involved.

Built With

  • ai
  • and-sdks-runtime/platform:-browser-based-spa-(no-node-backend-in-this-repo)-ai/ml-sdk:-@google/genai-(google-genai-client-library-for-calling-gemini-/-google-ai-models)-tooling:-@vitejs/plugin-react
  • api
  • app
  • application
  • es
  • esnext
  • frontend
  • gemini
  • genai
  • google
  • google/genai
  • javascript
  • javascript-(es-modules)-frontend-framework:-react-(with-reactdom)-build-tool/bundler:-vite-platforms
  • modular
  • modules)
  • node.js
  • npm
  • page
  • react
  • reactdom
  • sdk
  • single
  • spa)
  • tooling)
  • tools
  • typescript
  • typescript-compiler
  • using-google?s-genai-sdk-on-the-client-side.-core-languages-and-frameworks-languages:-typescript
  • vite
  • vitejs/plugin-react
  • web
Share this project:

Updates