shopfront

etalase

• Intro dan inspirasi
• MVP khusus klien Hugo statis

Ketergantungan

• pelukan
• npm

Instalasi dan pengembangan lokal

 npm i
npm audit fix

Temukan kunci rahasia stripe Anda di sini. (Pertimbangkan untuk menggunakan /test/apikeys selama pengujian).

 echo STRIPE_SECRET=sk... > .env
edit config.toml
hugo server

Penciptaan produk

Buat produk di content/2020/

File konten produk

Struktur konten produk:

 content/YYYY/SKU/index.md

Dalam content/2020/wrt1/index.md Front Matter adalah satu-satunya sumber kebenaran untuk product . Dari public/*/index.json , daftar produk di JSON disinkronkan dengan backend Stripe, melalui make .

Halaman produk individual kemudian mereferensikan ID Harga checkout khusus klien yang diperlukan dari direktori data/price melalui templat Hugo Data.

Sinkronkan dengan garis

Anda tidak perlu membuat produk di stripe; stripe-sync.sh melakukan ini untuk Anda.

 make

Publikasikan ke situs web Anda

Pindahkan konten public ke server web Anda.

Mode khusus klien Stripe

• https://useshoppingcart.com/usage/cartprovider#client-only-checkout-mode

Struktur data

Mengikuti https://useshoppingcart.com/usage/cartprovider/ di layouts/_default/single.html .

Opsi pengiriman

Bagaimana cara mengiklankan batasan pengiriman secepatnya, agar tidak membuang waktu siapa pun?

Misalnya https://online.vicsmeat.com.au/ langsung meminta kode pos.

Resolusi: Tawarkan tombol untuk memungkinkan GPS mengisi otomatis lokasi mereka tetapi juga memungkinkan mereka mengetikkannya.

Stripe memiliki shipping_address_collection.allowed_countries seperti yang didokumentasikan dalam sesi validasiCartItems