Kibet Philip — Portfolio

Personal portfolio site for Kibet Philip, a Data Analyst, Statistician, and Data Scientist based in Nairobi, Kenya.

Live site: https://apollop24.github.io/

---

Overview

A static, single-page portfolio built with plain HTML, CSS, and JavaScript — no framework, no build step, no package manager. All portfolio content (skills, tools, projects, testimonials, résumé summary) is stored in one data file and rendered at load time, so adding new content never requires touching markup, styles, or logic.

Features

• Dark and light theme, persisted per visitor, toggled without a page reload
• Auto-scrolling technology stack belt (60 tools) using each tool's real logo where a redistributable one exists, with a labelled fallback badge otherwise
• Auto-scrolling client testimonials belt, slower-paced for readability, pauses on hover
• Project case studies: card grid that opens a modal with challenge, approach, and outcome; optional GitHub / live demo links per project
• Experience & Education section written as a curated summary (role narrative + key highlights), independent of the full résumé — the downloadable PDF remains the complete record
• Contact form that delivers to a real inbox via FormSubmit, with a direct mailto fallback
• Semantic HTML, ARIA labelling, keyboard-operable modal, prefers-reduced-motion support
• Meta tags, Open Graph, Twitter Card, and JSON-LD structured data for search and link previews

Project Structure

.
├── index.html      Page structure and empty content containers
├── styles.css      All styling — theme tokens, layout, components
├── scripts.js      Rendering logic and interactivity (reads data.js)
├── data.js         All content: tools, skills, projects, testimonials, résumé summary
├── resume.pdf      Downloadable full résumé
└── images/         Profile photo, project screenshots, client avatars

Getting Started

No installation and no build step. Either:

• Open index.html directly in a browser, or
• Serve the folder locally, for example: npx serve . or python3 -m http.server

Adding or Editing Content

All content lives in data.js, organised into clearly labelled arrays: TECH_STACK, SKILLS, PROJECTS, TESTIMONIALS, EXPERIENCE_SUMMARY, EDUCATION_SUMMARY, CERTIFICATIONS_HIGHLIGHT. To add an item, copy an existing entry in the relevant array, edit the fields, and save — scripts.js renders whatever is in data.js automatically. index.html, styles.css, and scripts.js should not need to change for a content update.

Configuration Required

Two things depend on setup outside this repository:

• Contact form delivery — the form posts to FormSubmit, addressed to the email set as CONTACT_EMAIL in data.js. The first submission ever sent triggers a one-time confirmation email from FormSubmit to that address; the link inside it must be clicked before submissions are delivered.
• Résumé download — the download buttons link to resume.pdf in the repository root. Replace this file to update what visitors receive.

Deployment

The site is static and deploys as-is to GitHub Pages, Netlify, Vercel, or any static host.

For GitHub Pages: repository Settings → Pages → Source, select the branch and root folder, save. No build command is required.

Built With

Purpose	Technology
Markup / styling	HTML5, CSS3 (custom properties, Grid, Flexbox)
Behaviour	Vanilla JavaScript (ES6+)
Icons	Lucide
Brand logos	Simple Icons, Devicon
Typography	Manrope, Inter, JetBrains Mono
Contact form delivery	FormSubmit

License

Code licensed under MIT — see LICENSE. This covers the HTML, CSS, and JavaScript structure only. The profile photo, résumé, project write-ups, and testimonials are personal content and are not covered by the license.

Contact

Kibet Philip Email: kibetphilip76@gmail.com LinkedIn: linkedin.com/in/kibet-philip GitHub: github.com/Apollop24