Web engineering & deployment · Independent deployed software project
Cybersecurity Portfolio Website
A live, custom-built portfolio with a maintainable static publishing pipeline, documented technical work and security-conscious hosting.
A responsive cybersecurity portfolio generated from structured project data, with interactive project discovery, accessible evidence previews, Cloudflare Workers hosting, GitHub Actions CI/CD and automated SEO checks.
- My contribution
- Designed, built, tested and deployed the portfolio website
- Evidence / output
- Live responsive website, static publishing workflow and documented checks
- Scope
- Personal software-engineering project, privacy-first static architecture
Live, independently deployed personal website
09Project case studies after this addition
13Canonical URLs in the updated sitemap
03Browser-tested viewport widths
01 / CONTEXT
Project context
Present varied engineering, security and governance projects in a verifiable, recruiter-friendly format without creating a maintenance-heavy application, exposing private information or implying that simulated security scenarios are production experience.
02 / EXECUTION
What I did
- Designed a responsive, dependency-light frontend using semantic HTML, custom CSS and progressive JavaScript, including phone/tablet layouts, keyboard-friendly navigation and persistent light/dark themes.
- Built a Python static-site generator driven by structured project and skills data. Each case study has distinct metadata, outcomes, limitations and a canonical URL.
- Added searchable and category-filterable project discovery, featured work, a visual technology skills directory, technical notes, contributor summaries and links to source evidence where repositories are public.
- Implemented six locally hosted sanitized evidence screenshots with enlargeable, keyboard-operable previews, four technical notes, conceptual architecture diagrams, and a clearly fictional interactive SOC triage walkthrough.
- Deployed static assets via Cloudflare Workers on a custom HTTPS domain, configured an HTTP 301 WWW-to-root redirect and provided a PowerShell manual deployment fallback.
- Implemented GitHub Actions validation and deployment workflows, Dependabot updates, security-focused HTML/privacy checks, generated XML sitemap and robots.txt, canonical metadata and social preview support.
- Measured selected routes using Lighthouse and carried out a one-time browser smoke test for 360, 390 and 768 CSS-pixel viewports. Fixed issues revealed by accessibility and responsive testing.
- Verified domain ownership in Google Search Console and successfully submitted the original 12-page sitemap; this additional case study expands the sitemap to 13 URLs.
SYSTEM FLOW
Source-to-production publishing flow
- 01Structured project dataJSON project/skills content and verified project evidence
- 02Python static-site generationHTML pages, canonical metadata, sitemap and robots.txt
- 03GitHub Actions validation and deploymentLink/privacy/security checks and controlled Cloudflare publish
- 04Cloudflare Workers and custom domainHTTPS website, static assets and hostname redirect
FEATURE INVENTORY
Implemented features
Responsive interface & accessibility
- Phone, tablet and desktop layouts; semantic headings and landmark navigation.
- Accessible mobile menu, skip-to-content link, keyboard focus management and reduced-motion support.
- Light/dark theme switch with persistent preference and explicit control labels.
- 27 locally hosted stylized technology identifiers grouped by skills and methods.
- Downloadable, phone-free public CV and email/GitHub contact actions.
Project content & interaction
- Nine detailed project case studies with contribution, output, scope, limitations and quantified facts when verified.
- Client-side project search, category filters, result counter and featured-project selection.
- Six sanitized local evidence images with enlarged modal previews, keyboard dismissal and original source links.
- Four technical notes, project architecture flows and documented links to public source evidence.
- Clearly fictional SOC alert-triage walkthrough using self-contained sample events.
- Dated GitHub repository activity snapshot refreshed locally instead of visitor-side tracking.
Engineering & delivery
- Python generator using structured JSON input and committed static HTML output; no production database or API dependency.
- GitHub Actions CI/CD, local validation commands, Dependabot and optional manual Cloudflare deployment fallback.
- Cloudflare Workers static hosting, HTTPS custom domain and permanent WWW-to-root redirect preserving query strings.
- One-time browser smoke tests at 360, 390 and 768px plus selected-route Lighthouse audits.
- Project limitations explicitly distinguish simulated exercises from real-world audit or incident-response work.
Security, privacy & search discovery
- CSP, anti-framing, MIME-sniffing, permissions and referrer security headers.
- No user accounts, client-side analytics, tracking cookies, third-party fonts or runtime GitHub fetches.
- Sanitized screenshots, excluded personal telephone number and conservative privacy checks.
- Page-specific titles/descriptions, canonical links, Open Graph/Twitter metadata and social preview assets.
- Generated XML sitemap, robots.txt, 404 noindex handling, verified Search Console ownership and successful initial sitemap submission.
03 / VERIFICATION
Evidence and outcomes
- The site is live on its custom HTTPS domain, and the pages, project filtering, dark-mode controls, evidence previews, CV download and navigation can be tested directly.
- A measured local Lighthouse audit scored 100 across Performance, Accessibility, Best Practices and SEO on two selected routes at the time of testing; this is not a guarantee of live site performance or WCAG conformance.
- A separate simulated-browser QA run covered eight existing site routes at three viewport widths, image loading, keyboard behavior, theme persistence, search/filter interactions and access to the PDF CV.
- The XML sitemap was accepted by Google Search Console with the initial 12 pages discovered before this ninth project was added; the updated sitemap contains 13 URLs and needs to be recrawled.
- Automated repository checks validate internal links, page metadata, basic accessibility, security configuration, privacy constraints and generated assets.
See the live deployment. The source repository is private.
04 / LIMITATIONS
Limitations
Scope
This is a personal website, not a client engagement or a production multi-user application. Its source repository is private, so the public case study links to the live deployment rather than implying the source is open. Lighthouse and browser-smoke results are point-in-time tests on selected pages and emulated devices. Search Console discovery does not guarantee indexing.