Project X

Inspiration

At CSUN, discovering active clubs can feel like searching in the dark. Students rely on outdated platforms like Matasync, scattered Discord links, and random Instagram posts. Our team wanted to make campus life more connected — to help students find communities that fit them, while giving clubs better tools to promote themselves effortlessly.

What it does

ClubFinder centralizes all CSUN club events into one modern web app. • Clubs post events once, and they’re automatically shared to Discord and Instagram. • Students can explore events by interests, date, or club, just like browsing a social feed. • Admins can moderate posts to ensure event quality and authenticity.

It bridges the gap between busy students and active clubs, making campus engagement effortless.

How we built it

We built ClubFinder using: • Next.js (App Router) for a fast, responsive frontend • Supabase for authentication (Google OAuth), database, and storage • Discord API for server & channel integrations • Instagram Graph API (Business Login) for automated event posting • Vercel for deployment and hosting

The architecture is modular — each integration (Discord, Instagram, TikTok in the future) has its own /connect/... and /api/... routes.

Challenges we ran into

🧩 Challenges we ran into • Understanding OAuth flows for multiple platforms (Google, Discord, Instagram) • Managing Supabase RLS (Row-Level Security) and permissions for each user type • Handling merge conflicts across multiple active feature branches • Designing a clean and accessible UI/UX that feels intuitive for both students and clubs • Coordinating API callbacks and tokens securely between client and server routes

Accomplishments that we're proud of

• Built a fully functional authentication and onboarding system
• Integrated Discord OAuth and verified posting from a connected bot
• Designed a role-based system separating students and clubs
• Developed an onboarding flow for clubs that leads directly into social media connection
• Created a 3-minute working demo showing end-to-end club setup and event discovery

What we learned

• How to architect multi-service integrations with clean API design
• The importance of secure token storage and refresh flows
• How to build and test features collaboratively using Git branches and Supabase migrations
• How to balance developer experience with user experience — making tech feel invisible

What's next for Project X

• Add Instagram auto-posting after event creation (currently in progress)
• Add TikTok and X (Twitter) integrations for broader visibility
• Implement student profiles and event reminders
• Add analytics dashboards for clubs (engagement metrics, impressions, and post reach)
• Expand ClubFinder beyond CSUN — to other campuses that face the same problem

Built With

• api
• next.js
• react
• rest
• supabase
• tailwind
• typescript