Abdulrahman Ahmed ali
Web development and User Experience
New to Contra
Abdulrahman is building their profile!
š§ I've been working on a WhatsApp Shared Inbox project that has grown way beyond "just another frontend."
It includes:
Feature-based architecture
Shared API layer
Centralized state
Runtime diagnostics
Modular features
Realtime communication
Architecture verification phases
Technical audits before every major release
What surprised me the most is that React itself became a very small part of the challenge.
The real challenge became answering questions like:
How do you stop modules from depending on each other?
How do you prevent technical debt before it happens?
How do you keep the project understandable after thousands of lines of code?
I started spending more time designing folders, boundaries, ownership, and contracts than actually writing components.
At first, I thought I was "slowing myself down."
Now I realize I was actually building something I can keep maintaining for years.
Curious if anyone else had the same shift when moving from small apps to larger production projects.
0
0
š Do you have an idea for a website or web application? Let me turn it into a real product from scratch.
Many business owners and startups have excellent ideas, but they get stuck on one question:
"Where do I start?"
I'm not just a developer who writes code; I work with you step by step until your idea becomes a product ready for launch.
š First Step: Understanding Your Idea
We'll have a quick session to understand:
Project Goal
Target Audience
Problems the Project Will Solve
Essential Features You Need
Future Growth Plan
š Next, I'll Turn Your Idea into a PRD
I'll write a Product Requirements Document (PRD), which is the project's primary reference and includes:
ā
All Website Pages
ā
All Required Features
ā
User Flow
ā
User Permissions
ā
Databases
ā
Required APIs
ā
Complete Implementation Plan
This allows us to start implementation knowing everything, without surprises or unforeseen changes.
šļø Next, we plan the project.
Before writing the first line of code, I do:
āļø Project Architecture
āļø Database Design
āļø Folder Structure
āļø Tech Stack Selection
āļø Development Roadmap
šØ Then, I create a project presentation.
You'll see the project before implementation.
You'll learn:
How it will work
How the user will navigate between pages
The dashboard layout
The workflow
And all the project details
So you can be 100% sure that what's built is exactly what you envision.
š» Implementation Begins
I build the entire project using the latest technologies, paying close attention to:
ā” Performance
š Security
š± Responsive Design
š Scalability
š§© Clean Architecture
ā
Testing
Each feature is tested, with unit testing used in the appropriate parts to ensure the project's quality and stability.
š Deployment
Upon completion, I deploy the project to the server, preparing it for use and providing post-delivery support.
š¼ Services I Offer
ā
SaaS Platforms
ā
CRM Systems
ā
Task Management Systems
ā
E-Commerce Websites
ā
Company Websites
ā
Landing Pages
ā
Booking Systems
ā
Admin Dashboards
ā
Custom Web Applications
ā
API Integration
ā
Authentication & Role-Based Access
āļø Technologies I Use
Frontend
React.js ā¢ Next.js ā¢ TypeScript ā¢ JavaScript ā¢ Redux Toolkit ā¢ Tailwind CSS
Backend
Node.js ā¢ Express.js ā¢ Supabase ā¢ Firebase
Database
PostgreSQL ā¢ MongoDB
Tools
Git ā¢ REST APIs ā¢ Unit Testing ā¢ AI-Assisted Development (Cursor, Cloud, GitHub Copilot)
šØāš» About Me About Me
I'm a Full-Stack JavaScript Developer with approximately 4 years of experience in web application development. I've worked on a variety of projects, including:
SaaS Platforms
Task Management Systems
E-Commerce Platforms
Business Dashboards
Booking Platforms
Medical Websites
Custom Business Solutions
My goal is for you to receive a professional, scalable, and easy-to-maintain product, not just a website that looks good.
š Portfolio:
https://my-profile-pink-xi.vercel.app
š» GitHub:
https://github.com/Ab-Coder123
š¼ LinkedIn:
https://linkedin.com/in/abdulrahman7hmed
š§ Email:
[abdulrahmanahm7li@gmail.com (mailto:abdulrahmanahm7li@gmail.com)]
š± WhatsApp:
01118682951
If you have an idea, even if it's just a concept on paper, send it to me and we'll work together to turn it into a real project, step by step.š
0
1
Over the past few months, I've been working on one of the biggest frontend architecture projects I've ever built.
The project is a production-grade Shared WhatsApp Inbox built as a WordPress plugin for teams.
It started as a large monolithic codebase where almost every feature lived inside a single JavaScript file. As the project grew, maintaining and extending it became increasingly difficult.
Instead of adding more code, I focused on rebuilding the architecture.
Some of the work included:
ā¢ Migrating thousands of lines of legacy JavaScript into a fully modular feature-based architecture.
ā¢ Building isolated modules for Inbox, Contacts, Composer, Notes, Tags, Assignments, Settings, and Diagnostics.
ā¢ Creating shared layers for API communication, state management, UI utilities, and event handling.
ā¢ Eliminating duplicated logic and reducing coupling between features.
ā¢ Designing a scalable structure that's much easier to maintain, test, and extend.
ā¢ Preparing the frontend for enterprise-level growth without changing the product behavior.
This project reminded me that frontend engineering isn't just about building interfaces.
It's about designing systems that can survive years of development.
Performance, maintainability, scalability, and clear ownership become just as important as writing components.
I'm excited to continue pushing this architecture even further as backend integration and production validation move forward.
#Frontend #JavaScript #WordPress #Architecture #SoftwareEngineering #React #FrontendDeveloper #ModularArchitecture #Engineering
0
4
Darins Inbox ā CRM & Support Dashboard
Darins Inbox is a modern CRM and WhatsApp shared inbox platform designed to help support teams manage customer conversations from a single workspace.
For this project, I designed and built multiple dashboards covering the entire support workflow, including the shared inbox, command center, activity logs, system health monitoring, and a dedicated support center.
The main focus was creating an interface that feels clean, fast, and scalable while handling complex data in an easy-to-understand way. I paid special attention to dashboard hierarchy, reusable UI components, filtering systems, real-time status indicators, and responsive layouts to improve the overall user experience.
Highlights
Shared WhatsApp inbox for support teams
Command Center for API configuration and connection monitoring
Real-time System Health dashboard
Activity Logs with advanced filtering
Integrated Support Center with documentation and ticket creation
Clean, scalable design system with reusable components
Responsive layout optimized for desktop workflows
Role: UI/UX Design & Front-End Development
Tools: React.js, Next.js, TypeScript, Tailwind CSS, Redux Toolkit
0
4
BNW ā Modern Fashion E-Commerce UI (React & Next.js)
This project showcases my approach to building production-ready e-commerce experiences. I developed a modern fashion storefront featuring a premium dark UI, responsive layouts, reusable components, and an intuitive shopping journey. The application includes product browsing, detailed product pages, a secure checkout experience, payment screens, and order confirmation, all optimized for performance and scalability. The goal was to create an interface that feels both visually refined and fast in real-world use.
0
8
š Responsive Marketplace Platform and Modern Marketplace UI ā Responsive Shopping Platform
1
22
Luxury E-Commerce Experience ā React.js & Next.js
0
22