A commemorative website celebrating my parents' 50th wedding anniversary.
A digital space where family and friends can leave heartfelt messages and browse through five decades of memories captured in photos.
This is a personal project created to honor my parents, Iria and Ari, on their 50th wedding anniversary. The website provides a platform for our family and friends to share memories and messages, creating a lasting digital keepsake of this remarkable milestone.
- Header/Hero - Elegant couple presentation
- Countdown - Timer to the celebration
- Photo Gallery - Carousel + thumbnails with lazy loading
- Guestbook - Messages with mandatory moderation
- Family Messages - Special section for children and grandchildren
- Timeline - Important milestones in the couple's life
- Footer - Inspirational quote and credits
- Admin Panel - Moderation via JWT authentication
- Framework: Next.js (App Router) + React + TypeScript
- Styling: Tailwind CSS + Shadcn/ui
- Database: Neon PostgreSQL + Drizzle ORM
- Auth: JWT + bcrypt (stateless, httpOnly cookies)
- Storage: ImageKit CDN (with automatic optimizations)
- Analytics & Monitoring: PostHog (user analytics + error tracking)
- Email: Nodemailer + Vercel Cron Jobs
- Deployment: Vercel
- Testing: Vitest + React Testing Library + PGlite
- Code Quality: Ultracite (BiomeJS)
src/
├── actions/ # Data layer and business logic (Model)
├── hooks/ # State management and presentation logic (ViewModel)
├── components/ # User interface components (View)
│ ├── app/ # Application-specific sections
│ └── ui/ # Reusable UI components
├── lib/ # Utilities and configurations
├── providers/ # Context Providers
└── types/ # TypeScript definitions
For detailed setup instructions, start with the Development Guide.
- Development - Complete environment setup, database configuration, security, and troubleshooting
- Deployment - Vercel deployment process, environment variables, and monitoring
- Changelog - Project history and notable changes
- Golden palette: 11 shades from gold-50 (lightest) to gold-950 (darkest) using OKLCH color space
- Neutral palette: Zinc scale for backgrounds and secondary elements
- All color combinations maintain WCAG 2.1 AA contrast ratio (≥ 4.5:1)
- Body text: Inter - clean, readable sans-serif
- Headings: Playfair Display - elegant serif for titles
- Special text: Dancing Script - handwritten style for emotional touches
- Mobile-first responsive design
- WCAG 2.1 Level AA compliance
- Semantic HTML structure
- Screen reader optimized
- Reduced motion support for animations
Private and proprietary project.