Hi, I'm YAJ.
Developer and designer — I turn ideas into real products.
About Me
A closer look at my journey, tools, and how I build things.
Frontend & Product Developer
I design, build, and ship — from idea to first user.
Location
Madinah, Saudi Arabia
Coding Since
2020
<!DOCTYPE html> <html lang=""> <head> <title>Hi, I'm YAJ</title> </head> </html>
What I Do
I build fast, clear solutions — from first wireframe to final delivery.
Always Learning
Learning product thinking
Projects
Latest Projects
MoviePal
An AI-powered film recommendation engine — reads your mood, suggests what's worth watching.
Emtethal website
A metaverse-based platform designed to support students with disabilities in education through innovative technology.
HTML
CSS
Tailwind
JavaScript
Client Projects
Confidential freelance and personal projects that focus on custom development and creative solutions for various clients.
MoviePal
An AI-powered film recommendation engine — reads your mood, suggests what's worth watching.
Emtethal website
A metaverse-based platform designed to support students with disabilities in education through innovative technology.
HTMLCSSTailwindJavaScriptClient Projects
Confidential freelance and personal projects that focus on custom development and creative solutions for various clients.
MoviePal
An AI-powered film recommendation engine — reads your mood, suggests what's worth watching.
Emtethal website
A metaverse-based platform designed to support students with disabilities in education through innovative technology.
HTMLCSSTailwindJavaScriptClient Projects
Confidential freelance and personal projects that focus on custom development and creative solutions for various clients.
Tech Stack
What I Use
Frontend
HTML
The backbone of every web page — defines structure and content using semantic elements.
CSS
Controls the visual presentation of web pages — layout, colors, fonts, and responsive behavior.
React
A component-based UI library for building fast, scalable interfaces with reusable pieces and efficient state management.
JavaScript
Brings pages to life — handles user interactions, DOM manipulation, and dynamic content on the client side.
Next.js
A React framework for building full-stack web apps — handles routing, server-side rendering, and API routes out of the box.
TypeScript
A typed superset of JavaScript that catches errors at compile time, making large codebases more reliable and maintainable.
Tailwind
A utility-first CSS framework for building custom designs directly in markup — fast to write, easy to keep consistent.
Backend
JavaScript
Runs JavaScript on the server — great for real-time apps, REST APIs, and lightweight microservices.
Supabase
An open-source Firebase alternative — provides a Postgres database, auth, storage, and real-time subscriptions out of the box.
RESTful APIs
A standard architectural pattern for designing web services that communicate over HTTP using predictable, resource-based endpoints.
Python
A versatile language used for backend logic, automation scripts, data processing, and integrating AI/ML capabilities.
SQL
A structured language used to interact with databases
Tool & DevOps
ideaMaker
A slicing software by Raise3D that converts 3D models into printable instructions, optimizing supports, layers, and print quality.
Fusion 360
A professional CAD/CAM platform for 3D modeling, simulation, and generating toolpaths for CNC and laser fabrication.
Git
The standard version control system — tracks code changes, enables collaboration, and keeps a full history of every project.
VS Code
A lightweight yet powerful code editor with built-in Git support, IntelliSense, and a vast extension ecosystem.
Vercel
A cloud platform for deploying apps — handles CI/CD, edge caching, and preview deployments with zero configuration.
Design & Workflow
Adobe Illustrator
The go-to vector graphics tool for logos, icons, illustrations, and any artwork that needs to scale without quality loss.
Adobe Photoshop
Industry-standard raster editor for photo retouching, compositing, and creating detailed pixel-based graphics.
Adobe After Effects
The industry standard for motion graphics and visual effects — used to animate UI elements, create explainer videos, and add cinematic effects.
Canva
A browser-based design tool for quickly producing social media graphics, presentations, and marketing materials using templates.
My Achievements
A few numbers that represent my journey so far.
Competed — delivered — said nothing
The rank is known to those who ask
Ran — won — led
Three official university clubs
Taught & empowered
Gave the tools, let them create
Designed — built — delivered
Full-cycle university events, every time
Get In Touch
Let’s Connect