Retoolは、ドラッグ&ドロップでAWS他と連携するWebアプリを作れるSaaSです(概要まとめ)

Retoolは、ドラッグ&ドロップでAWS他と連携するWebアプリを作れるSaaSです(概要まとめ)

Retoolで管理用Webアプリを爆速で作成しよう!
Clock Icon2021.08.11

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

いろいろなPoCに関わっていると、大きく2種類のWebアプリを作ることが多いです。

  • エンドユーザーが使うWebアプリ
  • サービス提供側が使うWebアプリ(いわゆる管理用)

このうち、管理用のWebアプリは、似たような構成になりがちです。たとえば、IoTの例だと下記です。

  • デバイス管理
    • デバイスの追加、変更、削除
  • データ閲覧
    • 表、グラフ

異なる案件でも似たような画面を1から作るを繰り返すのではなく、「もっと効率良い方法が無いかな?」と考えていました。 このような管理画面を爆速で作成できれば、本来やりたいことに注力できます。

そんなとき、様々なバックエンドと連携し、ドラッグ&ドロップでWeb画面を作れるRetoolと出会いました。 本記事では、Retoolについてまとめてみました。

おすすめの方

  • Retoolについて知りたい方
  • Retoolのドキュメントリンクを知りたい方

Retoolの概要

Retoolをひとことで表現すると、「いろんなデータベースやAPIと接続して、Webアプリをサクッと作れる」です。例えば下記です。

Retoolのサンプルアプリ

Retoolのサンプルアプリ

たくさんのデータソースやAPIと接続できる

たくさんあります。たとえば下記です。

  • データベース連携
    • Athenaa
    • Redshift
    • DynamoDB
    • RDS(MySQL, PostgreSQL, etc)
    • BigQuery
    • Google Sheets
    • Elasticsearch
  • API連携
    • S3
    • CircleCI
    • Daatadog
    • Firebase
    • GitHub
    • GraphQL
    • Slack
    • Zendesk

接続可能な一覧は下記です。

DynamoDBに接続する場合、権限を持ったIAMユーザを発行し、アクセスキーをRetoolに渡す形で接続します。 詳細はドキュメントを参照してください。

アプリのコンポーネントは、58個ある

アプリは、ドラッグ&ドロップでコンポーネントを設置して作成します。そのコンポーネントは、58個あります。

これらのコンポーネントを組み合わせ、バックエンド(データストアやAPI)と統合して、独自のWebアプリを作れます。

テーブル

Retoolのコンポーネント(テーブル)

チャート

下記はデフォルトのグラフですが、見た目もかなり変更できます。

Retoolのコンポーネント(チャート)

送信フォーム

Submitがある送信フォームが作れます。内部にはテキストフィールドなどを別途設置できます。

Retoolのコンポーネント(フォーム)

ほか多数(スイッチ、テキストフィールド、セレクトボックス、etc...)

さまざまなUIコンポーネントがあります。(下記は例)

Retoolのコンポーネント(各種パーツ)

Webアプリのテンプレートが用意されている

いくつかのテンプレートが用意されています。

「これが使いたい!」なテンプレートがあれば採用すれば良いですし、UIコンポーネントの使い方の参考にもなります。

作成したアプリの使い方(公開方法)

まず、Retoolには、クラウド版とオンプレ版があります。

  • クラウド版
    • Retoolのクラウドにアプリがデプロイされる
  • オンプレ版
    • 自身でRetool(とアプリ)をデプロイする

Retoolを使うユーザは、アプリを「エディターモード」と「ユーザモード」の2つで扱えます。

  • エディターモード:アプリを編集できる
  • ユーザモード:アプリを使える

利用するだけのユーザであれば、ユーザモードのアプリで利用するだけです。

初回利用時に組織名(サブドメイン)を登録します。

Retool初回ログイン時の様子

作成したアプリは、下記のように共有できます(一例)。

Retoolのアプリを共有する

なお、ユーザモードに関わらず、利用するRetoolにログインするユーザ数に対して課金されます。

機能一覧

料金ページの「プラン毎の機能比較表」を見れば、「どのような機能があるのか?」が分かりやすいです。

「Git syncing」とかもあります(エンタープライズ)。

さいごに

管理用Webアプリを爆速で作成できれば、本来やりたいことに注力できます。 いろいろ試していきたいと思います。

参考

Share this article

facebook logohatena logotwitter logo

© Classmethod, Inc. All rights reserved.