Launch your own professional barbershop booking system in minutes. Free, open-source, and packed with features.
Real-time analytics with revenue tracking, booking stats, and performance metrics
 Bookings Table |
 Booking Cards View |
 Month View |
 Week View (Dark) |
Detailed day view with appointment breakdown
 Customer Messaging |
 Notifications Panel |
Manage services, employees, hours, and shop settings
Full dark mode support across the entire platform
| Feature | Description |
|---|---|
| 🗓️ Smart Booking | Real-time availability, service selection, employee assignment |
| 📊 Analytics Dashboard | Track revenue, bookings, and customer trends |
| 💳 Stripe Payments | Secure payment processing built-in |
| 🌍 Multi-language | English, German, Turkish, Arabic |
| 🎨 Themes | Light, dark, and luxury themes |
| 📱 Mobile-first | Fully responsive design |
| 🔔 Notifications | Email confirmations + in-app alerts |
| 👥 Employee Management | Staff schedules, assignments, permissions |
| ⭐ Ratings & Reviews | Customer feedback system |
| 💬 Messaging | Shop-to-customer communication |
| 📅 Calendar Views | Hours, days, weeks, months view |
| 🔐 Demo Mode | Built-in demo accounts for testing |
┌─────────────────────────────────────────────────────────────────┐
│ Client (React) │
│ ┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────────────┐ │
│ │ Booking │ │Dashboard │ │ Shop │ │ Auth & User │ │
│ │ Flow │ │ Analytics│ │ Landing │ │ Management │ │
│ └────┬─────┘ └────┬─────┘ └────┬─────┘ └────────┬─────────┘ │
└───────┼────────────┼────────────┼────────────────┼─────────────┘
│ │ │ │
▼ ▼ ▼ ▼
┌─────────────────────────────────────────────────────────────────┐
│ Firebase Services │
│ ┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────────────┐ │
│ │Firestore │ │ Auth │ │ Storage │ │ Functions │ │
│ │ DB │ │ │ │ (Images) │ │ (Email/Stripe) │ │
│ └──────────┘ └──────────┘ └──────────┘ └──────────────────┘ │
└─────────────────────────────────────────────────────────────────┘
│ │
▼ ▼
┌─────────┐ ┌─────────────┐
│ Stripe │ │ Mailgun │
│Payments │ │ (Email) │
└─────────┘ └─────────────┘
- Node.js 22
- Java 21 or newer for the Firestore emulator
- No Firebase, Stripe, or Mailgun credentials are required for local demo access
git clone https://github.com/OthmanAdi/BarbersBuddies_Onlineshop_maker.git
cd BarbersBuddies_Onlineshop_maker
npm install
npm --prefix functions installnpm run emulators:startThis command is pinned to the disposable demo-barbersbuddies project and starts Auth, Firestore, Functions, and Storage. On Windows it also applies the short Java temporary path required by the emulator launcher.
Open a second PowerShell terminal:
$env:PORT=3100
npm startOpen http://localhost:3100/auth, then select Enter professional demo.
Production requires a complete Firebase client configuration from .env.example. Partial configuration is rejected. Local persona access is unavailable in production and cannot be forced against live Firebase or a project ID without the demo- prefix.
The local professional persona uses Firebase Anonymous Auth and creates only its own users/{uid} Firestore profile. It has no password or reusable credential. The persona registry and provisioning controller are modular so additional test roles can be added without weakening the environment boundary.
The panel is enabled only when all of these conditions are true:
NODE_ENVis exactlydevelopment.- Firebase is connected to local emulators.
- The Firebase project ID starts with
demo-. REACT_APP_DEMO_ACCESSis not explicitlyfalse.
Run the real emulator-backed contract check with:
npm run test:demo-access:emulator| Layer | Technology |
|---|---|
| Frontend | React 18, TailwindCSS, DaisyUI, Framer Motion |
| Backend | Firebase Functions (Node.js) |
| Database | Firestore |
| Auth | Firebase Authentication |
| Payments | Stripe |
| Mailgun | |
| Storage | Firebase Storage |
| Maps | Google Maps API |
| State | Zustand |
| Charts | Recharts, Tremor |
BarbersBuddies/
├── src/
│ ├── components/ # React components
│ ├── Services/ # API services (Stripe, etc.)
│ ├── utils/ # Helpers (sanitize, logger)
│ ├── hooks/ # Custom React hooks
│ └── store.js # Zustand state management
├── functions/ # Firebase Cloud Functions
├── scripts/
│ └── seed/ # Demo data seeding system
├── public/ # Static assets
└── docs/
└── screenshots/ # App screenshots
Contributions are welcome!
- Fork the repo
- Create your branch (
git checkout -b feature/awesome-feature) - Commit changes (
git commit -m 'Add awesome feature') - Push (
git push origin feature/awesome-feature) - Open a Pull Request
MIT License - see LICENSE for details.
Built with ❤️ for the barbershop community