Jacob Chademwiri - Portfolio Website

A modern, responsive portfolio website showcasing the work and expertise of Jacob Chademwiri, a Full-Stack Web Developer and Project Manager based in Centurion, South Africa.

🌟 Features

• Modern Design: Clean, professional interface with dark/light theme support
• Responsive Layout: Optimized for all devices (desktop, tablet, mobile)
• Performance Optimized: Built with Next.js 15 and Turbopack for optimal loading speeds
• SEO Friendly: Comprehensive meta tags, structured data, and search optimization
• Interactive Components: Smooth animations and user-friendly interactions
• Admin Panel: Comprehensive admin interface for content management
• Email System: Automated email templates and contact form handling
• Database Integration: Drizzle ORM with robust data management
• Content Management: Easy-to-update data structure for projects and information
• Analytics Integration: Vercel Analytics and Speed Insights for performance monitoring

🚀 Quick Start

Prerequisites

• Node.js 18.0 or later
• pnpm (recommended) or npm
• Git

Installation

1. Clone the repository

   git clone https://github.com/jchademwiri/jchademwiri-official.git
   cd jchademwiri-official

2. Install dependencies

   pnpm install

3. Set up environment variables

   cp .env.local.example .env.local

4. Run the development server

   pnpm dev

5. Open your browser Navigate to http://localhost:3000

🛠️ Technology Stack

• Framework: Next.js 16 with App Router
• Language: TypeScript
• Styling: Tailwind CSS
• UI Components: shadcn/ui
• Icons: Lucide React
• Database: Drizzle ORM with database integration
• Email: React-based email templates with automated responses
• Forms: Advanced form handling with validation
• Analytics: Vercel Analytics
• Deployment: Vercel

📁 Project Structure

jchademwiri-official/
├── docs/                          # Comprehensive documentation
│   ├── docs-gpt/                  # GPT-generated documentation
│   ├── docs-me/                   # Personal documentation
│   ├── learn/                     # Learning resources
│   └── tools/                     # Development tools
├── emails/                        # Email templates
├── public/                        # Static assets and images
│   ├── images/                    # Project images
│   └── resumes/                   # Resume files
├── src/
│   ├── app/                       # Next.js App Router pages
│   │   ├── (admin)/              # Admin interface
│   │   │   └── admin/           # Admin panel pages
│   │   ├── (site)/              # Main site pages
│   │   │   ├── about/           # About section
│   │   │   ├── case-studies/    # Case studies
│   │   │   ├── contact/         # Contact page
│   │   │   ├── employment/      # Employment history
│   │   │   ├── insights/        # Blog/insights
│   │   │   └── services/        # Services offered
│   │   ├── globals.css          # Global styles
│   │   ├── layout.tsx           # Root layout
│   │   └── page.tsx             # Home page
│   ├── components/               # React components
│   │   ├── case-studies/        # Case study components
│   │   ├── current-employment/  # Employment components
│   │   ├── forms/               # Form components
│   │   ├── navigation/          # Navigation components
│   │   └── projects/            # Project components
│   ├── data/                    # Static data and content
│   ├── hooks/                   # Custom React hooks
│   └── lib/                     # Utility functions
├── .env.local                   # Environment variables
├── drizzle.config.ts            # Database configuration
└── package.json                 # Dependencies and scripts

📚 Documentation

Comprehensive documentation is available in the docs/ directory:

• Main Documentation - Complete project overview and setup
• Development Guide - Architecture, components, and development workflow
• API Documentation - Data models and interfaces
• Deployment Guide - Deployment strategies and configuration
• Content Strategy - Content planning and messaging
• Development Plan - Comprehensive development roadmap

🎯 Key Sections

Portfolio Highlights

• Professional Experience: 5+ years in web development and project management
• Featured Projects: Showcase of successful client work and personal projects
• Technical Skills: Modern web technologies and project management expertise
• Client Testimonials: Social proof and success stories

Services Offered

• Web Development: React, Next.js, TypeScript, and modern web applications
• Project Management: End-to-end project coordination and delivery
• Business Process Optimization: Workflow automation and digital transformation
• Consulting: Technical strategy and implementation guidance

🚀 Available Scripts

• pnpm dev - Start development server with Turbopack
• pnpm build - Build production version
• pnpm start - Start production server
• pnpm lint - Run ESLint for code quality

🌐 Deployment

The site is optimized for deployment on Vercel:

1. Connect your repository to Vercel
2. Configure environment variables
3. Deploy automatically on push to main branch

For detailed deployment instructions, see the Deployment Guide.

📊 Performance

• Lighthouse Score: 90+ across all metrics
• Core Web Vitals: Optimized for excellent user experience
• SEO Optimized: Comprehensive meta tags and structured data
• Mobile First: Responsive design for all devices

🤝 Contributing

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

📞 Contact

Jacob Chademwiri

• Website: jacobc.co.za
• Email: jacob@jacobc.co.za
• LinkedIn: Jacob Chademwiri
• Location: Centurion, Gauteng, South Africa

---

Built with ❤️ using Next.js, TypeScript, and Tailwind CSS