Building a React checkout for M2
How we built a React checkout for Magento 2, replacing the knockout version, while using the default M2 API. A technical dive into the API and developing in React to prepare developers for PWA.
At Integer_net we needed to rebuild a checkout for a client that was moving from a custom built shop to Magento 2 Commerce. The goal was to keep the functionalities and visual presentation of the checkout identical to the old shop. Since the default Magento 2 checkout is almost impossible to heavily customise we opted for the option to build it from scratch, using React and the default M2 API.
This talk includes:
- How we unravelled the API endpoint/payloads/responses with Postman.
- How we implemented several React apps into the current Magento 2 frontend
- How we built the 4-step checkout, including Payment provider with React.
- The isolation/“headlessness” of the React app that enables us to move the checkout to a PWA solution in the future
A very timely presentation that shows how you can harness the power of React and learn all techniques that will be required for PWA in the future, while using the current Magento 2 frontend. (basically replacing knockout/ui components).
Willem Wigman
Willem has 8+ years of experience in building Magento webshops. Ran an e-commerce agency for 4 years and is now working at Integer_net GmbH. Focusses on Magento 2 Frontend, Backend and Javascript (React).