MeetMate - Group Scheduling Made Simple

Find time together, without the hassle. No sign-up required.

A modern, mobile-first web application for coordinating group availability without requiring user accounts. Built for friends organizing social events who are tired of outdated scheduling tools.

🎯 Problem Statement

Existing group scheduling tools suffer from:

• Dated interfaces that don't work well on mobile (When2Meet)
• Over-engineered features with aggressive monetization (Doodle)
• High friction requiring accounts and logins
• Poor user experience with no real-time updates

MeetMate solves these problems with a clean, modern interface that works seamlessly on any device.

✨ Key Features

Core Functionality

• 🔗 Zero friction sharing - Create event, get a link, share it
• 📱 Mobile-first design - Touch-optimized calendar interface
• 🚫 No accounts required - Participants just enter their name
• 🔒 Optional password protection - Secure private events
• 🎨 Three-state availability - Available (green), Maybe (orange), Unavailable (red)
• ⚡ Real-time updates - See participants join and respond live
• 🔐 Session management - Edit your availability by returning to the link

For Organizers

• 📊 Visual heat maps - See everyone's availability at a glance
• 🎯 Ranked date suggestions - Algorithm finds best dates automatically
• 👥 Participant tracking - Monitor who has/hasn't responded
• 🔒 Event locking - Finalize dates when ready

🏗️ Tech Stack

Frontend

• Framework: Next.js 14+ (App Router)
• Language: TypeScript
• Styling: Tailwind CSS
• UI Components: shadcn/ui
• State Management: Zustand
• Animations: Framer Motion

Backend

• API: Next.js API Routes
• Database: Supabase (PostgreSQL)
• Real-time: Supabase Realtime subscriptions
• Authentication: Session tokens (no user accounts initially)

Hosting & Deployment

• Platform: Vercel
• Database: Supabase Cloud

🚀 Getting Started

Prerequisites

• Node.js 18+ and npm/yarn/pnpm
• Supabase account (free tier works)
• Git

Installation

1. Clone the repository

git clone https://github.com/yourusername/meetmate.git
cd meetmate

2. Install dependencies

npm install

3. Set up environment variables

cp .env.example .env.local

Edit .env.local with your credentials:

Required Variables:

# Supabase Configuration
# Get these from: https://supabase.com/dashboard/project/_/settings/api
NEXT_PUBLIC_SUPABASE_URL=https://your-project-id.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key-here
SUPABASE_SERVICE_ROLE_KEY=your-service-role-key-here

# Application Configuration
NEXT_PUBLIC_APP_URL=http://localhost:3000

Optional Variables:

# Rate Limiting (Upstash Redis)
# If not set, rate limiting will be disabled (development only)
# For production, you MUST configure Upstash Redis for security
# Get these from: https://console.upstash.com/redis
UPSTASH_REDIS_REST_URL=https://your-redis-instance.upstash.io
UPSTASH_REDIS_REST_TOKEN=your-redis-token-here

# Cloudflare Turnstile (CAPTCHA)
# If not set, CAPTCHA will be disabled (not recommended for production)
# Get these from: https://dash.cloudflare.com/?to=/:account/turnstile
NEXT_PUBLIC_TURNSTILE_SITE_KEY=your-turnstile-site-key-here
TURNSTILE_SECRET_KEY=your-turnstile-secret-key-here

Setting up Upstash Redis for Rate Limiting:

1. Create a free account at Upstash
2. Create a new Redis database (choose a region close to your deployment)
3. Copy the UPSTASH_REDIS_REST_URL and UPSTASH_REDIS_REST_TOKEN from the database details
4. Add them to your .env.local file
5. Set up the database

# Run Supabase migrations
npm run db:migrate

# Or manually run the SQL from /supabase/migrations/001_initial_schema.sql

5. Run the development server

npm run dev

Open http://localhost:3000 to see the app.

🙏 Acknowledgments

• Inspired by When2Meet and Doodle
• Built with shadcn/ui
• Icons from Lucide
• Hosted on Vercel
• Database by Supabase

🎓 Learning Resources

• Next.js Documentation
• Supabase Guides
• Tailwind CSS Docs
• shadcn/ui Components
• TypeScript Handbook

Made with ❤️

Bringing friends together, one date at a time.