iamkhalid.xyz

Frontend-focused software engineer (BSc Information Technology, 2024) who builds fast, well-tested React and Next.js sites with rich interaction. Built the Bustan Bakers website with CI-enforced performance budgets (178 KB gzipped JavaScript per route) and automated SEO checks, a scroll-driven three.js and GLSL portfolio, and an interactive in-browser course in Svelte 5. Uses AI coding agents such as Claude Code daily, with strict TypeScript, CI and automated tests as the safety net.

Selected projects

2024 – Present

Portfolio

Next.js 16 · React 19 · TypeScript · three.js · Framer Motion · Tailwind CSS

  • Built a scroll-driven homepage as a single three.js WebGL2 renderer with raw GLSL shaders (lensed sky, accretion disk with Doppler and gravitational colour shifts, HDR bloom), keeping per-frame state outside React so components do not re-render each frame.
  • Rendered the About portrait as about 28,000 particles sampled from a photo that stream out of the accretion disk and assemble on scroll.
  • Added pinned scroll scenes, Lenis smooth scrolling, a custom cursor and a command palette, plus a git-backed CMS with GitHub OAuth.

2025 – Present

Bustan Bakers website

Next.js · React · TypeScript · Tailwind CSS · WebGL

  • Built and deployed a statically generated multi-page site on Vercel with scroll-driven CSS animation, a custom cursor, a handwritten-wordmark splash with a morphing page transition and a lazy-loaded WebGL hover shader.
  • Set up a GitHub Actions pipeline that fails the build if any route exceeds 178 KB gzipped JavaScript or 900 KB transfer.
  • Added automated per-route SEO checks (single canonical URL, parseable JSON-LD, prerendered Open Graph images, sitemap match) and an AVIF image pipeline with five responsive widths.

2026 – Present

Invent a GPT course

Svelte 5 · Vite · Python · Pyodide

  • Built a 19-chapter interactive course in Svelte 5 and Vite where learners edit and run real Python in the browser through Pyodide, with interactive visual toys for each concept (12 GitHub stars).
  • Deployed to GitHub Pages with GitHub Actions; the in-browser model is tested against Python reference outputs.

Also built: Kiraya (Flutter, Firebase, 2025), a personal property management app, not published. Computer-Use (Python, Gemini Live API, 2025), a voice-controlled desktop agent (11 stars). WhatsAppGPT (Node.js, 2023), a WhatsApp chatbot on OpenAI and Gemini (17 stars, 15 forks).

Experience

2026 – Present

IT Support Specialist · S&P Global

London, UK

  • Provide technical support to employees at a global financial intelligence and data company, handling incidents and service requests in ServiceNow.
  • Support and troubleshoot employee devices with Microsoft Intune.
  • Support user accounts and access in Active Directory.

Skills

Frontend
React 19 · Next.js (App Router) · TypeScript · JavaScript (ES6+) · Svelte 5 · HTML5 · CSS3 · Tailwind CSS · Framer Motion · three.js · WebGL/GLSL · CSS scroll-driven animation · Responsive design
Performance and SEO
Performance budgets · AVIF and responsive images · Lazy loading · Structured data (JSON-LD) · Open Graph · Sitemaps
Testing and delivery
GitHub Actions CI/CD · Node.js test runner · ESLint · Vercel · GitHub Pages · Git
Backend and data
Node.js · REST API routes · OAuth (GitHub) · Firebase
AI and tools
Claude Code · OpenAI API · Google Gemini API
Other languages
Python · C (C99) · Dart · Bash

Education

2021 – 2024

BSc Information Technology

Graphic Era University, Dehradun, India