Riad Dar Sido

Complete digital transformation for Riad Dar Sido, a boutique hotel in Marrakech. Built custom booking system with OTA synchronization using Astro, Payload CMS, and modern JAMstack architecture.

Client

Mouhssine Terrab

Role

Designer & Developer

Timeline

Ongoing

Year

2025

Tools & Technologies

Astro Payload CMS Turso Database Netlify Tailwind CSS TypeScript
Riad Dar Sido hero image

The Opportunity

I had the privilege of spearheading a complete digital transformation for Riad Dar Sido, a charming boutique hotel nestled in the heart of Marrakech, Morocco. The business was struggling with a WordPress site built by the owner’s son, with non-functional booking capabilities that forced complete reliance on expensive third-party platforms like Booking.com and Expedia Group.

The opportunity was clear: create a powerful, integrated digital solution that would give the hotel direct control over bookings while maintaining seamless synchronization with Online Travel Agencies (OTAs). This wasn’t just a website redesign—it was a chance to fundamentally reshape how the business operates and dramatically reduce operational costs.

With the logo also needing professional refinement, this project offered the exciting prospect of creating a cohesive brand identity that captures the essence of traditional Moroccan hospitality with modern digital excellence.

Riad Dar Sido - Opportunity illustration showing digital transformation potential
01

The Challenge

Riad Dar Sido faced a complex technical challenge that required building both frontend and backend solutions from scratch. The hotel needed multilingual support to serve international guests, and the existing third-party channel management system was eating into their already thin margins with unnecessary subscription fees.

My approach was ambitious: instead of recommending another paid service, I proposed developing a custom API integration to manage OTA synchronization directly, eliminating costly middlemen. This required transforming a standard CMS into a fully-functional Property Management System (PMS) that could handle all current business needs while remaining expandable for future growth.

The tight budget constraint meant every development decision had to be strategic. As my first project coding both frontend and backend, I had to learn quickly while leveraging AI coding assistants efficiently—using a spec-driven approach with detailed task breakdowns to minimize token usage and avoid costly mistakes.

Riad Dar Sido - Challenge illustration showing technical obstacles and solutions
02

The Approach

I structured this project around two core methodologies: User-Centered Design for the frontend experience and Spec-Driven Development for the technical implementation. The journey began with creating a comprehensive Product Requirements Document (PRD) that I broke down into granular tasks and subtasks.

This detailed task breakdown was crucial for working efficiently with AI coding assistants—keeping them focused on specific deliverables while reducing overall token consumption. The architecture was designed with microservices principles in mind, following JAMstack best practices to ensure future scalability without the headaches of monolithic systems.

I implemented multiple rounds of client consultation to deeply understand their business limitations and operational needs. This iterative feedback process ensured that every technical decision directly supported their business goals, from multilingual content management to automated booking workflows.

Riad Dar Sido - Approach illustration showing development methodology
03

The Solution

The final deliverable comprised two interconnected systems: a beautiful, responsive business website built with Astro, and a comprehensive Property Management System using Payload CMS as the backend. The frontend provides an elegant booking experience with instant availability checks and secure payment processing.

The backend PMS serves as the operational hub, handling multilingual content management, reservation synchronization between the website and major OTAs, and automated email notifications throughout the booking journey—from confirmation to cancellation. The Turso database ensures fast, reliable data storage while maintaining cost efficiency.

The design aesthetic reflects a perfect balance between modern functionality and traditional Moroccan charm, incorporating the refreshed logo and visual identity. Every interface element was crafted to enhance user experience while showcasing the authentic character of Riad Dar Sido.

Riad Dar Sido dashboard showing the custom Property Management System interface
04

The Impact & Results

While the project is still in development, the anticipated impact is substantial. The most significant achievement will be reducing the hotel’s digital infrastructure costs by approximately 90%, transforming what was once a major expense center into a streamlined, cost-effective operation.

By enabling direct bookings through their own website, Riad Dar Sido will eliminate commission fees paid to OTAs, capturing more revenue from each reservation. The custom PMS platform provides a foundation for future business growth, with the flexibility to add new features without requiring costly third-party integrations.

The client has expressed enthusiasm and satisfaction throughout the development process, eagerly anticipating the launch of their new digital presence. This project demonstrates how thoughtful, custom technical solutions can level the playing field for small businesses in the competitive hospitality industry.

Riad Dar Sido - Impact illustration showing business transformation and cost savings
05

Ready to Start Your Project?

Let's discuss how I can help bring your web development vision to life.

Start Your Project