ステップバイステップガイド：AdaloでAmazonクローンを構築する

Adaloが独自のAmazonクローン構築に最適な理由

Amazonのようなマーケットプレイスアプリを作成するには、複雑な商品カタログ、ユーザーアカウント、ショッピングカート、決済処理を処理しながら、顧客がどのデバイスを使っているかに関わらずリーチする必要があります。Adaloはデータベース駆動型のWebアプリとネイティブiOS・Androidアプリを構築できるノーコードアプリビルダーで、3つのプラットフォームすべてで1つのバージョンを使用し、Apple App StoreとGoogle Playに公開できます。コードを1行も書かずに完全に機能するEコマースマーケットプレイスを構築するための理想的なプラットフォームです。

Amazonスタイルのショッピング体験には、ネイティブアプリの配信が不可欠です。顧客はデバイスのアプリストアでマーケットプレイスを見つけることを期待しており、ネイティブアプリにより注文確認、配送状況、プロモーションアラートのプッシュ通知が可能になります。大手小売業者が顧客を呼び戻し続けているのと同じエンゲージメント戦術です。Adaloを使えば、単一の統合されたビルドからアプリ全体のマーケットプレイスを管理しながら、そのプロフェッショナルなアプリストア対応の体験を提供できます。

AdaloがAmazonスタイルのマーケットプレイス構築に適している理由

マルチベンダーマーケットプレイスを構築するには、商品、ユーザー、注文、セラーアカウントの堅牢なデータベース管理が必要で、1つのビルドからWeb、iOS、Androidすべてでアクセスできる必要があります。Adalo（AIを搭載したアプリビルダー）はこの複雑さを処理しながら、Apple App StoreとGoogle Play Storeに真のネイティブアプリを公開します。負荷がかかると苦戦するWebラッパーとは異なり、Adaloの専用アーキテクチャはマーケットプレイスがスケールしても高パフォーマンスを維持します。

このチュートリアルでは、商品リスト、ショッピングカート、ユーザーアカウント、セラーダッシュボード、Stripe決済処理を備えたAmazonスタイルのマーケットプレイスアプリを構築する手順を説明します。コードを書いたり何も再構築したりすることなく、同じアプリをWeb、ネイティブiOS、ネイティブAndroidに公開できます。

前提条件と初期設定

ステップ1：Adaloアカウントの作成

1. Adalo.comにアクセスしてサインアップ
2. 「Create New App」をクリック
3. Responsive App（Adalo 2.0）を選択（Mobile Appも可、ただしResponsiveが現代的なレイアウトには推奨）
4. アプリに名前を付ける（例：「MarketplaceApp」）
5. 「Start from Scratch」を選択

Ada（AdaloのAIビルダー）は、説明を入力するとアプリを生成します。Magic Startは説明から完全なアプリの基盤を作成し、Magic Addは自然言語で機能を追加します。

プロのヒント：Magic Startはシンプルな説明から完全なアプリの基盤を生成できます。マーケットプレイスアプリが必要と伝えると、データベース構造、画面、ユーザーフローが自動的に作成されます。以前は計画に数日かかっていたことが数分で完了します。

ステップ2：アプリ設定の構成

1. プライマリカラースキームを選択（AmazonはオレンジとYellow）
2. きれいなプロフェッショナルなフォントを選択
3. アプリアイコンとスプラッシュ画面を設定
4. 「Continue」をクリックしてエディタに入る

データベースの設定

マーケットプレイスのデータベースは、ユーザー、商品、注文、レビュー間の複雑なリレーションシップを処理する必要があります。Adaloの有料プランの無制限のデータベースレコードにより、商品カタログと注文履歴が成長してもストレージ制約に当たることはありません。

ステップ3：Usersコレクションの拡張

1. 左サイドバーのDatabaseアイコンをクリック
2. デフォルトの「Users」コレクションを選択
3. これらのプロパティを追加（「+ Add Property」をクリック）：
   • Profile Picture（画像）
   • Full Name（テキスト）
   • Phone Number（テキスト）
   • Address（テキスト - 「Multiline」にチェック）
   • City（テキスト）
   • State（テキスト）
   • Zip Code（テキスト）
   • Is Seller（True/False - デフォルト：false）
   • Seller Name（テキスト）
   • Seller Rating（数値 - デフォルト：0）
   • Account Created（日付 & 時刻 - 自動）

Usersコレクションについての詳細

ステップ4：Productsコレクションの作成

1. 「+ Add Collection」をクリック
2. 「Products」と名前を付ける
3. プロパティを追加：
   • Product Name（テキスト）
   • Description（テキスト - 「Multiline」にチェック）
   • Price（数値 - 小数点2桁）
   • Sale Price（数値 - 小数点2桁）
   • Main Image（画像）
   • SKU（テキスト）
   • Stock Quantity（数値 - デフォルト：0）
   • Weight（数値）
   • Is Active（True/False - デフォルト：true）
   • Featured（True/False - デフォルト：false）
   • Created At（日付 & 時刻 - 自動）
   • Category（テキスト）
   • Average Rating（数値 - デフォルト：0）
   • Total Reviews（数値 - デフォルト：0）

Ordersコレクションの作成

1. 「+ Add Collection」をクリック
2. 「Orders」と名前を付ける
3. プロパティを追加：
   • Order Number（テキスト）
   • Total Amount（数値）
   • Status（テキスト：「Pending」、「Processing」、「Shipped」、「Delivered」、「Cancelled」、「Refunded」）
   • Payment Status（テキスト：「Pending」、「Paid」、「Failed」、「Refunded」）
   • Stripe Payment Intent（テキスト）
   • Shipping Address（テキスト）
   • Tracking Number（テキスト）
   • Notes（テキスト）
   • Created At（日付 & 時刻 - 自動）

Order Itemsコレクションの作成

1. 「+ Add Collection」をクリック
2. 「Order Items」と名前を付ける
3. プロパティを追加：
   • Quantity（数値）
   • Unit Price（数値）
   • Total Price（数値）

Cart Itemsコレクションの作成

1. 「+ Add Collection」をクリック
2. 「Cart Items」と名前を付ける
3. プロパティを追加：
   • Quantity（数値 - デフォルト：1）
   • Added At（日付 & 時刻 - 自動）

データベースリレーションシップの設定

• Products ↔ Users：「Seller」（Many-to-One）
• Orders ↔ Users：「Buyer」（Many-to-One）
• Order Items ↔ Orders：Many-to-One
• Order Items ↔ Products：Many-to-One
• Cart Items ↔ Users：Many-to-One
• Cart Items ↔ Products：Many-to-One

コア画面の構築

ホーム/商品発見画面

1. ホームページの画面を作成
2. ヒーローバナーとプロモーションセクションを追加
3. Featured ProductsのCustom Listを追加：
   • フィルター：Featured = True AND Is Active = True
   • 並び替え：Created At（新しい順）
4. カテゴリブラウジングセクションを追加
5. 商品検索用の入力コンポーネントを追加

商品詳細画面

1. 「Product Detail」画面を作成
2. 商品情報を表示：
   • メイン画像（大きく、上部に）
   • 商品名（大見出し）
   • 価格（セール価格がある場合は通常価格と並べて表示）
   • セラー名とレーティング
   • 説明（全文）
   • 在庫状況
   • レビューとレーティング
3. 数量セレクターを追加
4. アクションボタンを追加：
   • 「Add to Cart」（Cart Itemsにレコードを作成）
   • 「Buy Now」（直接チェックアウトへ）
   • 「Add to Wishlist」

ショッピングカート画面

1. 「Cart」画面を作成
2. Cart ItemsのCustom Listを追加：
   • フィルター：User = Logged In User
3. 各アイテムに表示：
   • 商品画像、名前、価格
   • 数量の増減ボタン
   • 削除ボタン
4. 注文サマリーを追加：
   • 小計（Cart Itemsの合計を計算）
   • 配送料
   • 税額
   • 合計
5. 「Proceed to Checkout」ボタンを追加

チェックアウト画面

1. 「Checkout」画面を作成
2. 配送先住所フォームを追加（既存の住所のドロップダウンまたは新規入力）
3. Stripe Paymentコンポーネントを追加（Adalo Marketplaceから）
4. 注文確認ボタンを追加：
   • Orders レコードを作成
   • 各Cart ItemのOrder Itemsレコードを作成
   • Cart Itemsをクリア
   • 確認メールを送信（Zapier経由）
   • セラーに通知

セラーダッシュボード

1. 「Seller Dashboard」画面を作成（Is Seller = Trueのユーザーのみ表示）
2. 指標を表示：
   • 総収益
   • アクティブな掲載数
   • 処理中の注文
   • 平均レーティング
3. 商品管理リストを追加（編集/削除オプション付き）
4. 注文管理セクションを追加
5. 「Add New Product」ボタン

パフォーマンスと公開

2025年後半のAdalo 3.0インフラ刷新後、アプリは以前より3〜4倍高速になりました。X-Ray機能を使ってパフォーマンスの問題を積極的に特定できます。有料プランには無制限のデータベースレコードが含まれており、商品カタログと注文履歴が制限なく成長できます。

よくある質問

他のアプリ構築ソリューションよりAdaloを選ぶ理由は？

AdaloはAI搭載のアプリビルダーで、真のネイティブiOSおよびAndroidアプリを作成します。Webラッパーとは異なり、1つのコードベースからApple App StoreとGoogle Play Storeの両方に直接公開します。月額$36から始まり、無制限の使用でBubble（月額$69）より費用対効果が高いです。

Adaloのマーケットプレイスで決済はどのように処理しますか？

Adaloは複数の決済オプションを提供します。最も人気があるのはStripeで、MarketplaceのStripe Paymentコンポーネントを通じて直接連携できます。StripeはカードPayment（クレジット/デビットカード）、Apple Pay、Google Payをサポートしています。マルチベンダーのマーケットプレイスには、セラーへの支払い分配を処理するStripe Connectを検討してください。

マルチベンダーマーケットプレイスを構築できますか？

はい。このガイドでは複数のセラーが商品をリストし、顧客がマーケットプレイス全体で閲覧・購入できるシステムを作成します。各セラーは独自のダッシュボード、商品管理、注文追跡を持ちます。

マーケットプレイスの在庫をどのように管理しますか？

在庫はProductsコレクションのStock Quantityフィールドで追跡されます。購入が完了するたびに、Order CreationアクションでStock Quantityを減少させます。Stock Quantity = 0になったら「Out of Stock」として表示する条件付き表示ルールを設定できます。

Adaloのマーケットプレイスは成長に合わせてスケールできますか？

はい。Adalo 3.0のインフラは月間100万人以上のアクティブユーザーをサポートし、有料プランのデータベースにはレコード制限がありません。商品カタログ、ユーザーベース、注文履歴は人工的な上限なく成長できます。