chatsworth-farm-shop

Chatsworth Farm Shop

Shopify site, with the following ingredients:

• 'Flow' theme, plus our modifications and fixes
• Slatest theme toolkit

Domains

• https://shop.chatsworth.org [live]
• https://chatsworth-shop-dev.myshopify.com [dev store]

Admin login, via:

https://partners.shopify.com/ Details in LastPass

Requirements --------------- !! NEW (Sep '21) !! ---------------

• Update your .npmrc to access this private package, as explained here.

Dev

npm i npm start

BE VERY CAREFUL when choosing your start option as there are various stores and themes within. If working on the hamper builder:

Hamper Builder

Alongside your npm start process that uploads the theme, separately run:

npm run watch:hamper

Notes: This compiles and uploads an unminified bundle - accessed only by the dev store - but a minified one is created by npm run build for the live store.

Deploy

No formal pipeline deploy process, so simply:

npm run build
npm start
(Choose `upload [live store] live theme`, BUT FIRST):

• Check current branch is master
• Make sure the ES6/SCSS/hamper built correctly for this branch

Caveats

Auto-reload doesn't work unfortunately, as the shop redirects to its custom domain (shop.chatsworth.org) and Slatest doesn't support a custom proxy URL - we could easily add that feature in future though (PR's welcome, of course!).

Wait, what's going on?

The Shopify site is a hosted-solution, as they say. All this repo represents is the theme, which automatically FTPs itself to Shopify on file edits.

See the Slatest readme for more information, or refer to Amrita B2B, which works in the same way.

Hamper Builder Notes

Localstorage

Pros:

• Scalable (e.g. hamper cloning?)
• Will allow for 'hamper' tagged products to NOT be in the hamper as well

Cons:

• More effort to build, 'hamper mode' style
• Soft basket riskier as things go out of stock
• Need to push user to 'add' hamper on basket page

Basket

Pros:

• Definitely in user's basket at all times
• Simpler to build, possibly

Cons:

• Difficult to manage which products are in the hamper
• 'hamper' tagged products must be in the hamper
• Potentially only allows for 1 hamper

Conclusion?

Well, what is the actual difference? Only the location the hamper is stored. One softer but more configurable, the other harder and less.

Architecture / Deploy Notes

Hamper Builder

• New page, with name "Hamper Builder" and template hamper-builder

Hamper Container

• tag: "Hamper Container"

• meta object: hamper_slots

• Individually tick the storefronts check box for this meta field in shopify settings

• Collection called Hamper Containers, filtering for: -- products with tag Hamper Container -- inventory stock > 0

Hamperable Product

• tag: "Hamper Product"
• meta object: hamper_slots
• collection of products called "Hamper Products", filtering for: -- products with tag Hamper Product -- inventory stock > 0

Troubleshooting

• Hamper builder watch stops watching? close and open the entire terminal. Also run it directly from npm run ...