App Maker 開発スタイルガイド

Slide 1

Slide 1 text

App Maker 開発スタイルガイド 2017/12/21 第一回 App Maker 分科会 1

Slide 2

Slide 2 text

中野達也 (@howdy39) 株式会社 TOPGATE 所属エンジニア App Maker 歴 5ヶ月 G Suite 関連システム開発歴 6年自己紹介 2

Slide 3

Slide 3 text

本日の内容 3 1. Application実行アカウントの選択 2. アプリを肥大化させない 3. Roleで画面を制御 4. 初期データ作成 5. プロパティエディタではなるべくコードを書かない 6. Page：PageのScript は１:１にする 7. ショートカットキー 8. ブラウザで直接表示せずにGoogleサイトに埋め込む 9. 配信前のチェック

Slide 4

Slide 4 text

1.Application実行アカウントの選択 4

Slide 5

Slide 5 text

User's account or Developer's account 5

Slide 6

Slide 6 text

用途・Quotaの消費に応じて使い分ける 6

Slide 7

Slide 7 text

用途 User's account ● ユーザーからメールを送信したい ● ユーザーのカレンダーに予定を登録したい Developer's account ● 開発者からメールを送信したい ● ユーザーに共有していないスプレッドシートのデータを読み書きしたい 7

Slide 8

Slide 8 text

Quotaの消費 ? 8

Slide 9

Slide 9 text

例えば 300通 200通 300通 800通 9

Slide 10

Slide 10 text

メール送信の Quota は 1500受信者/日 10

Slide 11

Slide 11 text

超えると 11

Slide 12

Slide 12 text

その結果ユーザーのQuotaを使い切ってしまうと User's account で動いているものは総て利用不可 12

Slide 13

Slide 13 text

Quota の消費を比較 13 User’s account × Developer’s account

Slide 14

Slide 14 text

User's account 150通 50回操作 100回操作 50/1500 100/1500 14

Slide 15

Slide 15 text

Developer's account 150通 50回操作 100回操作 0/1500 0/1500 150/1500 15

Slide 16

Slide 16 text

Developer’s account の良いところ 16

Slide 17

Slide 17 text

ユーザーの Quotaに依存しない Developer’s account User’s account 17

Slide 18

Slide 18 text

メール送信の他にはどんな制限がある？ 18

Slide 19

Slide 19 text

https://developers.goog le.com/apps-script/guid es/services/quotas 19

Slide 20

Slide 20 text

2.アプリを肥大化させない 20

Slide 21

Slide 21 text

肥大化？ 21 App Maker はグローバルにfunctionを定義していく形 →画面（機能）が増えるほど、大量の function が作成される

Slide 22

Slide 22 text

メンテ不能に 22

Slide 23

Slide 23 text

小さくしましょう例えば・・・申請系のアプリを作りたかったら 1. 勤怠系（遅刻・早退・有給）などで1 アプリにする 2. 1申請ごとに1アプリにする 23

Slide 24

Slide 24 text

アプリ間でデータを共有したいんだけど・・・ 24

Slide 25

Slide 25 text

Cloud SQL 25

Slide 26

Slide 26 text

Spreadsheet 26

Slide 27

Slide 27 text

3.Roleで画面を制御 27

Slide 28

Slide 28 text

初期状態は危険 Page（画面）を作った直後は誰でも見れる状態(Everyone) 28

Slide 29

Slide 29 text

Page名がわからなければ画面を開けないのでは？ 29

Slide 30

Slide 30 text

調べられます 30

Slide 31

Slide 31 text

console オプション URL 末尾に ?console=1をつけることで PREVIEW 実行と同様にPage の切り替えプルダウンが表示される 31

Slide 32

Slide 32 text

どうすればいいの？ →Roleを作る！ 32

Slide 33

Slide 33 text

Role 33 App Maker でユーザー（メールアドレス）ごとに役割を与える機能

Slide 34

Slide 34 text

私がよく使うRoleパターン 34

Slide 35

Slide 35 text

オペレーター（データを登録・変更・削除できる権限のある人） Operators Roleを作成 35

Slide 36

Slide 36 text

権限ごとにページ名の頭を変える 36 誰でも見れるページオペレーターが見れるページ管理者が見れるページ

Slide 37

Slide 37 text

参照権限にRoleを設定 37

Slide 38

Slide 38 text

Admins Roleで隠し画面を作成 38

Slide 39

Slide 39 text

4.初期データ作成 39

Slide 40

Slide 40 text

画面からポチポチ作る？ 40

Slide 41

Slide 41 text

やめましょう 41

Slide 42

Slide 42 text

アプリと同階層にデータを定義したスプレッドシートを作る 42

Slide 43

Slide 43 text

初期データは IMPORT DATA FROM SHEET で入れる 43

Slide 44

Slide 44 text

5.プロパティエディタではなるべくコードを書かない 44

Slide 45

Slide 45 text

SCRIPTSの方に書く 45

Slide 46

Slide 46 text

6.Page：PageのScript は１:１にする 46

Slide 47

Slide 47 text

同じ名前で 1:1 47

Slide 48

Slide 48 text

7.ショートカットキー 48

Slide 49

Slide 49 text

F9 49

Slide 50

Slide 50 text

8.ブラウザで直接表示せずに Googleサイトに埋め込む 50

Slide 51

Slide 51 text

理由その1 51 App Maker のURLは長ったらしいかつアプリ名と関連性がないのでわかりづらい https://script.google.com/a/macros/demo.topgate .co.jp/s/AKfycbyGnywT5qMh22WC6cieFQVttbVZ4 GJvMQ8QiZqxXggSvb2PcvwyKGwBUQ/exec?

Slide 52

Slide 52 text

Googleサイトに埋め込むと 52

Slide 53

Slide 53 text

理由その2 53 何らかの理由で「アプリを作り直したい」となったときにURLを再度周知しなくてすむ

Slide 54

Slide 54 text

9.配信前のチェック 54

Slide 55

Slide 55 text

Production,Staging 環境を用意する 55

Slide 56

Slide 56 text

3つの環境 56 1. Production（本番） 2. Staging（検証） 3. Preview（開発）

Slide 57

Slide 57 text

動作確認はStaging環境で 57

Slide 58

Slide 58 text

Roleごとに動作確認 58 1. 一般ユーザー 2. オペレーター（データを登録・変更・削除できる権限のある人） 3. システム管理者

Slide 59

Slide 59 text

GAを設定 59 Google Analytics は App Maker と Googleサイトの両方に埋め込む

Slide 60

Slide 60 text

最後に 60

Slide 61

Slide 61 text

Qiita の GoogleAppMaker タグをフォロー https://qiita.com/tags/GoogleAppMaker 61