nafi@portfolio:~$
bash — ~/projects/game-terminal
$cd ~/projects/game-terminal && cat summary.txt
Digital storefront for games and subscriptions — mobile-first Next.js frontend with persistent support channels (Discord, WhatsApp, Facebook) embedded directly in the UI for conversion-focused flow.

GAME TERMINAL

Full-Stack Developer · #a3f9e21 main
Next.js · React · Node.js github.com/sleepyhead000
~/projects/game-terminal $

cat README.md

README.md
$cat overview.txt
Architected a comprehensive digital storefront for selling digital games and subscription tiers. The brief: build a mobile-first, highly responsive frontend that loads fast and converts visitors through persistent, low-friction support channels.
$cat frontend.txt
Built with Next.js (React) using server-side rendering for SEO-critical product pages and static generation for marketing content. Implemented a performance budget: LCP < 2.5s on 3G, critical CSS inlined, font-display: swap, and lazy-loaded below-fold assets. Designed a component system with strict mobile-first breakpoints — navigation collapses to a drawer, product grids reflow fluidly, touch targets meet 48dp minimum.
$cat integration.txt
Integrated persistent contact channels directly into the UI header and product pages: Discord widget (server invite + member count), WhatsApp click-to-chat with prefilled messages per product, Facebook Messenger plugin. Each channel triggers a custom event for attribution. Node.js/Express backend handles webhook verification for Discord/Stripe, order processing, and license key delivery via email.
$cat outcome.txt
Launched on schedule. Mobile conversion rate exceeded desktop within 60 days. Support volume shifted 70% to Discord/WhatsApp, reducing email ticket load. Architecture scales horizontally via Vercel edge functions for the frontend and containerized Node workers for backend jobs.
~/projects/game-terminal $

ls -l features/

catalog
Dynamic product grid with category filters, search, and infinite scroll
checkout
Stripe integration · webhook-verified orders · instant license delivery
support
Discord widget · WhatsApp click-to-chat · Messenger plugin — all with attribution events
performance
SSG/SSR hybrid · inlined critical CSS · font-display: swap · lazy images
responsive
Mobile-first breakpoints · drawer nav · fluid grids · 48dp touch targets
backend
Node.js/Express · webhook handlers · email delivery · license generation
~/projects/game-terminal $

cat stack.yaml

framework
Next.js 13+ (App Router)
runtime
React 18 · Node.js 20
styling
CSS Modules · CSS Variables · mobile-first media queries
payments
Stripe (Checkout + Webhooks)
hosting
Vercel (edge functions) · Docker (backend workers)
analytics
Custom event layer → GA4 / Mixpanel
~/projects/game-terminal $

git log --oneline

#f1e2d3cfeat/catalog

Product catalog with dynamic filtering

Next.js · CSS Modules
  • Server-rendered product pages with JSON-LD structured data for SEO.
  • Client-side filter state synced to URL query params (shareable links).
  • Infinite scroll with IntersectionObserver; 60fps on mid-tier mobile.
#e2d3c4bfeat/checkout

Stripe Checkout + webhook fulfillment

Node.js · Express · Stripe
  • Idempotent webhook handler with retry logic and dead-letter queue.
  • License key generation (UUID v4 + checksum) delivered via transactional email.
  • Order status page with real-time polling fallback for webhook delays.
#d3c4b5afeat/support

Persistent support channels

React · Discord API · WhatsApp Business · Messenger
  • Discord widget: server invite, online member count, direct DM button.
  • WhatsApp: deep link with product-specific prefilled message template.
  • Messenger: customer chat plugin with greeting flow per product category.
#c4b5a69perf/mobile

Mobile performance budget enforcement

Next.js · Web Vitals · Lighthouse CI
  • LCP < 2.5s on simulated 3G; CLS < 0.1; TBT < 200ms.
  • Critical CSS extracted and inlined per route; non-critical deferred.
  • Lighthouse CI gate in PR pipeline — regressions block merge.
#b5a6978infra/deploy

CI/CD & horizontal scaling

GitHub Actions · Vercel · Docker · GitHub Container Registry
  • Frontend: preview deployments per PR; production on main with cache invalidation.
  • Backend: multi-stage Docker build; GitHub Actions push to GHCR; deploy to Railway.
  • Environment secrets via GitHub Environments; zero-downtime rolling updates.