The Challenge
Kukd.com was a UK-based food delivery and table booking platform connecting diners with restaurants across the country. When I joined the project, the platform needed critical improvements to its checkout experience and payment infrastructure. The existing payment integration had reliability issues, and the checkout flow had friction points that affected conversion rates.
My role was to improve the payment pipeline, fix bugs across the full stack, and enhance the user experience throughout the ordering and booking flows.
What I Built
Payment Integration with Checkout.com
The most significant contribution was implementing the payment integration with Checkout.com. This involved:
- Building the client-side payment form with card tokenization for PCI compliance
- Implementing the server-side payment processing flow through the Checkout.com API
- Adding error handling for failed transactions, card declines, and network timeouts
- Supporting multiple payment methods and saved cards for returning customers
Checkout Flow Improvements
I redesigned parts of the multi-step checkout process to reduce abandonment. This included streamlining the address entry, delivery option selection, and promo code application — all while keeping the Redux state in sync across steps so users could navigate back without losing their selections.
Bug Fixes and State Management
The application used Redux for complex state management across the ordering pipeline — tracking cart items, delivery options, applied promotions, and user session data. I identified and fixed several state synchronisation bugs that caused inconsistencies between the cart display and actual order data, particularly when users navigated between menus and checkout.
Technology Stack
- Next.js: Server-side rendering for restaurant listing and menu pages, ensuring fast initial loads and SEO visibility for restaurant discovery.
- React.js: Interactive UI components including real-time menu browsing, cart management, and the multi-step checkout flow.
- Redux: State management across the ordering pipeline — cart items, delivery options, promotions, and session data.
- Node.js: Backend API handling restaurant data, order processing, authentication, and third-party service communication.
- Checkout.com: Payment gateway for secure credit and debit card processing with tokenization and transaction management.