live demoConcept project
Clinic Booking System
Book a slot in your time zone, race two bookings for one slot, then drag appointments in the admin calendar and watch overlaps fail.
Sami Ullah is a React.js developer who has worked in senior front-end React/JavaScript roles since 2022 at HybridMediaworks, IKONIC, Techtonex and Tribech Solutions. He builds typed, accessible React interfaces with TypeScript and Tailwind CSS, and now uses React for geospatial dashboards at Earth Scan Systems.
Used professionally since 2022 (4+ years)
React is the library I have used the most in my career. My job titles from 2022 onward have been senior front-end React/JavaScript roles, and my current MERN stack role at Earth Scan Systems uses React for the client side.
Most of my React work is turning Figma or Adobe XD designs into production components: layouts, forms, data tables, dashboards and maps. I write components in TypeScript, style them with Tailwind CSS, and keep state as close to where it is used as possible.
Official documentation: React documentation
live demoConcept project
Book a slot in your time zone, race two bookings for one slot, then drag appointments in the admin calendar and watch overlaps fail.
live demoConcept project
Draw a field near Sargodha, drag its corners, watch hectares update live, then export and re-import it as GeoJSON.
live demoConcept project
Enqueue jobs, add or SIGTERM workers, raise the chaos slider and watch retries back off into the dead-letter set.
live demoConcept project
Drag cards by mouse, touch or keyboard, hit a WIP limit, filter by label, edit a card in the drawer and undo it all.
live demoConcept project
Drag fields into steps, add a regex rule or a condition, then fill the live preview and copy the generated zod schema.
live demoConcept project
Play a season of NDVI across six fields, compare their curves, and tune the detector that flags a stressed wheat field.
live demoConcept project
Sign in as admin, editor or user, call endpoints, untick a permission and watch the same request turn into a 403.
live demoConcept project
Chat as three people, take one offline, send messages, reconnect and watch the outbox flush and missed messages sync.
live demoConcept project
Filter 18 months of fictional subscriptions by range, plan, region and channel; hover the charts, read cohorts and export CSV.
live demoConcept project
Shorten a link, claim an alias, follow it and watch the 301, the click count and the referrer chart update live.

Own product
A multi-salon booking marketplace I designed and built for Pakistan. Clients find nearby salons on a map, choose a barber, service and time, and book at the salon or as a home visit. Salons run staff, schedules and earnings from their own dashboard, and the platform collects a commission per completed booking through daily settlements.

Client project
Voy is a mobile-first social commerce app where creators share shoppable videos, stories and product picks, and shoppers follow, chat and buy without leaving the feed. As a front-end developer in a small team, I built the shop, profile and product pages in Vue 3 and TypeScript and connected them to the REST API.
live demoConcept project
Use Dialog, Tabs, Combobox, Menu, Toast and Switch by keyboard while an inspector shows the role, name and ARIA state.
live demoConcept project
Request a slot, approve it in wp-admin, then break it: stale nonces, a subscriber's crafted URL, two visitors racing.
live demoConcept project
Inspect a theme page to see the template part, ACF fields and theme.json tokens behind each section, then edit and reorder it.
live demoConcept project
Switch phone, tablet and desktop frames, turn on the spec overlay and grid, and click any element to see its tokens.
live demoConcept project
Filter the catalogue, pick variants, check out with a test card, trigger 3-D Secure and watch the SQL behind every step.
live demoConcept project
Drop a file, pause and resume a chunked upload, and see a renamed .exe and a 12 MB zip get refused.
live demoConcept project
Write GraphQL queries and mutations, then compare the SQL count with and without DataLoader batching.
live demoConcept project
Publish a post in wp-admin and watch the webhook purge cache tags and the Next.js page regenerate. Preview drafts too.
live demoConcept project
Oversell a product, run a transfer that fails halfway and rolls back, receive a purchase order and export the low-stock list.
live demoConcept project
Build an invoice, watch exact totals update, double-submit it to test idempotency, then save it as a PDF.
live demoConcept project
Click anywhere in Lahore to find the nearest stores, filter by open now and services, and read the PostGIS query for each search.
live demoConcept project
Write Markdown and watch the preview, TOC, reading time, Google snippet and social card update; try a javascript: link.
live demoConcept project
Enrol, finish lessons, pass server-graded quizzes for a certificate, then switch to instructor and publish a lesson.
live demoConcept project
Switch tenants, request another company's data, spoof a tenant header and hit a plan limit, all with the SQL shown.
live demoConcept project
Browse a news site, watch each page come from SWR, ISR or a fresh render, edit a story in the CMS and see the cache catch up.

Own product
Phone Speakers Cleaner is my own free tool website. It plays low-frequency tones in the browser to help shake water, dust and lint out of a phone's speaker grille, and adds a tone generator, a left and right speaker test and a blog of practical guides that bring search traffic to the tool. Nothing is recorded or uploaded.
live demoConcept project
Scan a table code, order with modifiers, then run the kitchen board from New to Served and watch your tracker update.
live demoConcept project
Switch roles, open a guarded URL, edit the permission matrix and force a forbidden API call to see the 403 land in the audit log.
live demoConcept project
Filter 60 listings, hover a card to light its pin, search the map area, save a search and reopen it from a copied link.
live demoConcept project
Take a timed exam, reorder items by drag or keyboard, see partial credit and explanations, then review missed questions.
live demoConcept project
Click a farm on the map, choose a crop and stage, and get live-weather advice on irrigation, heat stress and spray windows.
live demoConcept project
Fire signed webhooks, tamper with one, resend a duplicate and watch a flaky destination retry on a schedule.
live demoConcept project
Configure a product, check out with a Sunday delivery date and watch which WooCommerce hooks fire, with the PHP for each.
live demoConcept project
Switch WordPress speed fixes on and off and watch a modelled waterfall, LCP, CLS and TBT change. The model is shown in full.

Built while at GraphyD
GraphyAI puts nine AI studios behind one login: chat with leading language models, image and video generation, document analysis and a library of more than 24,000 curated prompts. I built the platform with Next.js and React for GraphyD, and it runs on Vercel with plans for free and paid users.

Built while at GraphyD
GraphyD is a digital marketing agency offering SEO, paid ads, web design, social media, branding and email marketing. I built its website as a fast static site in HTML, CSS and JavaScript, drafting it with an AI model and then refining the layout, content structure and SEO by hand.
Own product
ReviewLens (working name) is a SaaS I built for online stores. It reads a store's customer reviews, returns and competitors and turns them into a short report: what customers complain about, which products cause the most problems and what to fix first. All numbers are computed in code, and AI only classifies text and explains the results.
#react6 min
React rendering performance in React 19: measure with the Profiler, let React Compiler handle memoisation, fix state placement and virtualise long lists.
read →
#react7 min
How to build accessible React components: a modal dialog on native dialog, a keyboard-friendly menu button, focus management, ARIA basics and WCAG 2.2 checks.
read →
Sami Ullah has held senior front-end React/JavaScript developer roles since August 2022, at Tribech Solutions, Techtonex, IKONIC and HybridMediaworks, and uses React in his current MERN stack role at Earth Scan Systems. The exact count on this page is computed from his experience timeline at build time.
Yes. Sami Ullah writes React components in TypeScript and pairs them with Tailwind CSS for styling. Typed props and typed API responses catch a large class of bugs before the code reaches the browser, which matters most on long-lived dashboards and forms that several developers touch.
Yes. Converting Figma and Adobe XD designs into responsive React components is a core part of his front-end work. He builds reusable components that match the design, then checks spacing, states and keyboard behaviour so the result works for real users and not only in the mockup.