A Next.js web application for local appointment businesses providing a private business dashboard and public booking page with slot picker, featuring schedule recovery autopilot to reduce no-shows.
- Frontend/Backend: Next.js 14+ (App Router)
- Database: Supabase (Postgres + RLS + Realtime)
- Authentication: Supabase Auth
- Styling: Tailwind CSS
- Language: TypeScript
- Node.js 18+ and npm
- Supabase account (supabase.com)
-
Clone and install dependencies:
npm install
-
Set up Supabase:
- Create a new project at supabase.com
- Copy your project URL and anon key from Settings > API
- Run the database schema:
supabase/schema.sqlin the SQL Editor
-
Configure environment variables:
cp .env.local.example .env.local
Update
.env.localwith your Supabase credentials:NEXT_PUBLIC_SUPABASE_URL=your-project-url NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key SUPABASE_SERVICE_ROLE_KEY=your-service-role-key -
Run the development server:
npm run dev
Open http://localhost:3000 in your browser.
frontdeskai/
├── src/
│ ├── app/ # Next.js App Router pages
│ ├── components/ # React components
│ ├── lib/ # Utility functions and configs
│ │ └── supabase/ # Supabase client setup
│ └── middleware.ts # Auth middleware
├── supabase/ # Database schema and migrations
└── public/ # Static assets
- Next.js project setup
- Supabase configuration
- Database schema creation
- Business onboarding flow
- Public booking page with slot picker
- WhatsApp Business API setup
- AI chat with GPT-4o-mini
- Booking via chat
- Waitlist implementation
- Automated cancellation recovery
- Business metrics dashboard
- Mobile responsive design (PWA)