davidmadison.love
Wedding Website
A personal wedding website with a blog, registry, photo galleries, and a fully customizable theme system. Built with React and Supabase, featuring Google OAuth admin access for content management.
About
davidmadison.love is a wedding website built for sharing updates, photos, and event details with family and friends. It features a markdown-powered blog with an admin panel for easy content management, a customizable theme system with multiple color schemes and font options, and photo galleries backed by Supabase Storage.
The admin interface uses Google OAuth for secure access, allowing content updates from any device. Blog posts support markdown with live preview, drag-and-drop file upload, and automatic slug generation.
Key Features
Markdown Blog
Full blog system with markdown rendering, draft/publish workflow, live preview, and drag-and-drop .md file upload.
Theme System
3 color schemes (Sage & Amber, Moss & Burgundy, Mint & Rust) and 6 font options, persisted to localStorage.
Photo Galleries
Responsive image galleries backed by Supabase Storage with public read access and authenticated upload.
Admin Panel
Google OAuth admin access for managing blog posts and uploading images. Full CRUD with automatic slug generation.
Registry
Dedicated registry page for sharing gift registry information with guests.
Bulletin Carousel
Auto-rotating latest updates carousel on the home page showing the 3 most recent blog posts.
Tech Stack
- Vite 7 - Fast build tooling with HMR
- React 19 - UI framework with hooks-based architecture
- TypeScript - Type-safe JavaScript
- Tailwind CSS v4 - Utility-first styling with
@tailwindcss/viteplugin - Supabase - PostgreSQL database, Auth, and Storage
- Vercel - Edge deployment with SPA rewrites
- React Router v7 - Client-side routing
- React Markdown - Markdown rendering for blog posts
Architecture
The site is a single-page application deployed on Vercel with Supabase as the backend. All data is stored in Supabase's PostgreSQL database with Row-Level Security policies controlling access. Public visitors can read published posts, while authenticated admin users have full CRUD access.
- Frontend - Vite + React SPA with React Router for client-side navigation
- Database - Supabase PostgreSQL with RLS policies for access control
- Storage - Supabase Storage buckets for homepage and blog post images
- Auth - Google OAuth via Supabase Auth for admin panel access
- Theming - CSS custom properties with
[data-theme]attribute switching - Deployment - Vercel with SPA rewrite rules for clean URLs