メタラーまとんがハイソにやらかすようです

東大理系修士卒JTBCエンジニアのハイソサイエティ(上流階級)な日常

【Amazon Honeycode】使ってみた!買うものリスト共有アプリを作ってみた!使い方/感想/操作/テンプレ

ども!AWS認定ソリューションアーキテクトアソシエイトのまとんです。

先日リリースされたばかりの「プログラミングレスでアプリが作れる」Amazon Honeycodeを使ってみました!

Amazon Honeycodeとは?


最近話題の「ノンプログラミング」系のソリューションです。

アプリを作るプログラミングスキルが無くても、スマホとウェブアプリを作れるよ、というサービスです。

みなさん誰でも、スプレッドシート(いわゆるExcel)は慣れているでしょう、ということで、ExcelのVLOOKUPなどを使えるレベルの人ならアプリ作成がでできる、といった難易度でした。

とはいえ、どんなアプリでも作れるわけではありません。

Honeycodeで作れるものイメージとしては、「みんなで情報共有するエクセルシートを、直接excelを開いて編集するのではなくて、独自開発したアプリで操作できるようになる」感じです。

テンプレートとしては、タスク管理、アンケート、進捗管理などのアプリが用意されており、すぐに使い始めることができます。

共有するメンバーが20人までなら無料で、その後は人数が増えたり、スプレッドシートの行が2500行を越すと課金対象になります。

リリースされたばかりでまだベータ版ですが、興味があったので触ってみました!

作ってみたもの

夫婦間で「買うものリスト」を共有するアプリを作ってみました!

夫婦間で買うものリストを共有できるアプリ

我が家は節約のため、「牛乳はスーパーが安い。卵はドラッグストアが安い。海苔は100均が安い」など、近所の最安値情報を蓄積しています。

これを加味して、「今牛乳が無いから、スーパーで牛乳買ってきて!」といった買うものリストを、夫婦間で共有するアプリです。

ページ構成

f:id:highso:20200628040741p:image

メインページ。

スーパー・ドラッグストア・100均で買ってほしいものと、値段がリスト表示されます。

購入ボタンを押すとリストから消えます。

表示フォーマットが通貨は$しか対応していないので、円だと少しデザインが崩れます。

f:id:highso:20200628040553p:image

買うものを登録するページ。

事前に登録した商品と値段のリストが表示されていて、買うべきお店の値段をタップすると青くなって、買うものリストに表示されます。

この「タップしたら青くなる」の実装がかなり大変でした。Javascriptが使えないので、タップ時にページデザインを変更することができません。

スプレッドシート経由で、「買うフラグ」が立っているときに青色ボタンをVisualize=Trueで表示し、逆ではFalseで非表示にする、という実装で実現しました。

f:id:highso:20200628040542p:image

新しい商品を登録するページ。

ドロップダウンリストが使えないので、登録ボタンを3種類用意するという苦肉の策で解決しました。

使えるフォームの種類がまだ少ないです。

f:id:highso:20200628040549p:image

商品価格の編集ページ。

データベースを介するアプリは、「新規登録・編集・削除」ができるとアプリ上で操作が管轄するので、とりあえずこれで一通りの機能は作れました。

HTMLのようにGETやPOSTが使えないので、遷移前のページから値を引き継ぐ処理が難しくて苦労しました。いまだによく理科できていませんが、とりあえず動いた。

 

作成所要時間

ここまで、所要時間は5時間ほどでした。

  • Honeycodeについて紹介記事読むのに20分
  • メンバー追加して、スマホ上からアプリを見れるようにするのに40分
  • テンプレートアプリを読み解きながらスプレッドシートを用意するのに1時間
  • 各画面を作るのに3時間

共有方法はいまいち

専用アカウントと専用スマホアプリ必要

Amazon HoneycodeはAWS外?のサービスのため、専用のアカウントを作る必要があります。

自分のアプリは自分のTeamに属することになり、別の人のHoneycodeアカウントを自分のTeamに招待することができます。(管理者かコントリビューターを選択)

スマホで開く場合は、専用のHoneycode readerアプリをインストールして、ログインすると、作成したアプリをスマホから操作できるようになります。

 

まとめると、使ったアプリを共有するためには、

  • みんなにHoneycodeのアカウントを作ってもらう
  • スマホで使うなら)みんなにHoneycodeのスマホアプリをインストールしてもらう

必要があります。

ここは少し、残念でした。

ネイティブアプリが作れるわけではない

スマホネイティブアプリを作ってAppStoreで配布できるのかと期待していたのですが、そうではないようです。

これだと「開発者の間で共有する」といった雰囲気で、「アプリを使うだけの人に共有する」といった感じでは無いです。

ここらへん、まだベータ版なので、使い勝手の向上に期待します!

詳細な使い方

すみません、夜22時から作り始めて現在朝の4時、さすがに眠くて詳細はまた今度書きます・・・。

 

VLOOKUPの代わりのFindrow

クセが強いところは、VLOOKUP関数の代わりになると謳っているFindrow関数の使い方です。

テーブルと条件を指定すると、条件に適する行を抽出してくれるのですが、列の指定が難しい。

列名を動的に操作したいが、やり方が良くわからなかった。

返り値が「行番号」というのが独特で、Findrow()[列名]で座標を指定できます。

基本文法が慣れない

そもそも座標の指定方法が難しくて、エクセルの「A3」=「行番号+列番号」のようにシンプルに指定したいが、そうはさせてくれない。

基本文法はTable名[列名]で、「あれ?行はどうやって指定する?」のように、基本文法からして慣れるまで大変でした(まだ完全には理解できてない)

条件二重が難しい

全体的に条件(condition)を二重にするのが難しく、基本的にはできないようです。

唯一うまくいったのは、if(条件, True, False)をネストするやり方で、

If(第一条件, if(第二条件, Ttue, False), False)で二重条件を表現できる。

ただ、これだとBooleanしか返せず、「二つの条件に適する行を抽出する」のような処理ができなかった。

Findrowをうまく使えばできるのかもしれないが、力尽きました。Pythonのpandasの.loc[]のように、色々条件つけるのが難しい。

動的なデザインは作れない

ページ構成の自由度としては、HTMLの<a>タグのように至る所にActionを付与することができるのは良好。好きなところをタップ領域にできる。

ただ、Actionでできるのが、スプレッドシートの操作(追加・更新・削除)と、ページ遷移のみなので、動的なデザインは表現できない。

ページ遷移時にGETのように、データを1レコードだけ$[InputRow]に載せて遷移先ページのローカル引数に引き継ぐことができるが、この取り扱いがめっちゃ難しい。

editページを作るためには必須の機能なので、試行錯誤して、なんとか形になった。

デザインは初心者に優しい

デザインについては、長方形のパーツしかないので、全体的に角張ったテイストになります。

マウス操作でパーツを動かせるため、PadingやMarginなどのCSS的な処理はフルマネージドでやってくれて簡単です

ヘッダーやフッターのGlobal Navigaterは標準機能で用意されているため、僕のような素人が作っても最低限の体裁は整うようになっています。

デフォルトではwebとスマホのレスポンシデザインになっており、特に止める必要もないのでそのままにしました。

他に気になったこと

データの反映が少し遅い

スプレッドシートを書き換えるアクションをしてから、すぐに他のページに遷移すると、高確率で変更が反映されていません。

おそらくREST APIのようにレスポンスを受け取る処理がされているわけではないようです。トランザクションのACID性が担保されていない感じ。

その分、アクション実行時のロード時間(クルクル待機)は無いようです。

デプロイが早すぎ、リアルタイムすぎ

アプリを一旦デプロイすると、すべての変更がリアルタイムに本番環境に反映されてしまいます。

つまり、テスト機能が無いように思います。

開発中はバグでページが動かなくなるので、完成したら一括デプロイ、という風にやりたいと思った。

アプリの起動に時間かかる

Honeycode Readerアプリを起動するのに5〜10秒ほど、作ったアプリを選択して開くのに3秒ほどかかります。

スマホアプリは起動にかかる秒数で売り上げが決まるとも言われていますが、日常使いするアプリを作るとしたらちょっと遅いなぁと感じました。

AWSの他機能と連携するのか?

ドキュメントを全て読んだわけでは無いのですが、どこかにHoneycode SDKがあると書いてあったので、連携できるのだと思う。

個人的にはLambdaと連携して欲しいです。

以前に自分で作った投資アプリは、ビジネスロジックをLambdaで実装し、インターフェースはLINE botを使っていました。

Honeycodeアプリをインターフェースにすれば、アプリとしての完成度がグンと上がりそうです。

 

以上、色々触ってみた感想でした。

細かいところで気になる点があれば、分かる範囲でお答えするのでコメントください!

 

以上、メタラーまとんでした。

ではでは。