Skip to main content

Abdul Hadi Khan — About Me

Emailahkn63@gmail.com
LinkedInin/abdul-hadi-khan
LocationMississauga, Ontario, Canada
YouTube@learningexpressway
GitHubAbdulDevHub
PortfolioAbdulHadiKhan
Shopify Storelearningexpressway.com

Career Target

  • Role type: Full-stack software engineer, TypeScript/Node.js focused — open to backend-leaning or AI-focused roles
  • Timeline: Graduating April 2027, actively targeting full-time roles
  • Preferred companies: Tech or AI-focused, companies where TypeScript and cloud-native stacks are standard
  • Location preference: Remote or hybrid in Canada

Education

University of Toronto — HBSc Computer Science

August 2021 – April 2027 (expected)

Skills developed:

  • Practiced UI/UX design & Human-Computer Interaction using Figma and W3C accessibility standards
  • Applied software development skills in Python, Java, TypeScript, and C, focusing on clean, maintainable code
  • Used Git and GitHub for version control and team collaboration
  • Conducted usability testing and debugging with IntelliJ, VS Code, and PyCharm
  • Worked in Agile/Scrum teams, refining leadership, communication, and project management
  • Gained experience in Linux, Git BASH, and CI/CD for automated testing and deployment
  • Built a strong mathematical foundation for problem-solving in software and game design

Completed coursework:

CodeCourse
CCT109H5Contemporary Communication Technologies
CSC108H5Introduction to Computer Programming
ISP100H5Writing for University and Beyond
MAT102H5Introduction to Mathematical Proofs
MAT135H5Differential Calculus
CCT110H5Rhetoric and Media
CCT111H5Critical Coding
CSC148H5Introduction to Computer Science
MAT136H5Integral Calculus
EDS285H5The Future of Ed Tech: Active Learning Classrooms and Artificial Intelligence
CCT208H5Communications Research Methods
CSC207H5Software Design
CSC236H5Introduction to the Theory of Computation
EDS100H5Introduction to Education Studies
CCT211H5Fundamentals of User Interface Programming
CCT212H5Hacker Culture
CSC209H5Software Tools and Systems Programming
MAT223H5Linear Algebra I
CCT380H5Human-Computer Interaction and Communication
CCT270H5Principles in Game Design
CCT285H5Immersive Environment Design
CCT320H5Communication, Technology, and Social Change
MAT232H5Calculus of Several Variables
STA256H5Probability and Statistics I
CCT286H5Interactive Media Design
CCT416H5Social Data Analytics
CCT478H5UX Design — Prototyping and Evaluation
CSC301H5Introduction to Software Engineering
PEY400Y1Professional Experience Year Co-op
CCT205H5Digital Innovation and Cultural Transformation
CCT477H5UX Design — Understanding Users
CCT382H5Prototyping Digital Games
CCT432H5Ethics and Code
CSC258H5Computer Organization
CSC263H5Data Structures and Analysis
CSC311H5Introduction to Machine Learning
CSC363H5Computational Complexity and Computability
CSC343H5Introduction to Databases (in progress)

Upcoming coursework:

CodeCourse
CSC367H5Parallel Programming
CSC373H5Algorithm Design and Analysis
CSC384H5Introduction to Artificial Intelligence
CSC413H5Neural Networks and Deep Learning
CSC309H5Programming on the Web

Scrimba — Programming & Web Development

December 2020 – Present

Interactive code-learning platform with over a million users worldwide, featuring hands-on courses in programming and web development.


Certifications

  • AWS Certified Cloud Practitioner (CLF-C02) — passed May 24, 2025
  • The AI Engineer Path — Scrimba
  • The Frontend Developer Career Path — Scrimba
  • AWS Cloud Practitioner Essentials — LinkedIn Learning
  • Career Ready Student — Digital Technologies, Summer 2024

Work Experience

InsideDesk — Junior Software Engineer

May 2024 – April 2025 (1 year) | Canada

Impact metrics (use these in every relevant story):

  • Reduced insurance claim processing from 2–3 minutes per claim to seconds
  • Built 7 scrapers responsible for ~20% of total daily volume (42,500+ claims/day)
  • Total platform processes 220,000+ insurance claims daily
  • Designed API-driven systems cutting run time from 2 hours to 10 minutes
  • Reduced error rates from 20% to 1.5%
  • Reviewed 80%+ of all PRs with detailed, actionable feedback
  • Team size: 7–9 engineers, Agile/Scrum with daily standups and bi-weekly sprint planning

Key contributions:

  • Automated the extraction of millions of insurance claims from web portals using TypeScript, AWS, and Node.js
  • Developed and maintained 80+ automated web scrapers processing 220,000+ insurance claims daily
  • Designed cloud-native infrastructure using AWS Lambda, Fargate, CloudWatch, IAM, and S3 with event-driven pipelines
  • Co-developed a secure MFA tooling system using SES, Lambda, Redis, and SNS to parse and forward MFA codes
  • Built Python CLI tools to streamline repetitive engineering tasks and improve developer productivity
  • Participated in UI development using React, MUI, and Vite; experimented with AI tools (Claude, a Bedrock wrapper library) to auto-generate code templates
  • Ensured HIPAA compliance in managing sensitive patient data
  • Improved onboarding by auditing, updating, and creating documentation in Confluence
  • Collaborated cross-functionally via Slack, Jira, and daily standups

Recommendation from Stewart McKinlay (Team Lead / Supervisor), May 1, 2025:

"Supervising Abdul during his co-op term was an absolute pleasure. He made significant contributions to our team, primarily focused on maintaining our microservices through diligent bug fixing and strategic rewrites. Abdul brought fantastic energy and a proactive mindset to the role. His 'get things done' attitude meant he didn't wait to be assigned tasks; he actively sought out challenges and developed creative, effective solutions. His reliability was outstanding, particularly in code reviews where he was often the first to respond and could always be counted on for critical PRs. Moreover, Abdul left a lasting impact by elevating our documentation practices to a new level. He's a proactive, dependable, and innovative engineer, and it was a privilege to mentor him. I highly recommend Abdul."


Studica — Robotics Programmer

February 2020 – March 2020 (2 months) | Mississauga, ON

  • Collaborated in a team to build robots for assembly and customer use
  • Tested functionality of robotic products to ensure customer satisfaction
  • Documented product abilities and specifications for manufacture reference
  • Assembled and operated a 3D printer for product creation and custom builds

Technical Skills

Languages

  • TypeScript — primary language, production experience at scale
  • JavaScript — strong foundation
  • Python — CLI tooling, scripting; some rust since InsideDesk
  • SQL — PostgreSQL; strong via formal coursework (CSC343) + self-study
  • Go — used in Opal Labs backend (team project); REST API, PostgreSQL, Redis, Go testing framework
  • Java — learned via UofT coursework (CSC207, CSC148)
  • C — learned via UofT coursework (CSC209)
  • C# — familiar; used in Unity games (Sunken Secrets, Surf n' Turf, Shadow of a Doubt)
  • Kotlin — Android development; used in Android Mountain learning project
  • HTML / CSS — strong foundation; used throughout web projects
  • Liquid — Shopify templating language; used in Learning Expressway theme customization

Frontend

  • Next.js — production-familiar; some rust, actively refreshing
  • React — component design, hooks; some rust, actively refreshing
  • Redux Toolkit — global state management; used in Filmverse
  • Vue.js — familiar
  • Nuxt.js — familiar
  • Svelte — familiar
  • MUI (Material UI) — used in production at InsideDesk
  • shadcn-ui — accessible component library; used in CaseCobra
  • Tailwind CSS — familiar
  • GSAP — animation library; familiar
  • Three.js — 3D web graphics; used in Portfolio V2
  • Vite — used in production at InsideDesk
  • Anime.js — JavaScript animation library; used in Console Wars Exhibition (3D sphere)
  • Plyr.js — custom HTML5 video player; used in Console Wars Exhibition
  • Prismic — headless CMS with page builder; used in Glisten AI project
  • Storybook — component development and documentation; used in Opal Labs
  • Responsive Design — practiced across web projects
  • Accessibility (W3C) — practiced via UofT coursework (CCT380, CCT478)

Backend

  • Node.js — deep production experience
  • Hono — REST API design, routing, middleware, error handling
  • Express — familiar (Hono-transferable)
  • Prisma ORM — schema design, migrations, relations, transactions
  • Supabase — familiar
  • Firebase — familiar
  • Stripe — payment integration; familiar (webhook HMAC verification pattern)

Databases

  • PostgreSQL — schema design, joins, aggregations, indexing, ERDs
  • Redis — caching (TTL, cache invalidation), rate limiting (INCR/EXPIRE), session storage, pub/sub; direct usage via ioredis/node-redis

Cloud & DevOps

  • AWS Lambda — production (event-driven pipelines, scraper orchestration)
  • AWS Fargate — production (containerized workloads)
  • AWS CloudWatch — production (observability, logging)
  • AWS IAM — production (roles, policies)
  • AWS S3 — production (file storage)
  • AWS SES / SNS — production (MFA code delivery, notifications)
  • AWS CLI — familiar
  • Docker — Dockerfile authoring, docker-compose, multi-service local environments
  • GitHub Actions — CI/CD pipelines (type-check, test, lint, Docker build on push)
  • Cloudflare — familiar
  • Linux / WSL — familiar; used via UofT coursework and personal dev environment

Testing & Automation

  • Vitest — unit tests, integration tests, mocking, spies, test coverage
  • Jest — familiar (near-identical to Vitest)
  • Jasmine — familiar
  • Playwright — browser automation and end-to-end testing; familiar
  • Puppeteer — headless browser automation; familiar
  • Postman — API testing and debugging; familiar

AI / LLM Integration

  • Anthropic SDK — direct API calls, messages format, streaming with async iterators
  • Vercel AI SDK — useChat, streaming UI, tool/function calling
  • Tool calling / function calling — understand the pattern deeply; how agents invoke real code
  • RAG (Retrieval-Augmented Generation) — embeddings, pgvector in Postgres, similarity search, chunking
  • LangChain — familiar
  • Hugging Face — familiar; model access and inference
  • Alan AI — voice assistant SDK; integrated into Filmverse for voice-controlled navigation
  • Ollama — local model setup and inference (2 models configured)
  • OpenRouter — multi-model API access
  • Cline — AI coding assistant in VSCode
  • OpenCode — agentic coding CLI
  • Prompt engineering — system prompts, structured output, tool definitions (deepen this)

Auth & Security

  • JWT — manual implementation (sign, verify, refresh tokens) using jsonwebtoken
  • bcrypt — password hashing and comparison
  • Auth.js / NextAuth v5 — OAuth (GitHub, Google), session management, route protection
  • Kinde Auth — authentication provider; used in CaseCobra e-commerce project
  • CORS — proper origin allowlist configuration
  • Helmet — HTTP security headers (CSP, X-Frame-Options, etc.)
  • Webhooks — receiving and verifying HMAC-SHA256 signatures (Stripe pattern)
  • Environment validation — Zod-based process.env parsing at startup
  • Formspree — contact form backend; used in Portfolio V1

Background Jobs

  • BullMQ — job queues, workers, retries, concurrency, failure handling (built on Redis)
  • Maps directly to production Lambda + SQS experience from InsideDesk

Validation & API Patterns

  • Zod — schema validation, input parsing, env config validation
  • REST design — status codes, versioning, error handling, pagination (cursor-based and offset)
  • Pagination — cursor-based vs offset; understands tradeoffs

Logging & Observability

  • pino — structured JSON logging, log levels (info, warn, error)
  • AWS CloudWatch — production logging experience

Developer Tooling & Workflow

  • VSCode — primary IDE with Cline + Google Antigravity
  • IntelliJ IDEA — used via UofT coursework
  • PyCharm — used via UofT coursework
  • Vim — familiar
  • Jupyter — familiar; used for data/ML work
  • Chrome DevTools — familiar
  • Git — daily use, PR reviews, branching
  • GitHub / Bitbucket — familiar with both
  • Jira / Confluence — production Agile workflow
  • Slack — async team collaboration
  • pnpm / npm / yarn — package management
  • Husky — Git hooks for pre-push lint/type-check; used in Opal Labs
  • Agile / Scrum — daily standups, bi-weekly sprint planning, peer programming
  • Chrome Extensions (Manifest V3) — built 4 extensions: Local Video Player, Hydration Hero, Gallery Viewer, Linkest
  • Tampermonkey / Userscripts — authored 8 browser userscripts for cross-site QoL improvements
  • Serverless / Netlify Functions — used in Readmeify (SVG proxy, stats cards)

UX / UI & Design

  • Figma — wireframing, prototyping, and UI design; used in UofT projects (CCT478, CCT477)
  • UI Design — component layout, visual hierarchy
  • UX Design — user research, usability testing, prototyping
  • Human-Computer Interaction — studied formally via UofT (CCT380)
  • Web Design — responsive and accessible design

3D & Creative Technologies

  • Unity — built Sunken Secrets, a full 3D underwater game with AI enemies, dynamic audio, and a browser-playable build (UofT coursework + personal project)
  • Three.js — 3D web graphics; familiar
  • Maya — 3D modeling; used in Sunken Secrets for environment and character assets
  • 3D Printing — operated 3D printers (Studica role)
  • AutoCAD — familiar
  • Adobe Photoshop — familiar
  • Adobe Premiere Pro — familiar
  • Adobe Audition — used in Sunken Secrets for dynamic in-game audio

Data & Web Scraping

  • Web Scraping — deep production experience; 80+ scrapers at InsideDesk
  • Data Scraping / Automation — TypeScript, Puppeteer, Playwright patterns
  • PRAW — Python Reddit API Wrapper; used for Reddit data collection project
  • pandas — data manipulation and analysis
  • nltk — natural language processing (tokenization, sentiment, etc.)
  • gensim — topic modelling and document similarity (LDA)
  • matplotlib — data visualization
  • pyLDAvis — interactive topic model visualization
  • Pygame — Python game development library; used in Space Invaders project
  • Electron — cross-platform desktop app framework; used in NoteMark, Screen Recorder, and Image Resizer (all Framework Mountain App Valley)
  • Tkinter — Python GUI framework; used in Todoist desktop app
  • Jetpack Compose — Android declarative UI toolkit; used in Android Mountain
  • Android Studio — Android IDE; used in Android Mountain
  • Shopify / Liquid — e-commerce platform and templating; used in Learning Expressway theme

Awareness (know what it is, not yet hands-on)

  • tRPC — end-to-end typesafe API layer for Next.js; on deck
  • OpenTelemetry — distributed tracing standard; recognise from CloudWatch parallels
  • Structured vibe coding — context files, agent skills (architect, remember, review, recover, imprint), MCP integration
  • Stagehand / Browserbase — browser automation for AI agents
  • PostHog — product analytics and session tracking

Systems & Low-Level Programming

  • RISC-V Assembly — written ~1,000-line survival horror game (Shadow In The Dark) in RISC-V assembly; covers pipelining, cache optimization, syscalls, LCG random number generation, Manhattan distance pathfinding, heap allocation via sbrk, and multiplayer with bubble-sort leaderboard; tools: CPU-Lator, Ripes
  • Computer Architecture — pipelining (5-stage: IF/ID/EX/MEM/WB), data hazards, forwarding, cache locality; via UofT CSC258

Additional Frameworks & Tools

  • FastAPI — Python async web framework; used in Inventory Server (team distributed systems project) with asyncpg and aiohttp
  • Angular — familiar; built Angular Webshop in Framework Mountain
  • SvelteKit — familiar; used in Framework Mountain Portfolio Valley
  • Vuetify — Vue UI component library; used in Framework Mountain
  • Docusaurus — static site/knowledge base generator; used in Dev Mountain
  • nginx — reverse proxy and load balancer; used in Inventory Server (UofT distributed systems project)
  • Twine — interactive narrative / branching story tool; used in The Twine Interview (UofT project)
  • Blender — 3D modeling software; familiar
  • PowerShell — Windows scripting; familiar
  • yt-dlp / FFmpeg — video downloading and media processing CLI tools

DSA Progress (NeetCode + LeetCode Roadmap)

Pace: 2 problems/day consistently since starting
GitHub: AbdulDevHub/Leetcode-Submissions — solutions auto-synced from NeetCode on every submission; LeetCode solutions also synced weekly via GitHub Actions

Problems completed: LeetCode

Note: The first number reflects total problems completed in that category (including practice from NeetCode All), while the second is the targeted count from the NeetCode 250 roadmap.

NeetCode 250 TopicStatus
Arrays & Hashing✅ Completed (87/22 solved via NeetCode All)
Two Pointers✅ Completed (22/13) solved via NeetCode All
Sliding Window🔄 In progress (0/9)
StackUpcoming (0/14)
Binary SearchUpcoming (0/14)
Linked ListUpcoming (0/14)
Trees (BFS, DFS)Upcoming (0/23)
Heap / Priority QueueUpcoming (0/12)
TriesUpcoming (0/4)
Graphs (BFS, DFS)Upcoming (0/21)
Dynamic ProgrammingUpcoming

Language used: Python, TypeScript


Personal Projects

Acme De La Vie App Wireframe

Associated with University of Toronto | View on Figma

A Figma wireframe for a mobile app based on the Acme De La Vie clothing store website. Built in a group of 4, grounded in extensive background and user research.

Tools: Figma, UX research methods


Car Dashboard Wireframe

Associated with University of Toronto | View on Figma

A Figma wireframe for a Car Infotainment Dashboard — an enhanced version of current solutions prioritizing practical, safe usage and superior aesthetics. Designed collaboratively with my sister (CCT478: UX Design — Prototyping and Evaluation).

Tools: Figma, UI/UX design


(Add more projects here — include: what it does, tech stack, link, anything notable about scale or design decisions)


Glisten AI

GitHub: AbdulDevHub/Glisten-AI | Live

A sleek, dark, animated marketing website in the style of Linear, Raycast, and Clerk. Features GSAP scroll and load animations, and Prismic as a headless CMS for content management.

Stack: Next.js 14, TypeScript, GSAP, Prismic (headless CMS), Tailwind CSS, Vercel


Console Wars Exhibition

GitHub: AbdulDevHub/Console-Wars

An interactive digital exhibition exploring video game console competition from 1989–2005 (Nintendo vs. Sega vs. Sony vs. Microsoft). Features 16 curated artifacts with historical analysis and citations, a 3D animated landing page, keyboard navigation, image lightbox, and a custom video player. Content is data-driven via a JSON file.

Stack: HTML5, CSS3, Vanilla JavaScript, Anime.js (3D sphere animation), Plyr.js (video player), Lucide Icons


Surf n' Turf

GitHub: AbdulDevHub/SurfNTurf

A strategic tower defence game built with team Moonlight Games (4 members). Defend Clearwater from radioactive fish across 20 waves of increasing difficulty. Features three distinct tower types with upgrade paths, dynamic map events (dam breaks that open new enemy routes), resource management, and a 200-health boss in the final wave.

Stack: Unity, C#, game design document | Team: Joshua Andreou, Philippe Filiatreault, Abdul Khan, Clara Joy Tan


Shadow of a Doubt

GitHub: AbdulDevHub/Shadow-of-a-Doubt

A first-person magic shooter where you play as a black cat defending a haunted witch's house. Features elemental spell combat (fire, water, wind) with enemy type weaknesses, wave-based progression across 3 levels, a final boss with changing elemental shields, and multiple endings based on performance.

Stack: Unity, C#, game design document


Android Mountain

GitHub: AbdulDevHub/Android-Mountain

A learning log of 6 Android apps built while following Google's official codelabs and tutorials. Projects cover state management, LazyColumn lists, user input, composable theming, and app logic.

Apps: Happy Birthday, Greeting Card, Dice Roller, Lemonade, Affirmations, Tip Calculator

Stack: Kotlin, Jetpack Compose, Gradle (Kotlin DSL), Android Studio


UTM Student Portal

GitHub: AbdulDevHub/UTM-Student-Portal | Live

An unofficial student resource hub for the University of Toronto Mississauga. Centralizes academic tools, campus updates, exam schedules, an interactive campus map, transit info, degree planning, and employment opportunities.

Stack: HTML, CSS, JavaScript, Netlify


Huffman Zip

GitHub: AbdulDevHub/Huffman-Zip

A Python CLI tool that implements lossless file compression and decompression using Huffman binary trees. Supports any file type and achieves an average 1.5:1 compression ratio. Includes a profiling mode to benchmark runtime and compression performance across iterations.

Stack: Python, command-line, PyCharm/VSCode


Space Invaders

GitHub: AbdulDevHub/Space-Invaders

An advanced version of the classic Space Invaders arcade game. Features randomly spawning enemies, a giant final boss, dynamic music tied to game state, and collectible power-ups.

Stack: Python, Pygame


Learning Expressway — Custom Shopify Theme

GitHub: AbdulDevHub/Learning-Expressway | Store

A heavily customized version of Shopify's Dawn theme for the Learning Expressway storefront. Modifications include custom spacing, typography, product card layouts, header/nav behavior, cart animations, and JS interaction enhancements — all done directly in theme files (no page builders). Designed by studying and reverse-engineering layout patterns from high-performing Shopify stores.

Stack: Shopify, Liquid (Shopify templating), CSS, JavaScript, Dawn theme


Portfolio Website V1

GitHub: AbdulDevHub/Portfolio-Website-V1 | Live

My first personal portfolio site built with vanilla HTML, CSS, and JavaScript. Projects and skills load dynamically from JSON files. Achieved strong Google Lighthouse scores through semantic HTML, deferred JS, LCP optimization, ARIA labels, and proper heading hierarchy. Includes a Formspree contact form and Materialize CSS ripple effects.

Stack: HTML5, CSS3, JavaScript (ES6+), Materialize CSS, Formspree, FontAwesome, JSON, Netlify


Portfolio Website V2

GitHub: AbdulDevHub/Portfolio-Website-V2 | Live

My current 3D portfolio website built with Next.js and Three.js, showcasing projects, skills, experience, and testimonials.

Stack: Next.js, Three.js, JavaScript, Vercel


Opal Labs (Full-Stack — Team Project)

GitHub (Frontend): AbdulDevHub/Opal-Labs-Frontend | Live GitHub (Backend): AbdulDevHub/Opal-Labs-Backend

A Notion-like productivity platform built collaboratively with a team of 7 developers. The frontend is a Next.js App Router app with Playwright E2E tests, Storybook for component development, Husky pre-push hooks, and GitHub Actions CI/CD. The backend is written in Go with PostgreSQL and Redis, using Google OAuth 2.0 for authentication. Deployed on Vercel (frontend) and Render (backend).

Frontend stack: Next.js (App Router), TypeScript, Google OAuth 2.0, Playwright, Storybook, Husky, GitHub Actions, Vercel, yarn Backend stack: Go, PostgreSQL, Redis, Google OAuth 2.0, Go testing framework Methodology: Agile (team of 7)


Filmverse

GitHub: AbdulDevHub/Filmverse | Live

A movie discovery web app with user authentication, light/dark mode, genre browsing, search, favorites, watchlists, pagination, and a voice-controlled interface powered by Alan AI. Integrates with the TMDB API for movie and actor data.

Stack: React 18, TypeScript, Redux Toolkit, RTK Query, React Router v6, MUI v5, TMDB API, Alan AI (voice assistant), Vite, Oxlint, Vercel


CaseCobra — Custom Phone Case Shop

GitHub: AbdulDevHub/Case-Cobra

A full-stack e-commerce shop for custom phone cases. Features a drag-and-drop phone case configurator, secret admin dashboard for order management, Stripe payments, Kinde authentication, and transactional thank-you emails. Built on Next.js 14 App Router with shadcn-ui.

Stack: Next.js 14, TypeScript, PostgreSQL, Tailwind CSS, shadcn-ui, Stripe, Kinde Auth, drag-and-drop file uploads


Local Video Player — Chrome Extension

GitHub: AbdulDevHub/Local-Video-Player

A feature-rich Chrome extension for playing local video files. Highlights include volume amplification up to 500%, resume-from-position (localStorage), fine-grained speed controls (0.1x–16x), Picture-in-Picture, Global Media Controls integration, and extensive keyboard shortcuts. Works fully offline.

Stack: Vanilla JavaScript, HTML, CSS, Chrome Extension APIs


Hydration Hero — Chrome Extension

GitHub: AbdulDevHub/Hydration-Hero

A privacy-first Chrome extension for tracking daily water intake. Logs drinks with customizable volumes, tracks progress toward daily goals, shows timestamped history, and auto-resets at midnight. All data stays local via Chrome Storage API. Dockerized for consistent dev/build without requiring a local Node environment.

Stack: React, Vite, Tailwind CSS, Chrome Extension APIs (Storage), Docker, pnpm


GitHub: AbdulDevHub/Gallery-Viewer

An offline-first Chrome extension for browsing large image and video galleries. Supports folder loading (recursive), video frame extraction, flexible grid layouts (1–24 images/row), three zoom modes (off / click / magnifying lens), folder bookmarks to resume where you left off, and a distraction-free spotlight mode. Opened via Alt+G shortcut.

Stack: Vanilla HTML, CSS, JavaScript, Chrome Extensions (Manifest V3)


Tampermonkey Scripts

GitHub: AbdulDevHub/Tapermonkey-Scripts

A collection of 8 personal Tampermonkey userscripts for browser quality-of-life improvements: disabling Bing scroll-into-Copilot behavior, fullscreen toggle (Shift+Alt+F), scrollbar hiding, horizontal-to-vertical scroll remapping, Sketchfab model downloader (JSZip + FileSaver), video aspect ratio stretcher for 16:10 screens, Webtoon dark mode, and YouTube Shorts redirect to standard watch URLs.

Stack: Vanilla JavaScript, Tampermonkey userscripts, JSZip, FileSaver.js


Readmeify

GitHub: AbdulDevHub/Readmeify

A monorepo of three independently deployed serverless tools for customizing GitHub profile READMEs: a custom-themed SVG proxy for 3D contribution graphs (Netlify), a self-hosted GitHub stats card generator, and a contribution streak tracker (both on Vercel). Demonstrates serverless deployment and monorepo CI architecture.

Stack: JavaScript, serverless functions, Netlify, Vercel


DhikrForest (Zikr)

GitHub: AbdulDevHub/DhikrForest

A single-file, offline-first dhikr (Islamic remembrance) counter that visualizes worship as a growing forest. Each recitation plants a tree; up to 1,500 trees are rendered live. Features two dhikr types, Laylatul Qadr mode (×1000 multiplier), milestone toast notifications, localStorage persistence, and full keyboard support — zero dependencies, no build step.

Stack: Vanilla HTML, CSS, JavaScript (single file), localStorage


Reddit Data Scraping

GitHub: AbdulDevHub/Reddit-Data-Scrapping

Scraped and analyzed Reddit data using the PRAW API wrapper. Performed NLP and topic modelling on the results and produced interactive visualizations. Delivered findings as a Jupyter notebook, PDF, and PowerPoint.

Stack: Python, PRAW, pandas, nltk, gensim (topic modelling), matplotlib, pyLDAvis, wordcloud, Jupyter


AI Mountain — AI Mini-Apps Collection

GitHub: AbdulDevHub/AI-Mountain

A collection of 8 AI-powered mini-apps demonstrating practical use of LLMs and ML models:

  • AI Art Generator — DALL-E image generation
  • AI Stock App — ChatGPT-based stock trend prediction (live)
  • AI Translator — ChatGPT-powered multilingual translation
  • Colorize Image AI App — Hugging Face model to colorize black-and-white images
  • Movie Focus Chatbot — ChatGPT chatbot for movie info and recommendations
  • ReAct AI Agent with Chat UI — ChatGPT agent that executes real functions (e.g. weather lookup) from natural language prompts; implements the ReAct (Reason + Act) pattern
  • Text To Speech — Hugging Face TTS model
  • Vision AI App — Hugging Face image analysis and interpretation

Stack: JavaScript, ChatGPT API, DALL-E, Hugging Face, React/HTML/CSS


NoteMark

GitHub: AbdulDevHub/NoteMark

A cross-platform desktop note-taking app with native Markdown support. Installable on Mac, Windows, and Linux. Built with Electron and React.

Stack: Electron, React, TypeScript/JavaScript, Markdown, yarn


Sunken Secrets: The Treasure Of The Three Keys

GitHub: AbdulDevHub/Sunken-Secrets | Play Online

An immersive 3D underwater adventure game set in the Bermuda Triangle. Features dynamic music that adapts to game state, roaming AI enemies (sharks), and an original narrative with environmental storytelling. Shipped with both a desktop build and a browser-playable online build.

Stack: Unity, C#, Maya (3D modeling), Adobe Audition (audio), game design document


Modern AliExpress (E-Commerce Clone)

GitHub: AbdulDevHub/Modern-AliExpress | Live

A full-stack e-commerce web app cloning AliExpress with a modernized UI. Includes Google and GitHub OAuth, Stripe payment integration, and a Supabase-backed PostgreSQL database managed via Prisma ORM.

Stack: Vue.js, Nuxt.js, Tailwind CSS, Prisma ORM, Supabase (PostgreSQL), Stripe, OAuth (Google, GitHub), Vercel


Todoist — Task Management App

GitHub: AbdulDevHub/Todoist

A desktop task management application built in Python. Supports creating, editing, saving, and deleting tasks with reminders, plus a graphical view of task activity over time using Matplotlib.

Stack: Python, Tkinter, Pickle, JSON, Matplotlib


Exceptional University Projects

GitHub: AbdulDevHub/Exceptional-University-Projects

A curated collection of notable academic software projects from UofT, spanning Java, Python, RISC-V Assembly, distributed systems, and interactive media.

Sub-projects:

Shadow In The Dark (flagship — ~1,000 lines of RISC-V assembly) A full-featured turn-based survival horror game written entirely in RISC-V assembly. Features: procedural map generation using a Park-Miller LCG seeded with system time, Manhattan distance AI pathfinding for the shadow monster, Chebyshev distance proximity detection, an unlimited undo stack (4KB buffer, 512 states × 8 bytes), dynamic heap allocation via sbrk for multiplayer mode, and a bubble-sort leaderboard. 13 modular subroutines with proper caller/callee register conventions and nested calls up to 4 levels deep.

Inventory Server (distributed microservices — team project) A distributed inventory management backend with 5 services (OrderService, UserService, ProductService, ISCS router, nginx load balancer). Features: async REST APIs with FastAPI + asyncpg, Redis caching with automatic invalidation, PostgreSQL row-level locking for race condition protection, Docker Compose orchestration, and LAN multi-machine deployment support.

Boggle Game — Full Java implementation with OOP design, file I/O persistence, dictionary validation, unit tests

CS Labs — Across CSC148 (Python: trees, BSTs, linked lists, recursion, TimSort), CSC207 (Java: Observer, Decorator, Adapter, Visitor design patterns, AST evaluator, Braille translator), CSC258 (RISC-V: pipelining, cache optimization, syscall I/O)

Map Plotting & Search — Python app modelling phone calls and billing with data visualization

The Twine Interview — Interactive narrative game built with Twine and HTML exploring bias and systemic inequality through branching dialogue

Stack (combined): Java, Python, RISC-V Assembly, FastAPI, asyncpg, aiohttp, PostgreSQL, Redis, Docker, nginx, Twine, HTML

Linked submodules: (external repos tracked as Git submodules, not native code — each already has its own full entry elsewhere in this file, linked here for reference)

Opal Labs Frontend · Opal Labs Backend · UTM Student Portal · Space Invaders · Shadow of a Doubt · SurfNTurf · Sunken Secrets · Console Wars · Huffman Zip · Reddit Data Scrapping · Todoist


Framework Mountain

GitHub: AbdulDevHub/Framework-Mountain

A monorepo tracking 45+ web and desktop development projects organized into seven themed Valleys — Backend, Component, Data Scrape, Game, Portfolio, Tech Experiments, and App — for hands-on learning across diverse frameworks, architecture paradigms, and DevOps strategies. Implements both Git submodules and squashed Git subtrees to manage multi-repository architectures locally.

Valley Highlights:

  • Backend Valley — REST APIs built with Hono (Prisma + Supabase + Vitest) and a hackathon-management API on NestJS; production Redis/IoRedis learning for distributed in-memory key-value caching; FastAPI backend scaffolding on a Next.js/TypeScript foundation.
  • Component Valley — Reusable, framework-diverse UI: an animated Svelte/Rollup login form, an interactive live-preview credit card component, and a Vuetify-powered responsive image gallery with sidebar navigation.
  • Data Scrape Valley — Puppeteer-driven scraping tools in TypeScript, spanning bookstore data extraction, blog scraping with JSON dataset output, and specialized comparison scrapers for dental PMS platforms.
  • Game Valley — A browser-based Flappy Bird clone built with vanilla JavaScript and Canvas, including sound effects and sprite animation.
  • Portfolio Valley — A range of personal-site architectures: a Three.js 3D solar-system portfolio, a CMS-driven SvelteKit portfolio, a Next.js portfolio with motion/video backgrounds, and Tailwind-based React + Vite concepts.
  • Tech Experiments — Custom Model Context Protocol (MCP) server development using TypeScript/Zod; automated workflows with n8n; a from-scratch RAG implementation (Ollama, PostgreSQL, pgvector, Python); production email queues with BullMQ + Redis; GitHub Actions CI/CD pipelines with type-checking, testing, and Docker builds; GitHub OAuth via Auth.js; a terminal-based streaming chat CLI for Ollama and Anthropic; Stripe webhook verification with HMAC-SHA256; repository hygiene and security tooling (Husky, Dependabot, Snyk); and hands-on environments with Bun, LangChain/Streamlit, and GSAP.
  • App Valley — Full web and desktop applications. Includes Vercel AI Chat (Next.js 16, Vercel AI SDK v6, tool calling, local Ollama/OpenAI streaming); Job Pilot (AI job-matching leveraging BrowserBase and PostHog); Angular and Vue 3 e-commerce/CRUD apps; a Netflix UI clone; a 3D Apple-style homepage; GSAP Drinks, a scroll-driven animation showcase; and Screen Recorder and Image Resizer, two Electron.js desktop utilities migrated in via squashed Git subtree (along with Git-Practice in Tech Experiments).

Stack: React, Next.js, Angular, Vue, Svelte, SvelteKit, TypeScript, JavaScript, Node.js, Bun, Hono, NestJS, FastAPI, Python, PostgreSQL, Redis, pgvector, BullMQ, Puppeteer, Docker, GitHub Actions, MCP SDK, Zod, Husky, Dependabot, Snyk, n8n, LangChain, Streamlit, GSAP, Three.js, Tailwind CSS, SCSS, Vuetify, Prisma, Supabase, Vitest, Auth.js, Stripe CLI, Ollama, OpenAI, Claude, Open Router, InsForge, PostHog, Adzuna, BrowserBase

Linked submodules: (external repos tracked as Git submodules, not native code — each already has its own full entry elsewhere in this file, linked here for reference)

Filmverse · CaseCobra · Glisten AI · Modern AliExpress · NoteMark


Web Mountain

GitHub: AbdulDevHub/Web-Mountain

A living archive of 50+ frontend experiments, UI concepts, and interactive web utilities, tracking a progression of skills from foundational HTML/CSS/JS to advanced WebGL and canvas-based effects. Organized into four categories: Awesome Websites, UI Experiments, Awesome Effects, and Chrome Extensions.

Category Highlights:

  • Awesome Websites — Complete standalone projects including a Pokédex encyclopedia, classic card games (UNO, War), a whack-a-mole reaction game (Face Bomp), a Bootstrap portfolio template, a dynamic QR code generator, a mock email generator, a bookmark link generator, and batch file utilities (renaming, redownloading, duplicate detection).
  • UI Experiments — Concept interfaces exploring layout and interaction design: a food delivery app (Skynet Eats), a drone product showcase, a nature photography gallery, a minimalist productivity dashboard (Momentum), and an immersive video-background landing page.
  • Awesome Effects — 30+ interactive visual effects spanning WebGL fluid and flame simulations, GPU-accelerated ink dispersion (GPU.js), Anime.js-powered 3D spheres, particle systems, eye-tracking and cursor-follow effects, 3D cube loaders and image transitions, mouse-tracking spotlights, shine/hover animations, touch-enabled and split-screen sliders, and a custom Video.js player implementation.
  • Chrome Extensions — Five browser extensions, four of which are linked as Git submodules (see below); Gallery Bookmark Viewer is native to this repo, providing visual, customizable bookmark management directly in the browser.

Stack: HTML5, CSS3, JavaScript (ES6+), Anime.js, WebGL, GPU.js, Canvas API, SVG, jQuery, Bootstrap, dat.GUI, Materialize, Video.js, CSS Grid, Flexbox

Linked submodules: (external repos tracked as Git submodules, not native code — each already has its own full entry elsewhere in this file, linked here for reference)

Gallery Viewer · Linkest · Hydration Hero · Local Video Player · DhikrForest


Dev Mountain

A centralized, documentation-focused knowledge base built with Docusaurus to host production references, interactive code playgrounds, and custom cheatsheets. It serves as a single source of truth for engineering workflows, system architecture guides, and technical deep-dives — organized into 15 knowledge domains covering everything from language syntax to AI system design.

Knowledge Domains:

  • Getting Started — Onboarding references for Docusaurus itself: syntax guides, React/MDX authoring patterns, and Markdown cheatsheets for contributing to the docs.
  • Web Fundamentals — Core front-end building blocks: HTML, CSS, Sass, JavaScript, TypeScript, and Tailwind quick references for day-to-day development.
  • Programming Languages — Syntax and concept references spanning Python, Java, C (pointers), SQL, and modern Python tooling via uv.
  • Frameworks & Libraries — Practical guides for React, NestJS, Electron.js, Three.js, and GSAP, plus comparison matrices for evaluating front-end and back-end framework choices.
  • Computer Science Concepts — Foundational theory: recursion, UML diagramming, regex patterns, and software design patterns.
  • Scripting & Automation — Hand-crafted repositories of front-end utility snippets, Python automation scripts, browser console automation, and terminal command configurations.
  • Tools & Workflow — Practical setups for VS Code, WSL development environments, pnpm, terminal theming, commit linting, GitHub label conventions, Git commands, tooling configs, home directory layout, and file permission/attribute basics (chmod, Windows ACLs).
  • Design & UI — Curated references for UI component libraries, animation tooling, and motion/design inspiration.
  • Infrastructure & DevOps — Operational references for Linux, PowerShell, Git at the infrastructure level, Nginx configuration, and AWS fundamentals.
  • AI Systems — Deep-dives into AI architecture workflows, agent skill design, and Retrieval-Augmented Generation (RAG) / Model Context Protocol (MCP) fundamentals.
  • Quality, Testing & Performance — Comprehensive software testing methodologies, accessibility (a11y) tooling, and SEO/performance optimization basics.
  • Security & Privacy — Cybersecurity fundamentals, uBlock Origin Lite custom filter authoring, and applied hacking/security guides.
  • Project Management — Scrum and Agile methodology references for engineering teams.
  • References & Knowledge — A miscellany of durable references: learning platform roundups, asset naming conventions, SWE role/specialization breakdowns, and web monetization models.

Stack: Docusaurus, React, MDX, TypeScript, Markdown, Yarn


Linkest — Chrome Extension

GitHub: AbdulDevHub/Linkest

A Chrome extension for link and note management. Features: one-click tab URL saving, smart URL vs. plain-text detection (auto-opens non-URLs as Google search), multi-select with shift-range and Ctrl+A, batch tab opening, position-based insertion ("N. text" format), local file browser, and persistent localStorage. Full keyboard shortcut support throughout.

Stack: Vanilla JavaScript, HTML, CSS, Chrome Extension APIs, localStorage


Video Download & Edit

GitHub: AbdulDevHub/Video-Download-Edit

A portable Windows setup bundling yt-dlp and FFmpeg executables for downloading and processing video/audio without system-wide installation. Supports batch downloads, audio extraction, format conversion, and download resumption.

Stack: yt-dlp, FFmpeg, PowerShell/Windows terminal


GitHub Profile README

GitHub: AbdulDevHub/AbdulDevHub

Custom GitHub profile README featuring animated coding GIF, language/tools icon grid, GitHub stats cards, contribution streak, 3D contribution graph (via Readmeify SVG proxy), and a contribution snake animation powered by GitHub Actions.


YouTube Channel

  • Handle: @learningexpressway
  • Shopify Store: learningexpressway.com
  • Content focus: AI tools, learning strategies, and practical technology — helping others level up their skills
  • (Add: approximate subscriber count, number of videos, any notable videos or series)

Other Notable Info

Volunteering

Activity Leader — STEM1 May 2019 – June 2019 (2 months) | Education

  • Completed 3 days of object-oriented programming training
  • Prepared and set up equipment on event day
  • Taught and led student STEM-centred activities for participants

Link Crew Student Leader — Rick Hansen Secondary School September 2019 – June 2020 (10 months) | Education

  • Discussed and planned social events for students
  • Advertised events and social gatherings using flyers and online posts
  • Led assigned student group through various social and fun activities

(Add anything else relevant: hackathons, open source contributions, awards, extracurriculars, etc.)


Interview Prep — STAR Story Bank

These are raw ingredients. Each one needs to be shaped into a full STAR story. The metrics below should appear in every relevant answer.

Core metrics to embed:

  • 2–3 min/claim → seconds (processing time)
  • 2 hours → 10 minutes (run time)
  • 20% → 1.5% (error rate)
  • 220,000+ claims processed daily
  • 42,500+ daily claims from my 7 scrapers alone (~20% of total volume)
  • 80%+ PR review rate
  • Team of 7–9, Agile, daily standups

Story topics to prepare (8–10 STAR stories needed):

  1. Biggest technical challenge (scraper architecture, API-driven pipeline redesign)
  2. Measurable business impact (run time and error rate improvements)
  3. Cross-functional collaboration (Agile team, Slack, Jira, standups)
  4. Taking initiative without being asked (sought out challenges per team lead quote)
  5. Failure + learning (something that broke in production or didn't work first try)
  6. System design decision you owned (event-driven pipeline, MFA system, or infrastructure choices)
  7. Onboarding / knowledge transfer (Confluence documentation work)
  8. Handling tight deadlines (sprint planning, production pressure)
  9. Code quality / PR culture (80%+ review rate, detailed feedback)
  10. Working with sensitive data / compliance (HIPAA)

Learning Roadmap — Completed & Upcoming

Completed (as of June 2026)

  • SQL fundamentals — two FCC courses + W3Schools + CSC343
  • PostgreSQL — setup, queries, schema design, ERDs
  • Docker — Dockerfile, layers, docker-compose, multi-service environments
  • Vitest — unit tests, integration tests, mocking, coverage
  • GitHub Actions — CI/CD pipelines wired with type-check, tests, lint, Docker build
  • Hono REST API — routing, middleware, status codes, error handling
  • Prisma ORM — schema, migrations, relations, Hono + PostgreSQL integration
  • JWT + bcrypt — manual auth implementation
  • Auth.js / NextAuth v5 — OAuth, session management, protected routes
  • Redis (direct) — ioredis, caching, rate limiting, session storage
  • API security — CORS, Helmet, env validation, pagination patterns
  • Local AI dev environment — Ollama, OpenRouter, Cline, OpenCode, Claude.ai
  • Anthropic SDK — direct API, streaming, messages format
  • Vercel AI SDK — useChat, streaming UI, tool calling
  • RAG basics — embeddings, pgvector, similarity search
  • BullMQ — queues, workers, retries, concurrency
  • pino — structured logging
  • Webhooks — HMAC-SHA256 signature verification
  • DSA: Arrays & Hashing, Two Pointers (in progress)

Upcoming (next)

  • tRPC
  • Prompt engineering (formalized)
  • System design fundamentals (ByteByteGo)
  • OpenTelemetry
  • STAR story polish + mock interviews
  • AWS Developer Associate cert (optional but high-value)