Educator Technologist Investor
Helping yousucceed
This is the official website for Andrew Tugume
-
WorkMasters For Workers
- Content for entrepreneurs, freelancers, and employees
- Qraft Academy school
- Millions of community members
-
Bible Study & Discipleship For Bible Scholars
- Scripture teaching and application
- Nations Bible Community
- Millions of community members
-
Leadership Exchange For Leaders
- Bible-based leadership frameworks
- Chariot Leadership Institute
- Millions of community members
Plus TechMasters for technology education across all three pillars.
- Framework: Next.js 14 (App Router)
- Language: TypeScript
- Styling: Tailwind CSS
- Content: MDX for rich content authoring
- Images: Cloudinary CDN
- Deployment: Vercel (recommended)
andrewtugume.com/
src/
app/ # Next.js App Router pages
about/ # About Andrew page
workmasters/ # WorkMasters content
bible-study/ # Bible Study content
leadership/ # Leadership content
schools/ # Four school pages
layout.tsx # Root layout with SEO
page.tsx # Home page
sitemap.ts # Dynamic sitemap
robots.ts # Robots.txt
components/ # Reusable components
Header.tsx # Mobile-responsive nav
Footer.tsx # Footer with social links
AndrewsDesk.tsx # Personal update component
styles/ # Global styles
public/ # Static assets
- Node.js 18+
- npm or yarn
# Clone the repository
git clone https://github.com/tugumeandree/andrewtugume.com.git
cd andrewtugume.com
# Install dependencies
npm install
# Run development server
npm run devOpen http://localhost:3000 to see the site.
# Create optimized production build
npm run build
# Start production server
npm start- Comprehensive metadata and Open Graph tags
- Twitter Card integration (@_drewtugume)
- Schema.org structured data (Person, WebSite)
- Dynamic sitemap and robots.txt
- Semantic HTML with proper heading hierarchy
- Image optimization with Cloudinary
- Fully responsive across all devices
- Hamburger menu with slide-out navigation
- Touch-friendly tap targets (44px minimum)
- Optimized typography scaling
- No horizontal scrolling
- AVIF and WebP image formats
- Static asset caching (1 year)
- Lazy loading for below-fold images
- Gzip compression
- Optimized bundle sizes
- ARIA labels for screen readers
- Keyboard navigation support
- Semantic HTML structure
- Focus management in mobile menu
- Primary: #0F5666 (Teal Blue)
- Accent: #D9A441 (Gold)
- Workers: Blue (#2563EB)
- Scholars: Purple (#9333EA)
- Leaders: Green (#16A34A)
- Technology: Indigo (#4F46E5)
- Font: Inter, system-ui, -apple-system
- Scale: Responsive with breakpoint-aware sizing
npm run dev # Start development server
npm run build # Build for production
npm start # Run production build
npm run lint # Lint code
npm run type-check # TypeScript type checking- Push to GitHub
- Import project in Vercel
- Configure environment variables (if any)
- Deploy
Create a .env.local file for local development:
NEXT_PUBLIC_SITE_URL=http://localhost:3000
GOOGLE_VERIFICATION_CODE=your-verification-code- Google Search Console: Submit sitemap at /sitemap.xml
- Structured Data: Validated with Google Rich Results Test
- Performance: Lighthouse score targets 90+
This is a personal website project. However, if you notice bugs or have suggestions:
- Open an issue
- Submit a pull request
- Reach out on Twitter: @_drewtugume
Content is managed through:
- MDX files for blog posts and lessons
- Component-based pages for main navigation
- Cloudinary for image hosting
MIT License - feel free to learn from this codebase!
- Website: andrewtugume.com
- Twitter/X: @_drewtugume
- Email: Contact form on website
Built with by Andrew Tugume
Integrating faith with work, one line of code at a time.