shopfront
shopfront copied to clipboard
Suckless Shop Front using Hugo
shopfront
Dependencies
Installation and local development
npm i
npm audit fix
Find your stripe secret key here. (Consider using /test/apikeys during testing).
echo STRIPE_SECRET=sk... > .env
edit config.toml
hugo server
Product creation
Create products in content/2020/
Product content file
Structure of product content:
content/YYYY/SKU/index.md
In content/2020/wrt1/index.md
the Front
Matter is the single
source of truth for product. From public/*/index.json
, the product listing
in JSON are synced with Stripe's backend, via make
.
The individual product pages then reference the required client-only
checkout
Price ID from the data/price
directory via Hugo Data
templates.
Sync with stripe
You don't need to create your product on stripe; stripe-sync.sh
does this for you.
make
Publish to your website
Move the contents of public
to your webserver.
Stripe client-only mode

- https://useshoppingcart.com/usage/cartprovider#client-only-checkout-mode
Data structure
Follows that of https://useshoppingcart.com/usage/cartprovider/ in layouts/_default/single.html
.
Delivery options
How to advertise delivery limitations ASAP, as to not waste anybodies time?
For example https://online.vicsmeat.com.au/ asks for a post code off the bat.
Resolution: Offer a button to enable GPS to autofill their location but also allow them to type it in.
Stripe has a shipping_address_collection.allowed_countries as documented in validateCartItems session