Bella Gestor is a high-performance, professional CRM and management solution tailored for beauty salons and wellness centers. Built with a modern tech stack, it streamlines appointment scheduling, client relationship management, financial tracking, and service optimization.
Specifically designed for Spaço Bellas, this platform bridges the gap between administrative efficiency and exceptional customer service.
- Real-time Analytics: Track active clients, daily appointments, and total revenue at a glance.
- Revenue Insights: Visual growth charts showing monthly performance over the last 6 months.
- Service Popularity: Data-driven ranking of the most requested services in the last 30 days.
- Upcoming Agenda: Integrated view of the next 7 days of appointments.
- Google Calendar Sync: Full integration with Google Calendar for seamless scheduling and reminders.
- Flexible Appointments: Support for multiple services, specific professionals, and custom durations.
- Status Tracking: Manage life-cycles of appointments (Scheduled → Confirmed → Completed/Cancelled).
- Comprehensive Profiles: Track contact info, birth dates, referral sources, and notes.
- Visit History: Monitor last visits and lifetime value (total spent) for every client.
- Status Management: Distinguish between active and inactive clients for targeted marketing.
- Sales Workflow: Create sales directly from appointments or as standalone transactions.
- Multi-payment Support: Handle various payment methods with dedicated status tracking.
- InfinitePay Integration: Built-in support for modern payment gateway processing.
- Top Clients Ranking: Automatically identify and reward your most loyal customers.
- Modular Services: Organize services by categories.
- Variant Support: Define multiple variants (e.g., "Short Hair" vs "Long Hair") with different prices and durations for the same service.
- Framework: Next.js 15 (App Router)
- Library: React 19
- Language: TypeScript
- Database & Auth: Supabase (PostgreSQL)
- Styling: Tailwind CSS 4
- UI Components: shadcn/ui & Lucide Icons
- State Management: React Context API (Auth & Data Layers)
- Forms: React Hook Form with Zod validation
- Charts: Recharts
- Integrations: Google Calendar API, InfinitePay
The project follows a clean, layered architecture for maximum maintainability:
├── actions/ # Next.js Server Actions for data mutations
├── app/ # Next.js App Router (Routes and Pages)
├── components/ # UI Library and Feature-specific components
│ ├── features/ # Complex business logic components
│ └── ui/ # Atomic, reusable shadcn/ui-based components
├── hooks/ # Custom React hooks (Data fetching & Logic)
├── lib/ # Core configurations (Supabase, Contexts)
├── services/ # External API integrations (Google, Payments)
├── types/ # Domain-driven TypeScript interfaces
└── public/ # Static assets
- Node.js (Latest LTS)
- pnpm (Recommended)
- Supabase Project
- Google Apps Script (for Calendar integration)
-
Clone the repository:
git clone https://github.com/emanuellcs/bella-gestor.git cd bella-gestor -
Install dependencies:
pnpm install
-
Environment Setup: Create a
.envfile based on.env.exampleand fill in your credentials:NEXT_PUBLIC_SUPABASE_URL=your_supabase_url NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY=sb_publishable_... SUPABASE_SECRET_KEY=sb_secret_... # Add other integration keys as needed
-
Run the development server:
pnpm dev
-
Build for production:
pnpm build pnpm start
Bella Gestor implements a RBAC (Role-Based Access Control) system:
- Admin: Full access to financial reports, professional management, and settings.
- Professional: Access to personal agenda and client details.
- Secretary: Focused on scheduling and client reception.
Developed with ❤️ for Spaço Bellas.