From idea to execution, Swipe iX is renowned for building astonishing applications in record time, and the Food24 Family Cookbook made with McCain is no exception. Combining the best of print and digital, Swipe iX built the personalised Cookbook Creator tool that went live on 24 November, giving millions of South Africans the ability to create a custom cookbook online. This can then be ordered fresh off the press and delivered to their homes.
The digital realm has its perks, but tangibility isn’t one of them. With the Cookbook Creator, users are able to create a personalised cookbook online and have it bound and delivered, blurring the boundaries between the digital and physical worlds.
Preserving family recipes passed down from generations – or even just a few of your recently invented, scrumptious lockdown dishes – has never been easier. To quote Swipe iX COO Hendri Lategan: “This opportunity allows anyone to take the creation experience into their own hands, instead of leaving it to a highly specialised few, and truly democratises creativity in the physical realm in a way never before possible.”
The platform was architected using a serverless approach on Amazon Web Services. The projects were built using the latest development methodologies, with high performance and support as a necessity. A rest API was hosted on API Gateway using AWS Lambda as the compute platform and progressive web applications were leveraged for both the web and mobiles sites, as well as the CMS. Both web applications are hosted on an S3 bucket and are served via CloudFront, while the infrastructure and deployments are managed using Terraform.
To tackle the CSS front end, Swipe iX used styled-components and styled-systems to maintain clean code, to allow automatic browser prefixing and to provide functionality while simplifying theming. On the JavaScript side, the application was built on the React JavaScript framework combined with Redux Toolkit and Reselect. React allows for building fast and dynamic single-page applications with wide browser support and seamless integration with vanilla JavaScript and other tools. Its tiny size and exceptional performance made it an excellent choice for building this fast, responsive web application and the various components.
To bring it all together, we used Webpack as the workflow and processor tool, to allow the JavaScript and SCSS to be validated via pre-commit hooks, compiled, minified and ready to run. Error handling was built into the system with Sentry.io, allowing us to catch and track errors in users’ experience during application usage, while also serving as a central place for critical insights into the sequence of events that led to the possible errors in question. This process allows the Swipe iX development team to quickly flag errors and fix them, greatly reducing reaction time.
The challenges of building a unique tool of this nature could only be solved through the application of equally unique solutions. The Swipe iX team worked tirelessly to create this bespoke, technology-agnostic platform in under three months, all the while ensuring that each component blended seamlessly with one another.
Keen to see our tool in action and create your own family keepsake? Head on over to the Food24 website and bring your recipe ideas to life!
Digital Marketing Specialist