System Architecture

Understanding the Salonnz architecture will help you make the most of the platform and develop custom integrations.

High-Level Overview

Salonnz follows a modern, microservices-inspired architecture with clear separation between frontend applications and backend services.

Multi-Tenant Architecture

Salonnz uses a Database-per-Tenant approach for complete data isolation.

How It Works

Master Database

Purpose: Central registry of all salon businesses

Key Tables:

• clients - All registered salon businesses
• main_users - Cross-tenant user accounts
• registration_statuses - Onboarding tracking

Example Record:

{
  "id": 50,
  "name": "harry-spa",
  "email": "harry@yopmail.com",
  "additional_data": {
    "database_name": "client_82637",
    "client_id": "82637",
    "shop": "harry-spa"
  }
}

Tenant Databases

Purpose: Isolated data for each salon business

Key Tables:

• appointments - Booking records
• services - Offered services
• staff - Employee records
• clients - Customer database
• payments - Transaction history
• And 50+ more tables...

Tenant Identification

The API identifies tenants using one of:

1. URL Slug: /api/booking/get-services?slug=harry-spa
2. Header: X-Client-Slug: harry-spa
3. Authentication Token: Decoded from user JWT

Application Layer

Backend API (Laravel)

Technology: Laravel + PHP 8+

Responsibilities:

• RESTful API endpoints
• Authentication & authorization
• Business logic
• Database operations
• Payment processing
• File uploads

Key Components:

• Controllers: Handle HTTP requests
• Models: Database entities
• Middleware: Request processing pipeline
• Services: Reusable business logic
• Cache: Redis/File-based caching

File Structure:

Backend-Laravel/
├── app/
│   ├── Http/
│   │   ├── Controllers/
│   │   │   ├── Api/Admin/
│   │   │   └── Api/Online/
│   │   └── Middleware/
│   ├── Models/
│   └── Services/
├── routes/
│   └── api.php
└── database/
    └── migrations/

Admin Panel (Nuxt.js)

Technology: Nuxt.js 3 + Vue.js

Responsibilities:

• Salon configuration
• Staff management
• Service creation
• Reporting & analytics
• Customer management

Key Libraries:

• PrimeVue: UI component library
• Vuetify: Material Design components
• Chart.js: Analytics charts
• Pinia: State management

User Web App (Next.js)

Technology: Next.js 14 + React 18

Responsibilities:

• Online booking interface
• Service browsing
• Payment processing
• Profile management

Key Libraries:

• NextUI: Modern UI components
• Redux Toolkit: State management
• Stripe: Payment processing
• Framer Motion: Animations

Architecture:

Frontend-Userapp-Web/
├── app/
│   └── [slug]/          # Dynamic salon routing
│       ├── booking/     # Booking flow
│       ├── gift-card/   # Gift cards
│       └── profile/     # User profile
├── store/               # Redux slices
└── api/                 # API integration

Mobile App (React Native)

Technology: React Native + Expo

Responsibilities:

• Mobile booking experience
• Push notifications
• Offline capabilities
• Native features

Key Libraries:

• Expo: Development platform
• Redux Toolkit: State management
• React Query: Data fetching
• NativeWind: Styling

Data Flow

Booking Flow

Security

Authentication

• JWT Tokens: Stateless authentication
• Password Hashing: bcrypt with salting
• Session Management: Redis-backed sessions

Data Isolation

• Database Level: Separate databases per tenant
• Query Level: Tenant ID filtering
• Connection Pool: Dynamic connection switching

Payment Security

• PCI Compliance: No card data stored
• Stripe Elements: Tokenized payments
• Webhook Verification: Signed requests

Caching Strategy

Cache Layers

1. Application Cache: Laravel cache for frequently accessed data
2. Query Cache: Database query result caching
3. API Response Cache: Frontend caching with stale-while-revalidate

Cache Keys Pattern

'giftcard_get_list_' . $tenantId
'customers_booking_get_front_settings_' . $slug
'package_get_list_' . $clientId

Cache Invalidation

Automatic invalidation on:

• Settings updates
• Service modifications
• Staff changes

Scalability Considerations

Horizontal Scaling

• API Servers: Load-balanced Laravel instances
• Database: Read replicas per tenant
• File Storage: S3 distributed storage

Vertical Scaling

• Database Indexing: Optimized query performance
• Connection Pooling: Efficient database connections
• Asset CDN: Static asset delivery

Development vs Production

Aspect	Development	Production
API URL	localhost:8000	api.salonnz.com
Database	Local MySQL	Cloud MySQL
Storage	Local files	AWS S3
Cache	File-based	Redis cluster
Email	Mailtrap	SendGrid/SES
Payments	Stripe test	Stripe live

Next Steps

• Installation Guide - Set up your environment
• API Reference - Explore endpoints
• Database Schema - Understand data structure