App Maker 開発スタイルガイド

Transcript

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

   View Slide

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

   View Slide

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

   View Slide

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

   View Slide

5. User's account
   or
   Developer's account
   5
   

   View Slide

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

   View Slide

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

   View Slide

8. Quotaの消費 ?
   8
   

   View Slide

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

   View Slide

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

    View Slide

11. 超えると
    11
    

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

16. Developer’s account の良いところ
    16
    

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

22. メンテ不能に
    22
    

    View Slide

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

    View Slide

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

    View Slide

25. Cloud SQL
    25
    

    View Slide

26. Spreadsheet
    26
    

    View Slide

27. 3.Roleで画面を制御
    27
    

    View Slide

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

    View Slide

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

    View Slide

30. 調べられます
    30
    

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

37. 参照権限にRoleを設定
    37
    

    View Slide

38. Admins Roleで
    隠し画面を作成
    38
    

    View Slide

39. 4.初期データ作成
    39
    

    View Slide

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

    View Slide

41. やめましょう
    41
    

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

45. SCRIPTSの方に書く
    45
    

    View Slide

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

    View Slide

47. 同じ名前で
    1:1
    47
    

    View Slide

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

    View Slide

49. F9
    49
    

    View Slide

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

    View Slide

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

    View Slide

52. Googleサイトに
    埋め込むと
    52
    

    View Slide

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

    View Slide

54. 9.配信前のチェック
    54
    

    View Slide

55. Production,Staging
    環境を用意する
    55
    

    View Slide

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

    View Slide

57. 動作確認はStaging環境で
    57
    

    View Slide

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

    View Slide

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

    View Slide

60. 最後に
    60
    

    View Slide

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

    View Slide