見出し画像

AppSheetで爆速ノーコードアプリ開発 その2 - アプリ開発の準備

カカト@ノーコード開発推しです。

AppSheetで爆速ノーコードアプリ開発」と題して、ノーコードアプリ開発ツール 「AppSheet」の基本的な使い方の説明を連載形式で投稿していきますのでよろしくお願いします。

今回は、主に以下の説明となります。

・作成するアプリの説明
・アプリで使うデータの準備
・AppSheetでアプリ作成開始

作成するアプリの説明

AppSheetの基本的な機能を使い、シンプルな「検温履歴管理アプリ」を作っていきます。

一通り完成したものを動画にしました
(画面の下部分が欠けてしまいました。まあ、イメージだけ掴んでください)。

このアプリが持つ機能はざっくり以下の通りです。
※画面項目の日本語化とかしていないため、未デプロイ状態です

・ユーザー毎に日々の検温結果を登録でき、履歴形式で見れます。
・体温と一緒に、調子(三択)を選ぶことができます。
・ユーザー登録ができます(名前、プロフィール写真、平熱)
・履歴は表形式で時系列で、ユーザー毎では折れ線グラフで表示されます。
・ホーム画面では当日の検温結果と、37.5度を超えたユーザーが見れます。


「・・・え、、これだけ?」


と思われた方もいらっしゃると思いますが、ポイントはこのアプリを作るのにかかった時間です。

・構想:5分
・データベース設計:5分(Google Driveへのアップロード含む)
・開発:20分

トータル30分で開発完了。もちろん、コーディング無しです。

もしツールを使わずコーディングして作るとなると、何かしらのテンプレートを用いたとしても30分は厳しいでしょうし、スクラッチ(イチから開発)で作った場合は数日はかかると思います。

まあ、真面目に使うには機能不足感は否めないものの、プロトタイプとして提案するくらいなら十分な気がします。

何より、「構想から実現(実装)まで」のスピード感は、従来の開発スタイルとは比べ物にならないですよね。私がコーディング有りで実装する場合、30分経っても見積終わってないでしょうし。

ということで、前置きが長くなりましたがこの「検温履歴管理アプリ」を題材として、AppSheetを使い作っていきましょう。

アプリで使うデータの準備

AppSheetを使い実装していく前に、アプリが使うデータの準備をします。

今回、アプリで使うデータの管理にはスプレッドシートを使います。

イチから項目を並べるのも面倒と思いますので、あらかじめこちらで作ったものを使ってください。以下よりダウンロードできます。

このファイルにはプロフィールと検温履歴の2シートあり、各シートの列は以下となります。

シート:プロフィール
列名:ユーザー名、プロフィール画像、平熱
シート:検温履歴
列名:ID、ユーザー名、記録日時、体温、調子、備考

データベース的な言葉にすると、シートがテーブル(表)、シート内の列名がテーブルの項目になります。

まずはこのファイルを、ご自身のGoogle Driveにアップロードしてください。アップロード先のフォルダはどこでもOKです。

Google Driveへのアップロード方法がわからない方は、以下の記事が参考になるかと思います。

【初心者向け】Googleドライブの使い方を簡単解説!
http://one-u.jp/gsuite/2019/08/12/google-drive-howto/#index_id1

これでアプリ開発の準備は完了です。

AppSheetでアプリ作成開始

アップロードが終わりましたら、AppSheetの画面を開きます。

以下よりAppSheetにログインします。

続いて、「My Apps」より「Quick Start」をクリックします。

画像10

すると、以下の画面が表示されますので、「Start with your own data」をクリックします。

画像11

なお、ここでは詳しく説明しませんが、他の2つを選択すると以下ができます。

Start with an idea
やりたいことを(決まった形式で)入力すると、AppSheetが自動的にサンプルアプリを作ってくれます。

以下は試しに、「users can manage」と入力し、候補にある「users can manage Schools」を選択してみました。

画像12

すると、AppSheetで自動的に管理項目やUIを作ってくれます。

画像13

あとはこれを手直しするだけでアプリができます。

入力は英語オンリーなのと、できるモノが限られていますが、欲しいものを伝えるだけでアプリができるなんて、近未来感が満載です。

Start with a sample app
サンプルとなるアプリを選び、サンプルをカスタマイズして作ることができます。

今回は、AppSheetの使い方を説明したいため、Start with your own data を選択するようにしてください。

続けて、アプリの名前とカテゴリを入力します。

画像14

なお、App nameですがここでは英数字のみしか入力できないようですので(後でアプリの設定画面で変更可能)、ここでは以下で入力・選択してください。

App name: kennon app
Category: Personal/Fun

終わりましたら、画面にある「Choose your data」をクリックします。

すると、Google Driveよりファイルを選択する画面が開きますので、先ほどアップロードした「検温記録.xlsx」を選択し、画面下にある「Select」ボタンを押します。

画像15

すると、以下の画面が表示されますので、少し待ちます。

画像16

アプリの初期設定が終わると、AppSheetのエディタ画面が表示されます。

画像17

これで開発がスタートできますが、長くなってきたので今回はここまでとします。

次回予告
次回の投稿は以下の内容を予定しています。

・プロフィールのData設定
・検温履歴のData設定

この記事が気に入ったらサポートをしてみませんか?