Overview
Klinik Estetika Cahaya is a medical-based aesthetic clinic located in South Bekasi, Indonesia. This project combines a public-facing company profile website with a private internal CRM system built within a single Next.js 14 application.
The main goal of the system is to unify patient acquisition (via landing page) and clinic operational management (via CRM dashboard) into one streamlined digital ecosystem.
System Architecture
The application is divided into two core layers:
1. Public Website (Landing Page — 7 Sections)
The public-facing website is designed as a conversion-oriented informational page with the following structure:
- Hero section with clinic visuals and booking CTA
- Treatment services overview (esthetic procedures list)
- About section featuring clinic profile and Dr. Nadia
- Before & After gallery (placeholder system)
- Patient testimonials
- Online booking request form
- Contact section with embedded Google Maps location
This layer focuses on trust-building, clarity of services, and conversion into booking requests.
2. Internal CRM System
The CRM is restricted to admin and doctor roles and serves as the operational backbone of the clinic.
Core features include:
- Secure authentication using NextAuth.js (Credentials + JWT)
- Patient database management (CRUD with search, filter, server-side pagination)
- Treatment history tracking per patient
- Booking request pipeline (confirm, reschedule, cancel, convert to patient record)
- Follow-up management system (status tracking + reminder scheduling dashboard)
- Analytics dashboard (key metrics cards):
- Total patients
- New bookings
- Pending follow-ups
- Active patients
- Treatments this week
- Data export to CSV (localized labeling for Indonesian workflow)
Security & System Constraints
To ensure data integrity and system safety, the following security layers are implemented:
- Session validation on all CRM API routes
- Middleware protection for dashboard access
- Rate limiting on public endpoints (booking form)
- Strict input validation (phone, email, enum whitelist)
- Lazy database connection strategy for performance optimization
Tech Stack
- Next.js 14 (App Router)
- TypeScript (strict mode)
- Tailwind CSS
- Neon PostgreSQL
- NextAuth.js v4
- Vercel (Deployment)
Scope Limitation
The system does not include:
- Certified EMR (Electronic Medical Record) compliance system
- Payment gateway integration
- Patient self-service portal
- Automated WhatsApp reminder system
Summary
This project demonstrates a hybrid architecture combining marketing-oriented web presence with operational CRM functionality. It is designed to improve patient acquisition flow while maintaining structured internal clinic management in a single integrated platform.