GDGoC Agra Chapter Web App

A production-ready web platform for Google Developer Groups on Campus - Sharda University Agra.

This repository powers:

• A public-facing chapter website (events, members, gallery, resources, blog, contact)
• A role-based admin dashboard for content and team management
• A Supabase-backed data layer (Auth, Postgres, RLS, RPC, Storage)

Live domain: https://gdgagra.xyz
Deployment: Vercel

Table of Contents

• Project Overview
• Screenshots
• Core Features
• Tech Stack
• Architecture
• Admin Roles and Access
• Database and Backend Design
• Local Development
• Supabase Setup
• Deployment
• Repository Structure
• Legacy Prototype Folder
• Troubleshooting
• Author

Project Overview

This project is built as a complete chapter operations platform, not just a showcase site.

It allows the GDGoC team to:

• Publish and manage events with detailed timelines/themes/prizes
• Manage member hierarchy (Lead Organizer, Heads, Co-Heads, Executives)
• Publish blog posts and learning resources
• Curate community gallery content
• Operate through a secure admin panel with role-based permissions

It allows visitors to:

• Explore upcoming/live/completed events
• View event details pages
• Browse team members and chapter structure
• Discover resources and interact via likes/views
• Read published blogs and connect through contact channels

Screenshots

Home Page

Admin Dashboard

Core Features

Public Website

• Home page with animated hero and featured events
• Events listing with category filters and status segmentation (Live, Upcoming, Completed)
• Event detail pages with schedule, themes, and prize sections
• Members page powered by hierarchical RPC ordering
• Gallery timeline and category filtering
• Resources page with search, category filters, likes, and detail pages
• Blog page with category filtering and published-only visibility
• Contact page with chapter information and FAQs
• Light/Dark mode using persisted theme preference

Admin Panel

• Secure login workflow integrated with Supabase Auth + custom RPC validation
• Role-aware navigation and feature gating
• Dashboard overview cards and recent activity
• CRUD management modules:
  • Admins
  • Events
  • Members
  • Blog posts
  • Gallery
  • Resources
• Media uploads to Supabase Storage buckets (event images, member profiles, resource thumbnails)

Tech Stack

Frontend

• React 19
• React Router DOM 7
• Vite 6
• Tailwind CSS 3
• Framer Motion
• Lucide React + React Icons

Backend and Data

• Supabase (PostgreSQL, Auth, Storage, RPC)
• Row Level Security (RLS) for role-based data security
• SQL trigger functions for validation, slug generation, audit logs, and timestamps

Deployment

• Vercel (SPA rewrite configured via vercel.json)
• Custom domain: gdgagra.xyz

Architecture

App Routing

• / Home
• /events Events list
• /events/:eventId Event details (slug/id-based lookup)
• /members Members
• /gallery Gallery
• /resources Resources list
• /resources/:slug Resource details
• /blog Blog
• /contact Contact
• /admin Admin portal
• /builder Creator profile page

State and Context

• ThemeContext for light/dark mode persistence
• AdminContext for auth session, admin role checks, and access control helpers

Data Access Pattern

• Public pages use direct table reads and RPC functions depending on use case
• Admin modules use table operations and secure RPC procedures for sensitive actions
• Storage file uploads are organized by entity ID-based paths

Admin Roles and Access

The project defines three admin types:

• super_admin
  • Full access (Admins, Members, Events, Gallery, Blogs, Resources)
• admin
  • Events + Gallery + content operations
• least_access_admin (Content Admin)
  • Blogs + Resources

Key behavior:

• Super Admin can manage admin accounts and full member data
• Non-super admins are restricted by RLS and service-side RPC checks
• Blog and resource visibility is owner-aware for non-super admins in admin workflows

Database and Backend Design

Main Tables

• admins
• events
• event_timeline_items
• event_themes
• event_prizes
• members
• resources
• blog_posts
• gallery_items
• audit_log

Important SQL Capabilities

• Auth and role helper functions (is_super_admin, is_admin, etc.)
• Admin login validation and admin account lifecycle RPCs
• Members hierarchy RPC and management procedures
• Resource RPCs for listing, detail retrieval, likes, and views
• Trigger functions for:
  • Slug generation
  • Date validation
  • Audit logging
  • updated_at maintenance

Storage Buckets

This app expects the following Supabase Storage buckets:

• event-images
• member-profiles
• resource-thumbnails

Storage access is governed by policies in supabase/storage.sql.

Repository Structure

.
|-- src/
|   |-- components/
|   |   |-- admin/
|   |-- context/
|   |-- lib/
|   |-- pages/
|   |-- utils/
|-- supabase/
|   |-- schema.sql
|   |-- functions.sql
|   |-- trigger-functions.sql
|   |-- rls-policies.sql
|   |-- storage.sql
|-- gdg/
|-- public/
|-- vercel.json

Legacy Prototype Folder

The gdg/ directory contains an earlier static multi-page version of the chapter website (HTML/CSS/JS).
The primary production app is the React + Vite implementation in src/.

Troubleshooting

• Missing Supabase env vars
  Ensure .env.local contains VITE_SUPABASE_URL and VITE_SUPABASE_ANON_KEY.

• Admin login not working
  Verify matching values in admins table for email, team, and position, and ensure the related Auth account exists and is active.

• Images not uploading
  Confirm buckets exist and storage policies are applied.

• Empty public data sections
  Check content status rules (published, upcoming, live, completed, is_active) and RLS policy behavior.

Author

Mohsin Ansari
Built for GDGoC Sharda University Agra.

---

If this repo helps your GDGoC chapter, consider forking it and adapting the data model, team structure, and branding for your own campus community.