Where curiosity meets clean systems.
Pantane Hub is a high-performance, minimalist professional portfolio built for W.Martin. It serves as a central showcase for software projects, professional connections, and technical explorations.
- ⚡ Real-Time GitHub Sync: Automatically fetches and displays repositories using the GitHub REST API. Includes dynamic topic chips and language detection.
- 💳 Integrated Payment Ecosystem: A multi-channel support system for global and local transactions featuring direct M-Pesa integration.
- 💨 Optimized UX: Streamlined navigation with a "Direct-to-Action" philosophy, especially for local mobile payments.
- 🛡️ Resilient Architecture: Custom-built script loading logic to prevent crashes in restricted environments and handle SDK failures (like PayPal/Paystack) gracefully.
- 📱 Mobile-First Design: Fully responsive layout with fluid animations and a high-contrast, professional "Bright Mode" aesthetic.
- 🎨 Custom Branding: Unique SVG iconography and consistent design language built from scratch.
Pantane Hub features a robust, multi-tier payment integration designed to facilitate support from anywhere in the world, with specific optimizations for the Kenyan and African markets.
- Integration: Direct link via lipana.dev.
- UX: One-click "Support Now" functionality that bypasses intermediate forms for the fastest possible mobile payment experience in Kenya.
- Purpose: Specifically designed for the 254 market to allow instant support via STK push or till number.
- Integration: Official PayPal JavaScript SDK.
- UX: Interactive "Smart Payment Buttons" for Credit/Debit cards.
- Resilience: Includes an automated Direct Pay Fallback. If the SDK is blocked or restricted, the system generates a secure legacy PayPal checkout link.
- Integration: Paystack Inline JS.
- Market Focus: Preferred for secure card and mobile money transactions across the African continent.
- Integration: Lightweight URI-based redirection.
- Purpose: Provides a non-formal, social way for supporters to contribute with minimal friction.
| Layer | Technology |
|---|---|
| Frontend | React 19 (Functional Components & Hooks) |
| Styling | Tailwind CSS (Utility-first design) |
| Logic | TypeScript (Type-safe systems) |
| Data | GitHub REST API |
| Fintech | M-Pesa (via lipana.dev), PayPal SDK, Paystack |
This project uses ES Modules and modern web standards. Because of browser security policies regarding modules, you cannot simply open the index.html file by double-clicking it.
- Clone the repo:
git clone https://github.com/pantane1/pantane-hub.git
- Run a local server:
- If using VS Code, install the Live Server extension and click "Go Live".
- Or use Python:
python -m http.server - Or use Node:
npx serve .
├── components/ # Reusable UI (Header, Icons, SupportModal)
├── pages/ # Page-level components (Home, Projects, Support)
├── types.ts # TypeScript interfaces & Enums
├── App.tsx # Main router & page controller
├── index.html # Main entry point & script map
└── index.tsx # React mounting logic
© 2025 Wamuhu Martin (Pantane). Built with passion and precision. All rights reserved.
