slidexx

Slidexx - AI-Powered Presentation Generator

A modern web application that leverages AI to create professional presentations effortlessly. Built with Next.js, TypeScript, and multiple AI providers.

🚀 Features

AI-Powered Generation

Multi-AI Provider Support: Seamlessly switch between Claude 4, Google Gemini, and GPT-4
Interactive Chat Interface: Refine your ideas through conversation before generating
Smart Content Creation: AI generates relevant slides with animations and speaker notes
Visual Enhancement: Optional visual AI for improving slide aesthetics

Presentation Management

Real-time Editor: Edit slides with live preview
Folder Organization: Keep presentations organized in custom folders
Export Options: Download presentations in various formats
Speaker Notes: Built-in notes for each slide
Animation Support: Smooth transitions and animations

User Experience

Credit System: Pay-per-slide model with transparent pricing
Subscription Tiers: Free, Pro, Ultra, and Admin plans
Dark Mode: Full dark mode support throughout the app
Responsive Design: Works seamlessly on desktop and mobile
Streaming Responses: Real-time AI generation feedback

🛠️ Tech Stack

Framework: Next.js 15.3.5 (App Router)
Language: TypeScript with strict mode
Styling: Tailwind CSS + Framer Motion
Database: Supabase (PostgreSQL with RLS)
Authentication: Supabase Auth
AI Providers:
- Anthropic Claude 4 (Opus/Sonnet)
- Google Gemini (1.5 Flash/Pro/Ultra)
- OpenAI (GPT-4o/GPT-4o-mini)
Payments: Stripe subscriptions
File Processing: PDF parsing with pdfjs-dist

📋 Prerequisites

Node.js 18+
npm or yarn
Supabase account
API keys for AI providers (at least one):
- Google AI Studio API key
- Anthropic API key
- OpenAI API key
Stripe account (for payment processing)

🔧 Installation

Clone the repository

git clone https://github.com/yourusername/slidexx.git
cd slidexx

Install dependencies
```
npm install
```

Set up environment variables

Copy the example environment file:

cp .env.example .env.local

Fill in your environment variables:

# Supabase
NEXT_PUBLIC_SUPABASE_URL=your_supabase_url
NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key
SUPABASE_SERVICE_ROLE_KEY=your_service_role_key

# AI Providers (at least one required)
GOOGLE_GENERATIVE_AI_API_KEY=your_google_api_key
ANTHROPIC_API_KEY=your_anthropic_api_key
OPENAI_API_KEY=your_openai_api_key

# Stripe
STRIPE_SECRET_KEY=your_stripe_secret_key
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=your_stripe_publishable_key
STRIPE_WEBHOOK_SECRET=your_webhook_secret

# Application
NEXT_PUBLIC_APP_URL=http://localhost:3000

Set up the database

Run the migrations in your Supabase project:
```
# Apply migrations from /supabase/migrations/
```
Start the development server
```
npm run dev
```
Open http://localhost:3000 to see the application.

📝 Development

Available Scripts

# Development
npm run dev          # Start development server
npm run build        # Build for production
npm run start        # Start production server

# Code Quality
npm run lint         # Run ESLint
npm run typecheck    # TypeScript type checking
npm run format       # Format code with Prettier
npm run format:check # Check code formatting

Project Structure

/src
├── app/              # Next.js App Router pages and API routes
│   ├── api/         # API endpoints
│   ├── auth/        # Authentication pages
│   └── dashboard/   # User dashboard
├── components/      # React components
│   ├── features/    # Feature-specific components
│   ├── layout/      # Layout components
│   └── ui/          # Base UI components
├── lib/             # Core business logic
│   ├── services/    # Service layer (AI, file parsing)
│   ├── supabase/    # Database clients
│   └── auth/        # Auth utilities
└── types/           # TypeScript type definitions

Key Files

/src/lib/config.ts - Centralized configuration
/src/lib/services/ai/orchestrator.ts - AI provider management
/src/app/api/presentations/generate/route.ts - Presentation generation endpoint
/src/middleware.ts - Auth middleware (currently disabled for testing)

🧪 Testing

Mock Authentication

For development, you can use the mock login at /auth/mock-login:

Admin email: ycrafty6@gmail.com (unlimited credits)
Regular user: Any other email

Testing AI Providers

Ensure at least one AI provider API key is configured
Test generation with different models
Verify streaming responses work correctly
Check credit deduction (except for admin users)

🚀 Deployment

Vercel Deployment

Push your code to GitHub
Connect your repository to Vercel
Add environment variables in Vercel dashboard
Deploy

Database Setup

Create a new Supabase project
Run migrations from /supabase/migrations/
Enable Row Level Security
Configure authentication providers

Stripe Configuration

Create products and prices in Stripe dashboard
Set up webhook endpoint: /api/stripe/webhook
Configure webhook events (subscription events)

🔐 Security

Row Level Security: All database operations are protected with RLS policies
Authentication: Supabase Auth with JWT tokens
API Protection: Middleware validates authentication on protected routes
Environment Variables: Sensitive data stored in environment variables
Credit System: Prevents unauthorized usage with credit tracking

🤝 Contributing

Fork the repository
Create your feature branch (git checkout -b feature/amazing-feature)
Commit your changes (git commit -m 'Add amazing feature')
Push to the branch (git push origin feature/amazing-feature)
Open a Pull Request

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

🆘 Support

Documentation: Check /CLAUDE.md for detailed development guidance
Issues: Report bugs and request features on GitHub Issues
Contact: [your-email@example.com]

🎯 Roadmap

Built with ❤️ by the Slidexx team