01About

Available for projects

Frontend DeveloperUI/UX Designer

Mustafa Manhal

Self-taught, based in Iraq, and taking on client projects. I take a product from the first wireframe to the deployed site: the design and the frontend code, both mine.

I started with HTML and CSS out of curiosity and haven't stopped since. I care about clean interfaces, fast pages and code that's easy to reason about. Every project I build is shipped to production. Nothing stays in a drawer.

Start a projectDownload CV
Location
Iraq · UTC+3
Focus
Design + frontend
Stack
Next.js · TypeScript · Tailwind
Works in
English · Arabic (RTL)
02How I work

One person, the whole way through.

Most projects lose something between the person who designs them and the person who builds them. Here there is no handoff to lose it in.

I design it
Then I build it
  1. 01

    Scope

    What you need, who it's for, what done looks like. Written down before any work starts.

  2. 02

    Structure

    Sitemap, flows and wireframes, agreed while they're still cheap to change.

  3. 03

    Design

    High-fidelity screens in Figma, built from components and tokens the code will reuse.

  4. 04

    Build

    Typed React components, responsive and checked on real viewports down to 320px.

  5. 05

    Ship

    Deployed on your domain, with the repo, the Figma file and a walkthrough.

03What I know

Both halves, at the same depth.

Design

7
  • Figma90%

    Wireframing · Prototyping · Design systems · Variables

  • Design Systems90%

    Tokens · Components · Variants · Documentation

  • Bilingual & RTL90%

    EN/AR · Mirrored layouts · Type in two scripts

  • Responsive Layout90%

    Mobile-first · Tablet · Desktop · Breakpoints

  • User Flows85%

    Task flows · UX states · Edge cases · Empty states

  • UX Research80%

    User interviews · Journey maps · Usability testing

  • Visual Direction80%

    References · Type & hierarchy · Moodboards

Build

7
  • Tailwind CSS95%

    Utility-first · Responsive · Dark mode · Animations

  • Next.js App Router90%

    App Router · Layouts · Server Components · Vercel · Client Components

  • JavaScript90%

    ES6+ · Async / await · DOM · Fetch

  • TypeScript90%

    Interfaces · Generics · Typed props · Axios

  • React / Vite85%

    Hooks · Context · React Router · State

  • Tooling & DX80%

    Git · GitHub · GitLab · Conventional commits

  • Redux Toolkit80%

    Redux Store · createSlice · RTK Query · Thunks

04How I got here

Five years, one direction.

  1. 2022

    Early days

    Started with HTML & CSS

    First contact with web development. Static pages and the fundamentals of how the web works.

    Build

  2. 2023

    Design curiosity

    Discovered UI/UX design in Figma

    Designed interfaces and hero prototypes, and studied typography, spacing and colour.

    Design

  3. 2024

    The Odin Project

    Went deep on React

    Completed the React course and shipped three projects to production: a CV builder, a memory card game and a shopping cart.

    3 shipped

  4. 2025

    The production stack

    Next.js, TypeScript and Tailwind

    Built and deployed Next.js projects, set up GitHub and GitLab workflows, and worked through a 90-topic Next.js roadmap.

    Build

  5. 2026

    Now

    Taking on client projects

    Bilingual design and frontend builds for small companies and startups, alongside designing and building this portfolio.

    Available

Under the hood

What this site is built with

Designed in Figma, built with Next.js, and deployed on Vercel. Every piece of this portfolio was chosen, wired up, and shipped by me.

Framework

  • Next.js 16App Router, static generation
  • React 19Server & client components
  • TypeScriptTyped routes & props
  • TurbopackDev server & builds

Styling

  • Tailwind CSS v4Utility-first styling
  • Design tokensColors & spacing
  • Tabler IconsIcon set
  • GeorgiaSite-wide serif

Content

  • MDXBlog posts & case studies
  • rehype-slugHeading anchors & TOC
  • Dynamic OG imagesGenerated per page

Forms & email

  • Server ActionsContact form submission
  • ZodSchema validation
  • ResendEmail delivery

Infrastructure

  • VercelHosting & deploy previews
  • Git & GitHubVersion control
  • Vercel AnalyticsTraffic & Web Vitals
  • ESLintLinting

Design

  • FigmaWireframes & UI screens
  • Design systemComponents & variables
  • WebP assetsOptimised screen exports

I design it.
Then I build it.

Bilingual (EN/AR) landing websites for small companies and startups, from one person.

Start a projectSee the work