ローコードツールのappsmith を使って、HubDB のデータと連携したアプリを作る

こんにちは！プロダクトスペシャリストの菅原です。

appsmith は、社内ツールの作成に特化したオープンソースのローコードツールです。ドラッグアンドドロップや簡単なコーディングを組み合わせてアプリを作成できます。さらにCData Connect Server と組み合わせることで、HubDB を含む150種類以上のデータソースをアプリに統合できます。

HubDB のデータの仮想データベースを作成する

CData Connect Server は、シンプルなポイントアンドクリックインターフェースを使用してデータソースに接続し、データを取得します。まずは、右側のサイドバーのリンクからConnect Server をインストールしてください。

1. Connect Server にログインし、「CONNECTIONS」をクリックします。
2. 一覧から「HubDB」を選択します。
3. HubDB に接続するために必要な認証プロパティを入力します。

   HubDBデータソースへの接続には、パブリックHubSpotアプリケーションを使用したOAuth認証とプライベートアプリケーショントークンを使用した認証の2つの方法があります。

   カスタムOAuthアプリを使用する

   すべてのOAuthフローでAuthSchemeを"OAuth"に設定する必要があります。特定の認証ニーズ（デスクトップアプリケーション、Webアプリケーション、ヘッドレスマシン）に必要な接続プロパティについては、ヘルプドキュメントを確認してください。

   アプリケーションを登録し、OAuthクライアント認証情報を取得するには、以下の手順を実行してください。

   1. HubSpotアプリ開発者アカウントにログインします。
      • アプリ開発者アカウントである必要があります。標準のHubSpotアカウントではパブリックアプリを作成できません。
   2. 開発者アカウントのホームページで、アプリタブをクリックします。
   3. アプリを作成をクリックします。
   4. アプリ情報タブで、ユーザーが接続する際に表示される値を入力し、必要に応じて変更します。これらの値には、パブリックアプリケーション名、アプリケーションロゴ、アプリケーションの説明が含まれます。
   5. 認証タブで、「リダイレクトURL」ボックスにコールバックURLを入力します。
      • デスクトップアプリケーションを作成する場合は、http://localhost:33333のようなローカルにアクセス可能なURLに設定します。
      • Webアプリケーションを作成する場合は、ユーザーがアプリケーションを承認した際にリダイレクトされる信頼できるURLに設定します。
   6. アプリを作成をクリックします。HubSpotがアプリケーションとそれに関連する認証情報を生成します。
   7. 認証タブで、クライアントIDとクライアントシークレットを確認します。これらは後でドライバーを設定する際に使用します。

   8. スコープの下で、アプリケーションの意図する機能に必要なスコープを選択します。

      テーブルにアクセスするには、最低限以下のスコープが必要です：

      • hubdb
      • oauth
      • crm.objects.owners.read
   9. 変更を保存をクリックします。
   10. 統合に必要な機能にアクセスできる本番ポータルにアプリケーションをインストールします。
       • 「インストールURL（OAuth）」の下で、完全なURLをコピーをクリックして、アプリケーションのインストールURLをコピーします。
       • コピーしたリンクをブラウザで開きます。アプリケーションをインストールする標準アカウントを選択します。
       • アプリを接続をクリックします。結果のタブは閉じて構いません。

   プライベートアプリを使用する

   HubSpotプライベートアプリケーショントークンを使用して接続するには、AuthSchemeプロパティを"PrivateApp"に設定します。

   以下の手順に従ってプライベートアプリケーショントークンを生成できます：

   1. HubDBアカウントで、メインナビゲーションバーの設定アイコン（歯車）をクリックします。
   2. 左サイドバーメニューで、統合 > プライベートアプリに移動します。
   3. プライベートアプリを作成をクリックします。
   4. 基本情報タブで、アプリケーションの詳細（名前、ロゴ、説明）を設定します。
   5. スコープタブで、プライベートアプリケーションがアクセスできるようにしたい各スコープに対して読み取りまたは書き込みを選択します。
   6. テーブルにアクセスするには、最低限hubdbとcrm.objects.owners.readが必要です。
   7. アプリケーションの設定が完了したら、右上のアプリを作成をクリックします。
   8. アプリケーションのアクセストークンに関する情報を確認し、作成を続行をクリックし、その後トークンを表示をクリックします。
   9. コピーをクリックして、プライベートアプリケーショントークンをコピーします。

   接続するには、PrivateAppTokenを取得したプライベートアプリケーショントークンに設定します。

4. 「 Test Connection」をクリックします。
5. 「Permission」->「 Add」とクリックし、適切な権限を持つ新しいユーザー(または既存のユーザー) を追加します。

仮想データベースが作成されたら、appsmith を含むお好みのクライアントからHubDB に接続できるようになります。

接続の設定が完了したら、appsmith からHubDB のデータに接続できるようになります。

appsmith でのデータソース設定

それではappsmith の画面で、CData Connect Server の接続設定をしていきましょう。

1. 画面の左側にある「Datasources」の「+」をクリックします。
2. appsmith から接続できるデータソースが表示されるので、「Microsoft SQL Server」を選択します。
3. CData Connect Server のTDS エンドポイント、接続ユーザー、パスワードを設定して、「TEST」をクリックして接続確認を行います。正常に接続できたら「SAVE」をクリックして保存します。
• Host Address：CONNECT_SERVER_URL
• Port：1433
• Database Name：Connect Servere で設定したデータソース名（Salesforce1 など）
• Username：Connect Server のユーザー名
• Password：Connect Server のパスワード

appsmith でのクエリ実行

以上でデータソースへの接続設定が完了しました。次に、SQL クエリを追加して実際にデータソースからデータを取得してみましょう。

1. 作成したデータソースの画面で、「NEW QUERY」をクリックします。
2. 今回はデータを取得したいので、「SELECT」を選択します。
3. SQL を指定する際には、CData Connect Server の機能である「Data Explorer」を使用することで、事前に取得したいデータを確認できます。必要に応じて利用してみてください。
4. 発行するクエリを作成したら、appsmith 画面に戻り、クエリを入力して「RUN」をクリックします。
5. 無事にデータが取得できたら、あとはデータを使用したい「Page」に取得した「Table」を表示させるよう設定します。
6. これで、appsmith からCData Connect Server と連携して、HubDB のデータを取得することができました！いつも利用している業務データを使って、簡単にアプリが作れちゃいますね。

おわりに

この記事ではローコードツールのappsmith からCData Connect Server に接続して、HubDB のデータを取得しました。CData Connect Server では、HubDB 以外の150種類以上のデータソースに同様の方法で連携可能です。30日間無償トライアル を利用して、appsmith からSaaS、ビッグデータ、NoSQL データソースへのSQL アクセスをお試しください！