FlutterFlow Course: Doctor Appointment Booking App

Explore building a doctor appointment booking app using FlutterFlow and Supabase, including authentication, data handling, UI design, and time-slot based bookings.

Set up a Flutter Flow project for a doctor appointment booking app and integrate Supabase by configuring API URL and API key, enabling authentication and storage for the next episode.

Set up storage in Supabase by creating an images bucket, choosing public access, and configuring policies to allow authenticated users to insert data, with future focus on authentication.

Enable Google and email authentication in Supabase for the doctor appointment booking app by configuring Google Cloud credentials, OAuth client IDs, redirect URLs, and FlutterFlow integration.

Design an onboarding screen for a doctor appointment booking app using a three-page page view, customize text and images, and refine layout via the widget tree for a polished intro.

Set up signup and login screens with Supabase authentication, enable Google sign-in, and create a users table with uuid, name, email, and phone, including row-level security and get schema.

Run the doctor appointment app in test mode to verify email authentication with Supabase, check the authentication tab for added users, and prepare for sign-in on a physical device.

Create a personalized user profile by building a Supabase users table and collecting name, email, age, height, weight, and goal. Connect authentication, navigation, and web deployment with row-level security policies.

Design the home page of a doctor appointment app, featuring a features row with book clinic appointment and video consultation, plus a specialties section with images and a search field.

Learn to add and fetch doctor specialties from Supabase, build a clinic details table, and display results in a grid view with images for a FlutterFlow appointment app.

Implement a fetch doctors feature in a FlutterFlow app by filtering doctors by a selected specialty and wiring the UI to book appointments with Supabase-backed data.

Design and implement the clinic details screen for the doctor appointment app, fetch clinic timings from Supabase JSON, display banner, name, address, doctors, fees, and navigate with parameters.

Design the book time slots screen in FlutterFlow, showing seven days and morning, afternoon, and evening slots, with custom code to generate slots from clinic timings.

Map day indices to time slots in Flutter Flow, starting Monday as zero, differentiating morning, afternoon, and evening slots with conditional logic and clinic timings from a JSON path.

Implement afternoon and evening time slots in the doctor appointment booking app by updating the book time slot UI with morning/afternoon/evening logic, using duration label and conditional hour ranges.

Create a Supabase appointments table, implement a booking flow for morning, afternoon, and evening slots, and insert the selected time slot and user id when booking.

Create an appointment screen in FlutterFlow to book and view a user's appointments, and fetch clinic details—name, speciality, experience, address—by mapping clinic IDs to clinic records with Supabase.

Learn to build advanced navigation in a doctor appointment app by implementing a custom bottom navigation bar with the convex bottom bar package, drawer navigation, and tab syncing via index.

Build a doctor search in FlutterFlow with Supabase and Dataflow by loading doctors into local state and filtering by specialty via a search field, displaying clinic name, specialty, and thumbnail.