Welcome to Gangnam Style, a modern, responsive web application demonstrating a hybrid monetization model for accessing powerful AI chat capabilities. Users can interact with different AI models based on a flexible credit system.
Gangnam Style provides a sleek chat interface allowing users to leverage AI for various tasks.
It integrates Google's Gemini models (Flash and Pro) and employs a credit-based system to manage access to premium features, funded through Stripe payments.
- Modern, dark-themed interface optimized for desktop and mobile.
- Includes an Aurora background effect.
- Flash Tier (Free): Access to Google's efficient Gemini Flash model.
- Pro Tier (Credit-Based): Access to the more powerful Gemini Pro model, consuming AI Boost Credits.
- Users receive 100 starter credits upon signing up.
- Real-time credit balance displayed in the UI.
- Pro model usage automatically deducts credits.
- Seamless sign-in/sign-up using Google One Tap.
- Fallback “Sign in with Google” button for manual login.
- Managed securely via Firebase Authentication.
- Integrated Stripe Checkout for purchasing credit packs (currently 100 credits).
- Secure webhook endpoint verifies payments and updates user credits in Firestore.
- Real-time credit updates reflected in the UI.
- User credits managed in Firestore and updated live.
- AI responses formatted using react-markdown.
- Includes an initial “AI is future” typing animation.
- Loading indicators for chat responses and credit transactions.
| Category | Technology |
|---|---|
| Framework | Next.js 14+ (App Router) |
| Language | TypeScript |
| Styling | Tailwind CSS (custom scrollbar) |
| Authentication | Firebase Authentication (Google Provider) |
| Database | Firestore |
| Backend | Next.js API Routes, Firebase Admin SDK |
| AI | Google Gemini API (1.5 Flash, 1.5 Pro) |
| Payments | Stripe (Checkout & Webhooks) |
| UI Components | react-markdown, Custom ShinyText, Aurora |
Gangnam Style operates on a freemium hybrid model:
-
Free Access:
Users chat with Gemini Flash (low-cost model).
(Future: supported by display ads) -
Premium Access:
Uses Gemini Pro, requiring AI Boost Credits.
- New users get 100 free credits.
- Additional credits purchasable via Stripe.
- (Future): Users can earn credits by watching ads.
This model aims to cover API costs for premium AI while maintaining a valuable free tier.
git clone https://your-repo-url/gangnam-style.git
cd gangnam-style