Maxgro
Maxgro is a proof-of-concept e-commerce platform developed for a wholesale grocery business in Australia. The goal was to build a fast, scalable storefront that integrates with Shopify, enabling dynamic product variant handling and smooth order processing for a B2B audience.
Tools:
TypeScriptNext.jsShopify
Challenges
Implementing the Shopify Storefront API and ensuring the site could reliably fetch product data, process carts, and handle checkout operations.
Another challenge was to handle dynamic product variant. Many wholesale items had multiple variants (e.g., size, packaging, price tiers), which needed to be displayed and selected dynamically in the UI without disrupting the shopping experience.
Solutions
To integrate with Shopify, I used the shopify-buy SDK and structured API calls to enable cart creation, product listing, and order submission. I prioritized performance by optimizing data fetching and caching strategies.
For variant handling, I engineered a dynamic product card system that responded in real-time to user selections (like weight, pack size, or quantity), updating both the UI and the cart seamlessly. This required building a flexible state management system and refining the interface through iteration and testing to ensure reliability across devices.
Notable features
- Shopify Storefront API integration with real-time cart and checkout
- Fully responsive UI for all screen sizes
- Dynamic product variant selection system
- Optimized to load under 0.5s
- Secure implementation using the latest web standards
- Built with TypeScript, Next.js, and Shopify's SDK
Snapshots
Fruits collection
Vegetables collection
Meat collection
Seafoods collection
Products page
Product page
Cart view
Have an exciting project?
I am open to opportunities. Let's have a quick chat to see if we are a good fit.