Karaoke Playlist Management SaaS

Modern and Secure Multi-Tenant Architecture

KaraoNow is a SaaS application designed for managing karaoke event playlists. It provides two distinct interfaces: one for organizers to create and manage events, and another for singers/guests to join events via QR code, search for songs, and track their position in the queue. Built with React 18 and TypeScript, it uses Vite as the build tool, Tailwind CSS 4 for styling, and Fastify with MongoDB for the backend. The focus has been on security, user experience, and multi-tenant isolation.

Technical Stack

**Frontend:**

* React 18 + TypeScript

* Vite for build and development

* Tailwind CSS 4 with custom theme system

* Redux Toolkit for state management

* React Router DOM for navigation

* PWA (Progressive Web App) installable on mobile

* FontAwesome for icons

* i18n support (8 languages: FR, EN, ES, IT, PT, JA, ZH, KO)

**Backend:**

* Fastify (high-performance HTTP framework)

* MongoDB Atlas with Mongoose (ODM)

* Zod for schema validation

* JWT with refresh tokens and httpOnly cookies

* CSRF protection

* Stripe integration for payments and subscriptions

**Shared:**

* Monorepo architecture with `packages/shared`

* Centralized constants, types, and utilities

* Single source of truth for subscription plans and limits

Security and Authentication

The authentication process follows the latest security recommendations:

* JWT with access token (15 minutes) and refresh token (7 days)

* httpOnly cookies to securely store tokens (XSS protection)

* CSRF protection with server-side validation

* Multi-tenant isolation: all data is isolated by organizer (organizerId)

* Role-based access control: organizers, singers, superadmin with granular permissions

* Session rotation on refresh token usage

* Password validation with strength requirements (12+ chars, uppercase, lowercase, digit, special char)

Main Features

**For Organizers:**

* Event creation and management (draft, active, completed, cancelled)

* Venue management (CRUD with Google Maps integration)

* QR code generation for event sharing (PNG/SVG formats)

* Real-time queue management with drag & drop reordering

* Song search via MusicBrainz API with local caching

* Singer management (view participants, remove from queue)

* Subscription management with Stripe integration

* Plan limits enforcement (FREE, PRO, PREMIUM, ULTIMATE, ONE_SHOT)

* Monthly quota tracking with visual progress indicators

* Event hiding/archiving functionality

* Multilingual interface (8 languages)

**For Singers/Guests:**

* QR code landing page (guest mode or account login)

* Intuitive song search interface (simple and advanced search)

* Add songs to event queue

* Real-time queue position tracking

* Personal dashboard (joined events, history)

* User settings (profile, password, data export/deletion)

* Multilingual interface (8 languages)

**Advanced Features:**

* Subscription plans with Stripe integration:

  * FREE: 4 events max, 15 songs per event

  * PRO: 14.99€/month, 3 events/month, unlimited songs

  * PREMIUM: 19.99€/month, 5 events/month, unlimited songs

  * ULTIMATE: 29.99€/month, unlimited events, unlimited songs

  * ONE_SHOT: 9.99€, single event (15 days validity), unlimited songs

* Monthly quota system with rolling period (aligned with Stripe billing)

* Plan limits centralized in shared package (single source of truth)

* Event plan types: `free`, `one_shot`, `subscription` (automatic assignment)

* Anti-fraude measures for ONE_SHOT events (validity period, expiration handling)

* Real-time polling for queue updates (5-minute interval, configurable)

* GDPR compliance (cookie banner, privacy policy, data export, account deletion)

* SuperAdmin dashboard for platform management (organizers, singers, revenue analytics)

Multi-Tenant Architecture

The application is designed to completely isolate each organizer’s data. All backend requests automatically filter by `organizerId`, ensuring that an organizer can only access their own events, venues, singers, and queues. The middleware `requireOrganizer` and `verifyEventOwnership` enforce this isolation at the API level.

Subscription & Billing

* Stripe Checkout integration for subscriptions and one-time payments

* Webhook handling for subscription lifecycle (checkout, updates, cancellations, invoices)

* Automatic plan assignment based on subscription status

* Quota tracking with visual indicators (progress bars, warnings at 80%)

* Upgrade/downgrade support with prorata billing

* Payment history tracking in MongoDB

* Revenue analytics for SuperAdmin dashboard

GDPR Compliance

* Cookie consent banner (RGPD-compliant)

* Complete privacy policy (8 languages)

* Legal notices and terms of service

* Cookie policy with detailed explanations

* Personal data export (JSON format)

* Right to be forgotten (account deletion with cascading)

* Email change with verification

* Password reset with secure token system

PWA Support

* Service worker configuration

* Manifest for mobile installation

* Offline detection banner

* Install prompt component

* Optimized for mobile experience

Internationalization

Full support for 8 languages:

* French (FR)

* English (EN)

* Spanish (ES)

* Italian (IT)

* Portuguese (PT)

* Japanese (JA)

* Chinese (ZH)

* Korean (KO)

Automatic language detection with localStorage persistence. Backend error messages also localized.

Performance & Optimization

* Code splitting with lazy loading

* Optimized Vite chunks (manual chunk configuration)

* MongoDB indexes on frequently queried fields

* Image proxy for external resources (CSP bypass)

* Polling instead of WebSocket for MVP (WebSocket planned for future version)

* Responsive design (mobile-first approach)

Used in production since January 2026.

Resources:

Website : https://www.karaonow.com

Application : https://app.karaonow.com