The challenge
Food and beverage businesses with multiple branches need an ordering experience that connects products, branch availability, customer location, delivery, pickup, promotions and checkout without making the process feel fragmented. A traditional multi-page storefront can introduce unnecessary steps, especially for customers placing quick repeat orders.
For a Saudi-focused business, the platform also needed Arabic and English support, location-aware branch selection, SAR pricing, local VAT handling and an ordering flow designed around both delivery and in-store pickup.
The project required a fast, mobile-friendly ordering interface where customers could discover the nearest branch, manage delivery addresses, browse branch-specific products, authenticate with their phone number and complete an order from one continuous experience.
What we built
Codevioso developed a bilingual single-page food ordering application that brings branch selection, location services, product discovery, customer authentication, basket management and checkout into one streamlined interface.
Key features
- English and Arabic interface with automatic LTR and RTL switching
- Delivery and pickup fulfilment modes with persisted customer preference
- Google Maps integration with draggable location pins and reverse geocoding
- Browser geolocation support for detecting the customer's current position
- Branch-distance calculation using Google Distance Matrix API
- Automatic nearest-branch sorting with configurable delivery-distance limits
- Saved delivery-address management with map coordinates and building details
- Branch-specific product categories and catalogue loading
- Promotional slider with autoplay and fade transitions
- Product options with single-select, multi-select and quantity controls
- Dynamic product pricing with real-time line-total calculations
- Passwordless phone-number authentication with 5-digit OTP verification
- Automatic customer registration for previously unused mobile numbers
- Server-side basket that persists across sessions and devices
- Add, increase, decrease and remove basket item workflows with inline loading states
- Coupon browsing, validation, application and removal
- Reactive payment summary covering products, tax, delivery fees, discounts and final total
- Order placement with branch, fulfilment, location and payment information
- Order confirmation and post-order tracking interface
- Customer account area for profile, order history, payments and saved addresses
- Expandable order receipts with product totals, VAT, delivery charges and final amount
- Bilingual toast notifications and per-action loading feedback
- Responsive layout from mobile to large desktop screens with collapsible sidebar navigation
