ノーコードツール『Click』初体験①｜タスク共有アプリっぽいものを作ってみる

2021年1月24日 17:54

ずっと気になっていたノーコードツールを初めて使ってみたので、1日目の備忘録を残しておきます。
自分の経歴としてはSIerで行政分野のSEを13年ほどやっていたので、完全に初心者ではないかもしれません。しかし上流工程がメインだったためアプリ開発は未経験。そんな自分でもアプリが作れる、スゴイ時代になったもんだ・・

ノーコード開発プラットフォーム「Click」は、「誰でも簡単に自分のアイディアをアプリケーションとして形にできる」をコンセプトとしたプラットフォームであり、プログラミングの知識がなくても、直感的な操作をもとに、簡単にアプリケーションを開発することができます。

無料アカウントでは以下の事が可能です。
・アプリの作成(５プロジェクトまで)
・データベースの使用（500MBまで）
・アプリのシェア（QRコードを読み取ってアプリを共有する事ができます。

おおお・・これなら自分でも作れそう！！リリースされたばかりの様で、マニュアルとか書籍がなさそうだったので手探りでチャレンジ。

１.アカウント作成

まずは公式サイトからアカウント作成ですが、Gメールアドレスで作れました。（よくある、組織ドメインのメアドでなくてもＯＫでした）

２.新規アプリを作成

最初なので、友達や家族間でタスクを共有しあえる様な、シンプルなタスク共有アプリを作ってみようかな。
　アプリ名：タスク共有

３.開発画面（初期表示）

まさにパワポの様な設計画面。これまでパワポで画面設計を作ってきたので親近感がわきます（笑）とりあえずログインなしのシンプルアプリにしようと思うので、初期表示であったSignUp、SignIn、Ｈome画面は消しておきます。（このやり方が推奨かどうかは不明です）

４.テーブル作成

タスクを貯めていくテーブルを作成。
データベース→テーブルを追加→「タスクテーブル」→項目を追加
　型：テキスト　名前：タスク
　型：日付　名前：期限
　型：テキスト　名前：担当者

５.HOME画面のレイヤー作成

HOME画面は登録されたタスクのリストを表示。ボタンを押してタスク登録画面へ遷移。
　キャンバス→レイヤー→新規ページを作成→名前：HOME
　エレメント→メニュー→トップを追加
　リスト→リストを追加→
　　データ：タスクテーブル
　　タイトル：タスク
　　サブタイトル：期限
　メニュ→ボトムを追加
　　エレメント1番目のタブ：タスク登録画面へ
　　ClickFlow：ページの移動→NewScreen→名前：タスク登録

６.タスク登録画面のレイヤー作成

タスクを登録する画面。もどるボタンでHOME画面に戻る。
　エレメント→メニュ→トップを追加
　データ入力→フォーム
　　フォーム：タスクテーブル
　　項目：タスク（Required（必須））、期限、担当者
　メニュ→ボトムを追加
　　エレメント1番目のタブ：もどる
　　ClickFlow：ページの移動→HOME

７.タスク削除画面のレイヤー作成

登録済のタスクを削除する画面。もどるボタンでHOME画面に戻る。
　Ｈome画面のリスト→ClickFlow：ページの移動→NewScreen→名前：タスク削除
　ボタン→ボタン→タイトル：選択したタスクを削除→ClickFlow→データの削除→Currentタスクテーブル
　メニュ→ボトムを追加
　　エレメント1番目のタブ：もどる
　　ClickFlow：ページの移動→HOME