Projects
Shopify custom block created with React: Multi-variants, multi-quantity ‘Add to Cart’ streamlines complex product purchases for better UX. The functionality is particularly beneficial for specialized products
Features:
- Combining multi-variant and quantity selection into a single control.
- Supporting custom bundles via metafields, unifying media display of 2 products!
- Using a dynamically injected entry point to add all selected items to the cart in one Shopify AJAX call
Technology:
- React, Redux, React-router
- Pub/Sub: Sync React+vanilla JS
- TailwindCSS, Framer-motion
- Vite
Links:

Leveraging React, Redux, and Router to build custom app that fetch shopify store data using Admin/Storefront GraphQL APIs
Features:
- Fetch bestsellers with Shopify Storefront APIs
- Fetch customers with Shopify Admin APIs
- Customer contact directory
Technology:
- React, Redux, React-router
- Tailwindcss, Framer-motion
- Vite, Typescript
Links:

Decoupled react landing page (hosted separately) interacts with the Shopify Storefront API for data retrieval.
Features:
- Utilizing Shopify Storefront API for order processing
- Custom-built front-end touchpoints
- Real-time products updates with Web hooks
- Secure payment processing through Shopify Payments
- Hosted on Netlify
Technology:
- React, React-router
- Tailwindcss, chakra-ui
- Shopify-buy SDK
Links:

Manage & track warehouse packing/shipping tasks in order to streamline the operation for online orders.
Features:
- Track workers task duration
- Realtime inspection by supervisor
- Realtime inventory alert
- Worker efficiency report
Technology:
- React, Redux
- Materialize: Mobile-first layout
- Firebase: User accounts & authentication
- Firestore: NoSQL Database
Links:
