About the Project

GameShare is born at the intersection of a few observations:

High‐end gaming PCs sit idle up to 80 % of the time, representing a massive untapped hardware‐value pool.
Premium gaming hardware costs \$1,500–\$3,000, putting high-performance play out of reach for many gamers.
New creators and Developers, have a hard time competing in existing marketing due to competitive landscape and oversaturation. Gameshare gives their users a place to try, test and commit.
Storage and commitment, in the modern age many users (teens) don't like committing to a single game and enjoy jumping around and trying new things until they find what they really like. Gameshare is the platform to do just that, try what you want first before committing if you even feel the need to, and save countless gigs of storage and download time in the process.

Pay per hour in tokens with gameshare.

Inspired by Airbnb’s peer-to-peer model, GameShare lets owners monetize idle rigs and lets gamers pay-as-they-play—no big upfront investment required.

What I Learned

Authentication Flows & Edge Cases
– Implemented Steam OpenID through Next.js API routes.
– Wrestled with SSR vs. CSR in Next.js (e.g. wrapping useSearchParams() in Suspense).
Serverless Back-ends
– Built listings and session-booking endpoints in Next.js App Router (Route Handlers).
– Secured operations with @supabase/auth-helpers and service-role calls.
Data Modeling & Atomic Updates
– Designed relational schemas for User, Game, Listing, Session, Transaction.
– Wrote a PL/pgSQL RPC (increment_tokens) for safe, atomic balance changes.
Payment Integrations
– Wired up Stripe Checkout + Webhook for token purchases.
– Handled signature verification and idempotent writes (stripe_session_id).
Retro-Arcade UI
– Crafted a neon, pixel-art interface with Tailwind CSS and Framer Motion.
– Ensured responsive design across desktop, tablet, and mobile.

How I Built It

Frontend
- Next.js 15 App Router + Server Components
- TypeScript for strict typing
- Tailwind CSS + custom “CRT glow” plugin
- Framer Motion animations for button hovers and page transitions
Backend
- Supabase
  - Auth & RLS for user sessions
  - Postgres tables + indexes for listings, sessions, and transactions
  - PL/pgSQL function for atomic token increments
- Steam OpenID via openid npm package
- Stripe Checkout + Webhooks for payments
Flow
1. User clicks Play or Host Now → redirected to /auth if unauthenticated.
2. Steam OpenID login → callback → mint Supabase session → redirect back to original page.
3. Marketplace fetches active listings via /api/listings.
4. Host lists idle PC via /listings/new → frontend POSTs to /api/listings.
5. Renter books a session (tokens pre-paid) via /api/sessions.
6. Host ends session → tokens transferred and transaction records inserted.

Challenges Faced

Case-sensitivity in Postgres
Turns out setting up steam auth and having direct user credentials saved afterward isn't as easy as I thought it would be, so I decided to scale down to not having auth guards for the MVP and having the auth as an interactable UI that still takes you to the steam login page with the credentials, but doesn't have direct session registry yet.
Next.js Suspense error
useSearchParams() required a Suspense boundary; adding <Suspense> around the client-only AuthHandler fixed the build.
Redirecting post-login
Persisting “where to go next” across the Steam login round-trip meant juggling localStorage, query parameters, and Next.js route handlers.
Testing Webhooks locally
Forwarding Stripe events with stripe listen and ensuring idempotent writes into Supabase took some trial and error.

✨ GameShare isn’t just a project, it’s a mission to democratize high-performance gaming by unlocking billions of dollars in idle hardware value while creating a space where anyone can play anything, anywhere.