// Samuel Kwizera — Founder Portfolio // Components const { useState, useEffect, useRef } = React; // ---------- Small primitives ---------- const Pill = ({ children, tone = "ink" }) => { const tones = { ink: { bg: "rgba(20,22,24,0.06)", color: "var(--ink)", border: "rgba(20,22,24,0.08)" }, accent: { bg: "color-mix(in oklch, var(--accent) 12%, transparent)", color: "var(--accent-deep)", border: "color-mix(in oklch, var(--accent) 25%, transparent)" }, ghost: { bg: "transparent", color: "var(--ink-soft)", border: "rgba(20,22,24,0.12)" } }; const s = tones[tone]; return ( {children} ); }; const Dot = ({ live }) => ( ); const SectionLabel = ({ num, children }) => (

{num} {children}

); // ---------- Top nav ---------- function TopNav({ active, onJump }) { const items = [ { id: "work", label: "Work" }, { id: "courtava", label: "Courtava" }, { id: "projects", label: "Projects" }, { id: "skills", label: "Skills" }, { id: "contact", label: "Contact" } ]; return ( ); } // ---------- Hero ---------- function Hero() { const [time, setTime] = useState(""); useEffect(() => { const update = () => { const opts = { timeZone: "Africa/Kigali", hour: "2-digit", minute: "2-digit", hour12: false }; setTime(new Intl.DateTimeFormat("en-GB", opts).format(new Date()) + " CAT"); }; update(); const id = setInterval(update, 30000); return () => clearInterval(id); }, []); return (

{/* Left: copy */}

Building Courtava in Kigali · {time}

Software engineer
building products
people return to.

I'm Samuel — founder of Courtava, a sports community platform helping players find courts, book games and grow local scenes. I design, build and ship — across mobile, web and ML.

{ e.preventDefault(); document.getElementById("courtava").scrollIntoView({ behavior: "smooth", block: "start" }); }} style={{ padding: "13px 22px", borderRadius: 999, background: "var(--ink)", color: "var(--bg)", fontFamily: "var(--ui)", fontSize: 14, fontWeight: 500, textDecoration: "none", display: "inline-flex", alignItems: "center", gap: 10 }}> See the Courtava case study github.com/Samkwizera Get in touch

{[ { k: "Currently", v: "Founder of Courtava" }, { k: "Also at", v: "Velozly · Frontend" }, { k: "Based in", v: "Kigali, Rwanda" } ].map(item => (

{item.k}

{item.v}

))}

{/* Right: portrait */}

{/* Caption strip */}

SAMUEL KWIZERA IHIMBAZWE EST. 2024

{/* Floating cards */}

🏟️

Courtava

Beta · Kigali

Now shipping

Real-time court availability across Kigali

); } // ---------- Marquee of expertise ---------- function Marquee() { const items = [ "TypeScript", "React & Next.js", "Flutter", "Firebase", "Mapbox", "Machine Learning", "Python", "Product Strategy", "B2B SaaS", "REST APIs", "Real-time Systems", "UX Engineering" ]; return (

{[...items, ...items, ...items].map((it, i) => ( {it} ))}

); } // ---------- Summary section ---------- function Summary() { return (

Summary

I build software that ships. From a sports platform connecting Kigali's community to ML systems and B2B SaaS — I move from idea to production end-to-end.

{[ { stat: "1", label: "Product founded", sub: "Courtava — sports community platform" }, { stat: "10+", label: "Apps shipped", sub: "Mobile, web, ML, B2B SaaS" }, { stat: "4", label: "Stacks in production", sub: "Flutter · Next.js · Python · Firebase" } ].map((c, i) => (

{c.stat}

{c.label}

{c.sub}

))}

); } // ---------- Courtava case study ---------- function Courtava() { const [tab, setTab] = useState("product"); const tabs = [ { id: "product", label: "Product" }, { id: "tech", label: "Tech & architecture" }, { id: "traction", label: "Early traction" } ]; const bullets = { product: [ { v: "Designed and shipped a Flutter mobile app", d: "letting players discover, book and review sports courts across Kigali — solving a fragmented, mostly word-of-mouth process." }, { v: "Built real-time court availability", d: "via Firebase Firestore listeners — bookings, cancellations and live status reflected instantly across all clients." }, { v: "Engineered location-aware discovery", d: "with Mapbox: distance-sorted court listings, in-app navigation and neighborhood-level filtering tuned for Kigali geography." }, { v: "Owned end-to-end UX decisions", d: "from onboarding flow to booking confirmation — built a design system that scales across iOS and Android." } ], tech: [ { v: "Architected a serverless backend on Firebase", d: "(Auth, Firestore, Cloud Functions, Storage) — zero infra ops, pay-per-use scaling, ready for spikes around weekend matches." }, { v: "Implemented role-based access", d: "for players, court owners and admins — with secure rules and audited write paths to prevent double-bookings." }, { v: "Designed a modular component library", d: "shared between user app and partner court-owner dashboard for consistent visual language and faster iteration." }, { v: "Built a Next.js + TypeScript marketing site", d: "and partner web portal — same design tokens, same content models, deployed on Vercel." } ], traction: [ { v: "Validated demand with on-the-ground research", d: "across Kigali sports venues — translated player & owner pain points into a focused MVP scope." }, { v: "Onboarded launch-week courts", d: "and ran the first live bookings — using behavior data to prioritize the next sprint's feature set." }, { v: "Iterating on a tight product loop", d: "weekly releases informed by direct user feedback, in-app analytics and venue-side metrics." } ] }; return (

{/* Header */}

02 Featured Case Study

Founder & Lead Engineer · 2024 — Present

Courtava.

The problem: finding and booking a sports court in Kigali still happens over WhatsApp, phone calls and guesswork. Courtava is a real-time sports community platform — discover courts near you, see live availability, book in seconds, and grow your local scene.

e.currentTarget.style.opacity = "0.85"} onMouseLeave={e => e.currentTarget.style.opacity = "1"} > Visit courtava.com

{/* Metrics row */}

{[ { v: "iOS + Android", k: "Platforms shipped" }, { v: "Realtime", k: "Booking sync" }, { v: "Mapbox", k: "Location engine" }, { v: "Solo founder", k: "Design + engineering" } ].map((m, i, arr) => (

{m.v}

{m.k}

))}

{/* Tabs + content */}

{tabs.map(t => ( ))}

{i + 1}
{b.v} — {b.d}

{/* Phone mockup */}

{/* Stack pills */}

Built with

{["Flutter", "Dart", "Firebase Auth", "Firestore", "Cloud Functions", "Mapbox", "Next.js", "TypeScript", "Tailwind", "Vercel"].map(s => ( {s} ))}

); } function CourtavaPhone() { return (

{/* Status bar */}

9:41

{/* Header */}

Tonight in Kigali

Find a court.

{/* Map preview */}

{/* Streets */} {/* Pins */} {[ { x: 20, y: 30 }, { x: 60, y: 60 }, { x: 75, y: 35 } ].map((p, i) => (

))}

3 courts nearby

{/* List */}

{[ { name: "Amahoro Tennis Court", dist: "1.2 km", status: "live", time: "Free at 18:30" }, { name: "Kigali Heights Padel", dist: "2.4 km", status: "busy", time: "Booked till 20:00" }, { name: "Nyarutarama Football 5", dist: "3.1 km", status: "live", time: "Free at 19:00" } ].map((c, i) => (

{c.name}

{c.time} · {c.dist}

))}

{/* Tab bar */}

{["Discover", "Bookings", "Community", "Me"].map((t, i) => ( {t} ))}

); } // ---------- Other experience: Velozly etc ---------- function Experience() { const items = [ { role: "Frontend Developer", org: "Velozly", meta: "Oct 2025 — Present · Remote", tag: "B2B SaaS", bullets: [ "Engineered a high-converting B2B growth landing page in TypeScript and Next.js, directly supporting customer acquisition for the SaaS platform.", "Built a B2B growth blueprint dashboard translating complex business strategy into pixel-perfect, accessible interactive UI components." ] }, { role: "Software Engineering Student", org: "African Leadership University", meta: "2024 — Present · Kigali", tag: "Project-based", bullets: [ "BSc Software Engineering — coursework in Machine Learning, Data Structures, Web Dev, Systems Engineering, DevOps and Databases.", "Built and shipped a portfolio of 6+ project-based applications spanning mobile, web, ML and B2B contexts." ] } ]; return (

Experience

{items.map((it, i) => (

{it.meta}

{it.org}

{it.role}

{it.tag}

))}

); } // ---------- Supporting projects ---------- function Projects() { const projects = [ { name: "AMISAG AI", cat: "AI · TypeScript", desc: "AI-powered virtual networking platform with conversational AI integration.", role: "Builder · End-to-end", year: "2025", github: "https://github.com/Samkwizera/amisag-ai" }, { name: "Kigali City Directory", cat: "Flutter · Maps", desc: "Mobile app connecting residents with hospitals, police, parks and public services across Kigali.", role: "Builder · End-to-end", year: "2025", github: "https://github.com/Samkwizera/individual_assignment_2" }, { name: "GarageGuru", cat: "Flutter · Marketplace", desc: "Two-sided marketplace connecting car owners with garage service providers — dual user roles.", role: "Builder · End-to-end", year: "2025", github: "https://github.com/Bonaeineza31/Garage-Guru" }, { name: "Mwitange", cat: "USSD · SMS · Healthcare", desc: "Connects blood donors with hospitals in real time — designed for low-resource environments.", role: "Builder · End-to-end", year: "2024", github: "https://github.com/Samkwizera" }, { name: "Insurance Predictor", cat: "ML · Python · FastAPI", desc: "Linear regression model predicting US medical insurance charges from demographic & lifestyle factors — live API on Render.", role: "ML Engineer", year: "2025", github: "https://github.com/Samkwizera/linear_regression_model" }, { name: "AirBnB Clone v1 & v2", cat: "Python · Flask · MySQL", desc: "Full MVC architecture with REST API — recreating production patterns end-to-end.", role: "Builder · End-to-end", year: "2024", github: "https://github.com/Samkwizera/alu-AirBnB_clone" } ]; return (

Other projects

Things I've shipped while building Courtava — across mobile, web, ML and civic tech.

{projects.map((p, i) => (

{p.cat}

{p.name}

{p.year}

{p.desc}

{p.role} {p.github ? ( GitHub ) : ( Read more )}

))}

); } // ---------- Skills ---------- function Skills() { const groups = [ { title: "Languages", items: ["TypeScript", "JavaScript", "Python", "Dart", "C++", "Shell", "HTML/CSS"] }, { title: "Frontend", items: ["React", "Next.js", "Tailwind CSS", "Component architecture", "Responsive design"] }, { title: "Mobile", items: ["Flutter", "Firebase", "Google Maps", "Mapbox"] }, { title: "Backend & data", items: ["Node.js", "Flask", "REST APIs", "MySQL", "Firestore"] }, { title: "Machine learning", items: ["scikit-learn", "NumPy", "Pandas", "Matplotlib", "Linear regression", "PCA"] }, { title: "DevOps & tools", items: ["Git/GitHub", "Linux", "Bash", "Nginx", "Vercel"] } ]; return (

Skills

{groups.map(g => (

{g.title}

{it}

))}

); } // ---------- Education + Certs ---------- function Education() { return (

Education & certs

2024 — Present

BSc Software Engineering

African Leadership University · Kigali

Coursework: Machine Learning · Data Structures & Algorithms · Web Development · Systems Engineering · DevOps · Databases.

English Kinyarwanda French

Certifications

{c.t}

{c.o}

{c.y}

); } // ---------- Contact / footer ---------- function Contact() { const [copied, setCopied] = useState(false); const copy = () => { navigator.clipboard.writeText("sam@courtava.com"); setCopied(true); setTimeout(() => setCopied(false), 1500); }; return (

07 Let's build

Have a product worth
building? Let's talk.

e.currentTarget.style.opacity = "0.85"} onMouseLeave={e => e.currentTarget.style.opacity = "1"} > Get in touch

{[ { k: "Email", v: "sam@courtava.com", action: copy, actionLabel: copied ? "Copied!" : "Copy" }, { k: "GitHub", v: "github.com/Samkwizera", action: () => window.open("https://github.com/Samkwizera", "_blank"), actionLabel: "Visit" }, { k: "Location", v: "Kigali, Rwanda", action: null, actionLabel: null } ].map((c, i) => (

{c.k}

{c.v}

{c.action && ( )}

))}

); } // ---------- Tweaks ---------- const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{ "accentHue": 165, "displayFont": "Instrument Serif", "warmth": "warm" }/*EDITMODE-END*/; function TweaksLayer() { const [tweaks, setTweak] = window.useTweaks(TWEAK_DEFAULTS); useEffect(() => { const root = document.documentElement; root.style.setProperty("--accent", `oklch(0.62 0.13 ${tweaks.accentHue})`); root.style.setProperty("--accent-deep", `oklch(0.42 0.13 ${tweaks.accentHue})`); const tones = { warm: { bg: "oklch(0.97 0.005 80)", ink: "oklch(0.18 0.008 60)", soft: "oklch(0.45 0.008 60)" }, cool: { bg: "oklch(0.98 0.004 230)", ink: "oklch(0.18 0.01 230)", soft: "oklch(0.46 0.01 230)" }, neutral: { bg: "oklch(0.97 0 0)", ink: "oklch(0.18 0 0)", soft: "oklch(0.46 0 0)" } }; const t = tones[tweaks.warmth] || tones.warm; root.style.setProperty("--bg", t.bg); root.style.setProperty("--ink", t.ink); root.style.setProperty("--ink-soft", t.soft); root.style.setProperty("--display", `'${tweaks.displayFont}', Georgia, serif`); }, [tweaks]); return ( setTweak("accentHue", v)} /> setTweak("warmth", v)} /> setTweak("displayFont", v)} /> ); } // ---------- App ---------- function App() { const [active, setActive] = useState("top"); useEffect(() => { const ids = ["top", "work", "courtava", "projects", "skills", "contact"]; const onScroll = () => { const y = window.scrollY + 120; let current = "top"; for (const id of ids) { const el = document.getElementById(id); if (el && el.offsetTop <= y) current = id; } setActive(current); }; window.addEventListener("scroll", onScroll, { passive: true }); onScroll(); return () => window.removeEventListener("scroll", onScroll); }, []); const jump = (id) => { const el = document.getElementById(id); if (el) el.scrollIntoView({ behavior: "smooth", block: "start" }); else window.scrollTo({ top: 0, behavior: "smooth" }); }; return ( <>

); } ReactDOM.createRoot(document.getElementById("root")).render();

Software engineer building products people return to.

Courtava.

{p.name}

Have a product worth building? Let's talk.

Software engineer
building products
people return to.

Have a product worth
building? Let's talk.