Ticketr is a modern, real-time event ticketing platform built with Next.js, Convex, Clerk, and Razorpay. It features a sophisticated queue system, real-time updates, secure payment processing, and a beautiful, responsive UI.
- Features
- Tech Stack
- Getting Started
- Environment Variables
- Installation
- Setup Guides
- Architecture
- Usage
- Contributing
- License
- 🎫 Real-time ticket availability tracking
- ⚡ Smart queuing system with position updates
- 🕒 Time-limited ticket offers
- 📱 Mobile-friendly ticket management
- 🔒 Secure payment processing with Razorpay
- 📲 Digital tickets with QR codes
- 💸 Automatic refunds for cancelled events
- 💰 Direct payments via Razorpay
- 📊 Real-time sales monitoring
- 🎯 Automated queue management
- 📈 Event analytics and tracking
- 🔄 Automatic ticket recycling
- 🎟️ Customizable ticket limits
- ❌ Event cancellation with automatic refunds
- 🔄 Bulk refund processing
- 🚀 Real-time updates using Convex
- 👤 Authentication with Clerk
- 💳 Payment processing with Razorpay
- 🌐 Server-side and client-side rendering
- 🎨 Modern UI with Tailwind CSS and shadcn/ui
- 📱 Responsive design
- 🛡️ Rate limiting for queue joins and purchases
- 🔒 Automated fraud prevention
- 🔔 Toast notifications for real-time feedback
- ✨ Beautiful, accessible components with shadcn/ui
- 🎯 Instant feedback with toast notifications
- 🎨 Consistent design system using shadcn/ui
- ♿ Fully accessible components
- 🎭 Animated transitions and feedback
- 📱 Responsive design across all devices
- 🔄 Loading states and animations
- 💫 Micro-interactions for better engagement
- Frontend: Next.js, React, Tailwind CSS, shadcn/ui
- Backend: Convex
- Authentication: Clerk
- Payments: Razorpay
- Node.js 18+
- npm or yarn
- Razorpay Account
- Clerk Account
- Convex Account
Create a .env.local file in the root directory and add the following:
NEXT_PUBLIC_CONVEX_URL=your_convex_url
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=your_clerk_key
CLERK_SECRET_KEY=your_clerk_secret
RAZORPAY_KEY_ID=your_razorpay_key_id
RAZORPAY_KEY_SECRET=your_razorpay_key_secret
NEXT_PUBLIC_APP_URL=http://localhost:3000# Clone the repository
git clone <your-repo-url>
cd ticketr
# Install dependencies
npm install
# Start the development server
npm run dev
# In a separate terminal, start Convex
npx convex dev- Create a Clerk application
- Configure authentication providers and redirect URLs
- Add your Clerk keys to
.env.local
- Create a Convex account
- Create a new project
- Install Convex CLI:
npm install convex - Initialize Convex:
npx convex init - Add your deployment URL to
.env.local - Start Convex dev server:
npx convex dev
- Create a Razorpay account
- Generate API keys
- Add keys to
.env.local - Implement Razorpay checkout flow in your frontend
- Implement server-side verification and webhook handling
# Install shadcn/ui CLI
npx shadcn-ui@latest init
# Add components
npx shadcn-ui@latest add toast button card dialog
# Add toaster
npx shadcn-ui@latest add toaster- Database Schema: Events, Tickets, Waiting List, Users
- Key Components: Real-time queue management, rate limiting, automated offer expiration, payment processing, user synchronization
- Sign up as an event organizer
- Complete Razorpay onboarding
- Create event with details and ticket quantity
- Publish event
- Browse available events
- Join queue for desired event
- Receive ticket offer
- Complete purchase within time limit
- Access digital ticket with QR code
- Event organizers can cancel events from their dashboard
- System automatically processes refunds for all ticket holders
- Refund status can be tracked in the user dashboard
- Real-time Feedback: Instant purchase confirmations, queue position updates, error notifications, success page, ticket status
- Interactive Elements: Animated buttons and cards, loading states, progress indicators, skeleton loaders, smooth transitions
Contributions are welcome! Please open issues or submit pull requests for improvements and bug fixes.
This project is licensed under the MIT License.