Umrahly is a modern, responsive SaaS frontend project designed to help Muslims perform Umrah independently—without relying on expensive agencies or tour groups. Instead, users connect with trusted local guides and get personalized support on their spiritual journey.
“Skip the confusion and costs of packaged trips. Perform Umrah on your own terms—with clarity and confidence.”
You can visit the website:
🔗 Live Preview: Live Site
Built as a freelance project for a private client, Umrahly simplifies Umrah planning by enabling users to:
- Book their own flights and accommodations
- Connect with experienced, vetted Umrah guides
- Perform the rituals of Umrah with one-on-one guidance
🧭 Aimed at independent travelers, solo pilgrims, and families seeking flexibility and affordable support.
- 📱 Fully Responsive – Works across mobile, tablet, and desktop
- 📚 Educational Flow – Clear steps from travel to Tawaf
- 💬 Real Content – Tailored for first-time and returning pilgrims
- 💡 Lightweight and Fast – Optimized with Next.js and Tailwind CSS
- 🔔 Toasts & Alerts – Powered by
react-hot-toastfor better UX
This project uses the latest stable versions of modern frontend tools:
| Technology | Version | Description |
|---|---|---|
| Next.js | 15.4.2 | App routing, SSR, and performance |
| React | 19.1.0 | UI component library |
| Tailwind CSS | 4.1.11 | Utility-first styling framework |
| Lucide-react | 0.525.0 | Icon library |
| clsx | 2.1.1 | Conditional className utility |
| react-hot-toast | 2.5.2 | Toast notifications for real-time feedback |
| world-countries | 5.1.0 | Country data utility |
⚠️ Important:
This project was developed under a Non-Disclosure Agreement (NDA) for a private client on Upwork.For reasons of client confidentiality, data sensitivity, and security compliance, the source code cannot be shared publicly or distributed.
Please respect the privacy of this collaboration and understand that no repository access or code excerpts can be provided.
This project was built with a component-first, mobile-responsive, and performance-optimized mindset. Clean code, scalable folder structure, and best practices were followed throughout development—focusing on both developer efficiency and user experience.
Want to learn more or work together?
