An eCommerce site which offers a range of high-end technology products using Commerce.js Headless CMS. A Stripe gateway is also configured (in test mode) directing customers to the checkout and payment page with a mock transaction flow. This has been built using TypeScript, React, React Hook Form, Material UI, Babel, PostCSS & Webpack and deployed via Vercel.
Features:
- eCommerce Site with several dummy products
- Allows multiple purchases of products
- Ability to update cart (increase/decrease/remove items and empty cart)
- Leverages Commerce.js and Stripe gateway for data storage and transactions
- Form validation with dynamic location/region fields (using React Hook Form)
- DOMPurify to sanitize HTML strings from Commerce.js
- Material UI used to render stylized React components
- Fully responsive
- Optimised for the web
Please note that the payment system is configured to sandbox mode (ie. no payments will be taken from an active card. If you wish to use dummy credit card details instead, Stripe have provided some here)
Stacks & Tools Used:
Links
Disclaimer
- The name 'Lite Life' used herein is solely fictional and any representation to an existing company, in part or whole, is entirely coincidental.