開(kāi)発者として、Shopify テンプレートに制限されることは望ましくありませんが、カスタム アプリでストアフロント API を使用することも望んでいません。必要に応じて調(diào)整できる、完全にカスタマイズ可能なソリューションを手元に置きたいと考えています。 ui/ux、db、バックエンド、api、認(rèn)証、devops などから。そこで、React、Next.js、MongoDB、Stripe を使用して、支払い用に完全にカスタマイズ可能なソリューションを構(gòu)築しました。

ここでデモリンクを見(jiàn)つけることができます: https://wexcommerce.dynv6.net:8002

ソースコードはこちら: https://github.com/aelassas/wexcommerce

次のソリューションを使用すると、少なくとも 1GB の RAM を備えた Docker ドロップレット上でホストすることで、運(yùn)用可能な Stripe 支払いゲートウェイを備えた SEO に最適化された完全にカスタマイズ可能な e コマース Web サイトを非常に低コストで構(gòu)築できます。

このソリューションは、フロントエンドと管理ダッシュボードで構(gòu)成されています。フロントエンドから、顧客は必要な製品を検索し、カートに追加してチェックアウトできます。顧客は、Google、Facebook、Apple、または電子メールでサインアップし、クレジット カード、代金引換、電信送金、PayPal、Google Pay、Apple Pay、Link、またはその他の Stripe 支払い方法で支払うことができます。ログインすると、購(gòu)入履歴にアクセスして注文に従うことができます。管理者は、管理者ダッシュボードから、注文、支払い、製品、カテゴリ、顧客、およびデフォルトの言語(yǔ)、通貨、配送、配送、受け入れられる支払い方法などの一般設(shè)定を管理できます。

TypeScript には多くの利點(diǎn)があるため、設(shè)計(jì)上の重要な決定事項(xiàng)として TypeScript を使用することが決定されました。 TypeScript は強(qiáng)力な型指定、ツール、統(tǒng)合を提供し、その結(jié)果、デバッグとテストが容易な、高品質(zhì)でスケーラブルで読みやすく保守しやすいコードが得られます。

特徴

• 在庫(kù)管理
• 注文管理
• 支払い管理
• 顧客管理
• 複數(shù)の支払いオプション (クレジット カード、代金引換、電信送金、PayPal、Google Pay、Apple Pay、リンク)
• 運(yùn)用可能な Stripe ペイメント ゲートウェイ
• 複數(shù)の配送オプション (宅配、店頭引き取り)
• 多言語(yǔ)サポート (英語(yǔ)、フランス語(yǔ))
• 複數(shù)のログイン オプション (Google、Facebook、Apple、電子メール)
• レスポンシブなバックエンドとフロントエンド

リソース

1. 概要
2. インストール中 (セルフホスト型)
3. インストール(Docker)
   1. Docker イメージ
   2. SSL
4. ストライプのセットアップ
5. ソースから実行
6. デモデータベース
   1. Windows、Linux、macOS
   2. ドッカー
7. 言語(yǔ)と通貨を変更します
8. 新しい言語(yǔ)を追加
9. ログ

フィードバックをお待ちしております。

以上がNext.js を使用して e コマースを構(gòu)築するの詳細(xì)內(nèi)容です。詳細(xì)については、PHP 中國(guó)語(yǔ) Web サイトの他の関連記事を參照してください。