Ibad Khan — frontend developer
Frontend developer
Hyderabad, Pakistan — working worldwide
I build web interfaces that look finished and are engineered to last — React, Next.js, motion and performance, from first frame to production.
(02) Approach
About Ibad Khan
Most interfaces look finished. Few are built to last. I care about both layers — the pixels you see, and the system underneath: components that scale, motion that respects the frame budget, and pages that load before you notice.
- Based in
- Hyderabad, Pakistan
- Currently
- Frontend at Nanolix Digital
- Focus
- Next.js, motion, performance
- 2.5+
Years shipping production UI
- 02
Studios shipped with
- 07
Selected builds below
(03) Selected work
Selected work
07 buildsScroll →
- 01Next.js / MongoDB / AI SDK
AI Fitness Coach — view repository on GitHub (opens in a new tab)
Full-stack AI fitness platform — personalised plans, habit tracking, coach chat and progress insights.
- 02React / TypeScript / Tailwind
Power AI — view repository on GitHub (opens in a new tab)
Full-screen AI product landing page with a video background, liquid-glass UI and an animated brand marquee.
- 03Next.js / TypeScript / Tailwind
Securify — view repository on GitHub (opens in a new tab)
Security-focused web app on a modern TypeScript frontend and production-ready Next.js patterns.
- 04React / Tailwind / GSAP
Landify — view repository on GitHub (opens in a new tab)
Landing page built around smooth GSAP choreography and clean UI patterns.
- 05Next.js / Tailwind / Motion
heroUI — view repository on GitHub (opens in a new tab)
A kit of reusable hero sections, each with its own animation pattern.
- 06React / CSS / Figma
Codelace — view repository on GitHub (opens in a new tab)
Full platform redesign focused on UX, modern aesthetics and responsiveness.
- 07JavaScript / REST API / CSS
Weather API — view repository on GitHub (opens in a new tab)
Real-time weather dashboard on the OpenWeatherMap API with dynamic theming.
- More on GitHubEverything else lives in the repos. (opens in a new tab)
(04) Principles
Four rules I build by
Speed is a feature
If a page makes you wait, nothing else on it matters much. I budget for performance from the first commit, not the week before launch.
LCP · INP · CLS
Motion has to mean something
Every animation should explain where something came from or where to look next. If it only decorates, it gets cut or toned down.
transform · opacity · 60fps
Accessible by default
Keyboard focus, real headings, readable contrast and reduced-motion fallbacks are part of the build, not a ticket for later.
WCAG AA · prefers-reduced-motion
Code the next person can read
Clear names, small components, short notes where the reasoning isn’t obvious. Someone will inherit this code. It might be me, six months from now.
props · naming · notes
(05) Experience
Where I've shipped
May 2025 — Present
Part-time · RemoteNanolix Digital
Frontend Developer
- High-performance, SEO-first sites on the Next.js App Router and Headless WordPress
- Modular React component architecture that scales across client builds
- Lighthouse gains through image optimisation and lazy loading
Next.js · React · WordPress REST API · Tailwind CSS · Swiper · React Hook Form
May 2024 — Mar 2025
Full-time · On-siteTechriv Solutions
Frontend Developer
- Responsive pages built on modern UI/UX principles
- Mobile-first email templates, tested across clients
- Richer interactions with HTML, CSS and JavaScript
JavaScript · Bootstrap · HTML/CSS · jQuery · Email templates
(06) Services
Ways I can help
- 01React developmentComponents, forms, state and API work for React apps that stay easy to change.
- 02Next.js developmentFast, search-friendly sites and apps on the App Router, deployed cleanly to Vercel.
- 03Responsive web designMobile-first websites and landing pages that look intentional on every screen size.
- 04Website speed optimisationFind what’s slowing your site down and fix it. Better Core Web Vitals, with before and after numbers.
- 05Web animation (GSAP)Scroll animation, page transitions and interactive details that stay smooth on ordinary phones.
- 06Headless WordPressKeep WordPress for editing, get a fast Next.js front end for visitors.
- 07HTML email templatesHand-coded responsive emails that render properly in Gmail, Outlook and Apple Mail.
(07) Toolkit
What the work is made with
01 Build
- React
- Next.js
- JavaScript (ES6+)
- HTML / CSS
- Tailwind CSS
- Bootstrap
02 Motion
- GSAP
- Motion
- Lenis
- WebGL (OGL)
03 Content
- Headless WordPress
- WordPress REST API
- REST APIs
- jQuery
04 Craft
- Responsive design
- Web performance
- Figma
- Git / GitHub