ノーコード情報満載!

  1. ノーコード
  2. 21 view

Table2Siteの使い方を日本語で解説!基本操作の流れをマスター

Table2siteは、Airtableの データベース からWeb開発できる点が特徴的なノーコード開発ツールです。こちらでは、Table2siteの基本的な操作についてご紹介します。

Table2siteのアカウント作成

table2siteのトップページ
画像:table2site.com

Table2siteのアカウントを作成するためには、「Register」のページから情報を入力し、送信します。「Resister」のページは、サービスページトップ下部に表示されている「Getting started」から移動可能です。

なお、Table2siteはクラウド型 データベース 「Airtable」を使用するノーコード開発ツールのため、こちらの登録も求められます。こちらも公式ページからサインアップしてください。Googleのアカウントを持っていると、簡単にサインアップできます。

Table2siteとAirtableを連携させる際には、AirtableのAPIキーが必要です。APIキーは、Airtableの「Acoount」ページの「Generate API key」で取得できます。Table2siteの「Register」にはAPIキーの欄がありますので忘れずに入力しましょう。

Table2siteのプラン

Table2siteは月額10ドル、月額19ドルの2つのプランで展開されています。2021年5月現在はPricingのページに「We’re currently invite-only. Sorry :(.」と記載されており、新規のアカウント作成はできない可能性がありますので確認してください。なお、無料のプランは提供されていないようです。

主に操作するのはAirtable

Table2siteはAirtableの情報をもとに Webサイト を開発するノーコードツールです。開発の際には、Airtableの画面を見ながら作業していくことになります。

表示形式はカレンダー形式、カンバン形式などから自由に選択できます。多くの方にとって馴染みがあるのは、Excelのような表形式かもしれません。Excelを日常的に使っている方であれば、違和感なく操作できるはずです。

近年は Googleスプレッドシート からWebサイトを開発できるツールも少なくありません。このことから、Table2siteはこうしたツールと比較されることもあります。AirtableはExcelやGoogleスプレッドシートと比較して、入力ルールの設定、リレーション機能の設定など、より高度なソフトであるという評価が多いようです。

Table2siteでのWebサイト開発    

Table2siteで実際に Webサイト を開発する際の手順をご紹介します。

テンプレートのコピー

アカウント情報を入力しTable2siteにログインすると、ダッシュボードが表示されます。「Create a site」をクリックすると、新規サイトを作るための画面に遷移します。

続いて、表示される画面では、開発するWebサイトの種類を選択可能です。ゼロからサイトを構築していく「Empty project」、リスト形式の「“List of X” website」、一般的な ランディングページ 「Landing page」の3種から選択できます。こちらでは、ランディングページの開発についてご紹介します。

Table2siteはテンプレートをカスタマイズして希望のWebサイトを構築するツールです。任意のテンプレートを選択し、「Copy base」をクリックします。テンプレートの情報が表示されるため、さらに右上の「Copy base」をクリックしてください。

続いて表示される画面では、Airtableにテンプレートをコピーします。「add base」のクリックでコピー可能です。

固有IDの取得

テンプレートをTable2siteで使用するためには固有IDが必要です。

「Airtable API」のページにアクセスし、テンプレートを選択してください。その後に表示されるページのURLの「https://airtable.com」のスラッシュからスラッシュまでの文字列が固有IDです。固有IDをコピーし、Table2siteにペーストします。

「slub」の部分では、公開する Webサイト URLの変更が可能です。「Add site」をクリックすると、Webサイトが公開されます。情報の移行や、 データベース を変更した内容はWebサイトにリアルタイムで反映されます。

Webサイトのカスタマイズ

Webサイト に変更を加えたい場合は、Airtableでデータベースに変更を加えます。

ダッシュボードの「Base」に表示されているIDをクリックするとAirtableのデータベースに遷移するため、そちらで編集が可能です。

データベースのそれぞれの行は、Webサイトのコンテンツの内容を意味しています。テキストを変更する、新規にデータを作成する、といった方法でWebサイトに変更を加えていきます。

まとめ

Table2siteの基本的な操作についてご紹介しました。Table2siteは、Airtableの高度な拡張性を活かした幅広いWeb開発ができるツールです。それだけに、活用するにはハードルが高いといえますが、ノーコードでも複雑な開発をしたい場合はぜひ挑戦してみてください。

ノーコードの最近記事

  1. Autifyの概要からテスト自動化への導入事例までを徹底解説

  2. Platioはノーコードで作成できる便利な業務アプリ!機能や特徴を解説

  3. UNIFINITYで業務効率アップ!使い方とメリットやデメリット

  4. WebアプリとWebシステムの開発に役立つ!FastAPPの概要

  5. STORESの使い方を解説!初心者でも分かる基本や応用のまとめ

関連記事

PAGE TOP