AyiekoGershon/Growing-Ministrie-Center-Web

This is the official church website for Growing Missionaries Centre, a ministry based in Isebania, Kenya. The site serves as a digital home for the GMC community — providing information about ministries, service times, church branches, community outreach programs, and ways to give. The site reflects the church's core calling: to love God and love # Growing Missionaries Centre — Church Website A modern, responsive church website for **Growing Missionaries Centre** (Isebania, Kenya). Built with React, TypeScript, Tailwind CSS v4, and Framer Motion. ## Features - **Full-screen video hero** with animated gradient overlay - **Multi-language support** — English / Kiswahili toggle - **Ministry pages** — 9 ministries with detail pages, YouTube playlists, and photo galleries - **Branches page** — 8 branch locations with photo mosaics - **Sermons page** — Embedded YouTube video grid - **Blog / News page** — Update posts with categories - **Online giving** — Bank transfer and M-Pesa details with copy-to-clipboard - **Photo lightbox** — Keyboard-navigable image viewer - **Animated counters** — Scroll-triggered stats - **Responsive design** — Mobile-first, glassmorphism UI - **SEO metadata** — Schema.org JSON-LD, Open Graph tags ## Tech Stack | Tool | Purpose | |------|---------| | React 19 | UI framework | | TypeScript | Type safety | | Vite | Build tool | | Tailwind CSS v4 | Utility-first styling | | Framer Motion | Animations | | React Router v7 | Client-side routing | | Lucide React | Icons | ## Getting Started ```bash npm install npm run dev ``` Open localhost in your browser. ## Build ```bash npm run build ``` Output is in the `dist/` folder, ready for static hosting. ## Project Structure ``` src/ ├── components/ # Reusable UI (Header, Footer, Lightbox, etc.) ├── context/ # Language context (EN/SW) ├── data/ # Site content, translations, sermons, blog ├── lib/ # Utilities (cn helper) ├── pages/ # Route pages (Home, About, Ministries, etc.) ├── types/ # TypeScript interfaces ├── App.tsx # Root component with routing ├── main.tsx # Entry point └── index.css # Tailwind imports + custom theme ``` ## Pages | Route | Page | |-------|------| | `/` | Landing hero (full-screen, no scroll) | | `/about` | Missio …