How to vibe codeCalendbook

Prerequisites

• Node.jsfree

  Runtime environment for Next.js and TypeScript development

• GitHubfree

  Source control and deployment pipeline integration

• 

  Google Cloud Console Accountfree

  Required to set up OAuth credentials for Google Calendar and Google Meet integrations

AI coding tools

• Claude Code

  Best-in-class multi-file agentic coding tool for scaffolding full-stack features and fixing complex API integration logic in the terminal

• Cursor

  Ideal for fine-tuning frontend Tailwind layouts and reviewing code diffs interactively

Build guide

1. 01Project Scaffolding & Database Schema

   Initialize a Next.js project with Tailwind CSS, configure Turso SQLite with Drizzle ORM, and set up the core data models for Users, EventTypes, Bookings, and ConnectedCalendars.

   Create a new Next.js TypeScript project using App Router and Tailwind CSS. Initialize Drizzle ORM configured for Turso SQLite. Write the database schema for: users (id, email, slug, timezone), event_types (id, userId, title, description, duration, price, isVisible), bookings (id, eventTypeId, clientName, clientEmail, startTime, endTime, status, paymentId), and connected_accounts (id, userId, provider, accessToken, refreshToken, expiresAt). Implement the database migration files and connection helper.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

2. 02Authentication with better-auth

   Integrate better-auth for secure user registration and login, linking user sessions to the database schema.

   Configure better-auth in the Next.js application to support email/password authentication and Google OAuth login. Create sign-in and sign-up pages using Tailwind CSS and shadcn/ui components. Ensure that upon user registration, a default user record with a unique scheduling slug is generated in the Turso database.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

3. 03Google Calendar OAuth & Sync Setup

   Build the OAuth flow to link external Google accounts and fetch calendar free/busy availability data.

   Implement API routes to handle Google Calendar OAuth connection flow. Store encrypted access and refresh tokens in the connected_accounts table. Write a service function that calls the Google Calendar Freebusy API given a time range and a user's calendar ID, correctly handling token expiration and automatic token refresh logic.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

4. 04Availability Calculation & Public Booking Page

   Create the public scheduling UI where clients can view open slots and book appointments.

   Build a dynamic public booking page at /[username]/[eventSlug] that renders a calendar date picker and available time slots. Write an availability calculation utility that merges user working hours, buffer times between meetings, existing bookings in the database, and busy intervals fetched live from the user's connected Google Calendar. Ensure all slot computations correctly account for client and host timezones.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

5. 05Booking Creation & Google Meet Integration

   Handle appointment form submissions, write bookings to the database, and auto-generate Google Meet video conference links.

   Implement the booking submission server action that validates selected slot availability to prevent double-booking. When a booking is confirmed, use the Google Calendar API to insert an event into the host's calendar with conferenceDataVersion set to create an integrated Google Meet video link. Handle error cases gracefully if the API call fails.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

6. 06Email Notifications & Reminders

   Integrate Resend to send confirmation emails and meeting reminders to both hosts and clients.

   Integrate the Resend API to send automated transactional emails. Create email templates using React Email for booking confirmations containing appointment details, calendar invite files (.ics), and Google Meet links. Trigger confirmation emails immediately upon successful booking creation.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

7. 07Stripe Payments for Paid Events

   Add Stripe Checkout integration so hosts can charge for specific event types before confirming bookings.

   Implement Stripe Checkout integration for event types that have a non-zero price. Update the public booking flow so that selecting a slot redirects the client to a Stripe Checkout session. Create a Stripe webhook handler endpoint to listen for checkout.session.completed events, securely verify the signature, and finalize booking creation in the database only after successful payment.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

Cost vs paying for Calendbook