Overview
A Progressive Web App for food delivery that demonstrates the complete user journey from start to finish. Talabi covers everything: browsing nearby restaurants with categories and search, exploring detailed menus with photos and nutritional info, building a cart with customization options, checking out with address selection and payment, and tracking your order in real-time on a map as it moves from restaurant to doorstep. Built as a front-end concept that showcases how PWA technology can deliver a native app experience without requiring an app store download.
The Challenge
Food delivery apps set a high bar for user experience. They need to feel instant, handle complex state (cart items, customizations, order status), and provide real-time feedback at every step. Building this as a PWA meant achieving native app-level performance and feel entirely in the browser, including offline support for browsing previously loaded restaurants, smooth transitions between screens, and real-time order tracking with map integration. The app also needed to handle edge cases like restaurant availability, delivery zones, estimated times, and promo codes, all with a clean, uncluttered interface.
The Solution
A React-based PWA with service worker caching for offline support and instant subsequent loads. The restaurant browsing experience features category filtering, search, and location-based sorting with lazy-loaded images for fast scrolling. Menu pages show rich detail with food photography, calorie counts, and customization options. The cart persists across sessions with real-time price calculation. Order tracking uses a map view showing the driver's real-time location with status updates (confirmed, preparing, out for delivery) and estimated arrival times. The entire flow is wrapped in smooth page transitions and micro-animations that make it feel indistinguishable from a native app.
