KMJ Catering & Events
KMJ Catering & Events is a responsive, single-page marketing website built for a premium Nigerian catering and event planning business. The site showcases the client's services, signature menu, photo gallery, and customer testimonials through a polished UI featuring a hero image carousel, scroll-reveal animations, and an EmailJS-powered contact form — all with zero JavaScript framework dependencies.
Project Screenshots
01 — The Challenge
No Online Presence to Drive Bookings
KMJ Catering & Events had an established local reputation but no professional web presence to showcase their services, attract new clients, or capture event bookings online.
02 — The Strategy
Build them and Online presence in the form of a Website
Built as a single HTML file with a companion script, the site leverages Tailwind CSS via CDN for rapid, utility-first styling and vanilla JavaScript for all interactivity. EmailJS was integrated for instant serverless contact form delivery without a backend.
03 — The Impact
Polished, Production-Ready Site in Two Files
The entire site ships as just two files — index.html and script.js — with no build step required. Seven fully animated sections cover every business need: hero, services, menu, gallery, testimonials, about, and contact. Dark mode, a responsive mobile menu, and smooth-scroll navigation ensure a seamless experience across all devices and screen sizes.
Frontend Architecture
CDN Stack & Serverless Form Delivery
HTML5 Markup → Tailwind CSS CDN → Vanilla JS IntersectionObserver → EmailJS API
UI & Styling System
Tailwind CSS is loaded from CDN with a custom config extending the brand palette (primary pink, secondary purple, accent orange) and typography (Poppins + Playfair Display via Google Fonts).
Animations & Interactivity
All animations are handled by vanilla JavaScript with no libraries. A hero background carousel crossfades four images every 5 seconds with clickable dot indicators. The testimonials carousel supports prev/next navigation and auto-advances every 4 seconds.
Contact Form & Email Delivery
The contact form submissions are sent directly from the browser to a pre-configured EmailJS template, delivering full booking enquiry details — name, email, phone, event type, and message — straight to the client's inbox with no server required.
Lessons & Trade-offs
Vanilla JS vs. a UI Framework
Choosing vanilla JavaScript over React or Vue was a deliberate trade-off for this project. For a static marketing site with a modest interaction surface, a framework would have added build tooling complexity and bundle overhead with no real benefit.