Base44で作った見積もりアプリをwixと連携してみた

こんにちは、JWPPの大窪です。

今回はBase44で作ったアプリをWixで作ったサイトと連携してみました。

Base44は無料版なので、簡単に作れそうな見積もりのアプリで試しています。

ガッツリと構築したわけではないので、こんな感じで使ってみるのもいいかも程度に紹介します。

今回やりたかった事

非常にシンプルですが、今回はGeminiとBase44だけ使って実装しています。

予め、WixからURLパラメーター経由で見積書を生成できるアプリを作るようにプロンプトを組みます。

プロンプトが適当なのはご了承ください。見積もりアプリを改修した結果が以下。

出来上がったものが以下

不必要な表記は調整せずにそのままですが、とりあえず動くのでヨシ

Base44の相談機能だけでWixへの実装方法まで完結できそうですが、今回Wixへの実装コードの生成はGeminiを使っています。

Base44の相談機能を使って、見積もり生成アプリの実行サンプルを生成してもらいます。

Base44からの回答をそのままGeminiに入力してある程度のWixで実装する際の方法を教えてもらいます。

バックエンドに以下のコードを記述したファイルを用意します。

渡された見積もりデータ(JSON)をエンコードしてURLとパラメーターを組み合わせる処理です。

見積もり生成するメインのページは、以下のようなレイアウトで用意しておきました。

本来ならプルダウンで選択した内容を見積もりのデータに反映させるのですが、今回はサンプルデータを予め用意しています。

ページコードの見積もり作成ボタンのクリックイベントに以下のコードを実装します。

バックエンドにデータを渡す→URL生成→リダイレクト、といった仕組みです。

サンプルのデータはこんな感じです。

これでボタンをクリックすると、URLのパラメーターから見積もりを生成してくれます。

Gemini側に渡す情報が足りなく、アプリ側でデコードできないエンコードを採用していました。

なので、一度Gemini側のエンコード方法に対応したデコード仕様にアプリ側を修正する必要がありました。

ほぼ丸投げでアプリ作成からWixでの実装までできました。

そのまま実装の参考にはならないと思いますが、Base44×Geminiでの構築の流れとして理解の参考になればと思います。