How to vibe codelemcal

Prerequisites

• Node.jsfree

  Runtime environment for building and running the Next.js application.

• GitHubfree

  Version control and deployment pipeline integration.

• 

  Google Cloud Console Accountfree

  Required to configure OAuth2 credentials and webhooks for Google Calendar API integration.

AI coding tools

• Claude Code

  Best-in-class terminal agent for scaffolding full-stack features, database schemas, and complex calendar scheduling logic iteratively.

• Cursor

  Ideal AI code editor for fine-tuning UI components, Tailwind styles, and client-side booking page interactions.

Build guide

1. 01Project Scaffolding & Database Schema

   Initialize the Next.js project with Tailwind CSS, shadcn/ui, and configure Turso SQLite connection via Drizzle ORM.

   Scaffold a new Next.js project using App Router and TypeScript. Install Tailwind CSS and configure shadcn/ui primitives. Set up Drizzle ORM connected to a Turso SQLite database. Create the initial database schema supporting users, calendars, event_types (title, duration, slug, buffer_time), bookings (host_id, guest_name, guest_email, start_time, end_time, status), and availability_schedules (user_id, day_of_week, start_time, end_time). Ensure all foreign keys have appropriate indexes and cascade rules. Write a migration script to apply the schema to Turso.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

2. 02Authentication & User Profiles

   Integrate better-auth for user credential management and unique booking URL profiles.

   Configure better-auth in the Next.js application supporting email/password sign-in and Google OAuth. Create a user profile table extension that stores custom branding fields such as display name, bio, profile image URL, and a unique slug for their public booking page (e.g., app.local/username). Build an authenticated dashboard layout where users can view and edit their profile settings, avatar, and custom slug.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

3. 03Calendar OAuth & Bi-directional Sync

   Implement Google Calendar OAuth connection, token encryption, and external event fetching.

   Implement the Google Calendar OAuth2 authorization flow. Store encrypted access and refresh tokens securely in a connected_accounts table linked to the user. Build a background synchronization service that calls the Google Calendar API (v3/calendars/primary/events) to fetch busy time blocks for a given date range. Handle token refreshing automatically when expired. Add an endpoint that aggregates busy times from all connected calendars for a specific user.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

4. 04Availability Engine & Public Booking Page

   Build the algorithmic availability slot generator and the responsive public booking page UI.

   Build a robust availability calculation engine as a server action or API route. Given a target date, a user's availability schedule rules (e.g., Mon-Fri 9am-5pm), meeting duration, buffer times, and fetched external calendar busy blocks, compute all valid available time slots. Create a public-facing booking page route ([username]/[eventSlug]) that renders a calendar date picker and available time slot buttons. Allow guests to select a slot, input their name, email, and custom pre-meeting answers.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

5. 05Booking Creation & Calendar Event Push

   Handle appointment booking submissions, database persistence, and external calendar event creation.

   Implement the booking confirmation logic when a guest submits a slot. Validate that the slot is still available against race conditions. Insert the booking record into the SQLite database. Simultaneously, call the Google Calendar API to insert a corresponding calendar event on the host's primary calendar with the guest as an attendee and a Google Meet video conference link attached. Return a success state and redirect to a confirmation view.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

6. 06Automated Email Reminders & Polish

   Set up Inngest background jobs to dispatch confirmation and reminder emails via Resend.

   Integrate Resend for transactional email dispatching. Set up Inngest background job functions to automatically trigger a confirmation email to the guest immediately upon booking creation, and schedule reminder emails to be sent 24 hours and 1 hour before the meeting start time. Add error handling and retry logic for failed email deliveries. Polish the overall user dashboard UI with clean toast notifications and responsive styling.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

Cost vs paying for lemcal