20191112GAS活#5「ノンプログラマーのためのはじめてのApp Maker」

Copyright © Plannauts,Inc.  
【エンジニア交流会】 
Google Apps Script活用ミートアップ #5 
 
ノンプログラマーのための 
はじめての App Maker 
 
株式会社プランノーツ高橋宣成 
1

Copyright © Plannauts,Inc.   2
「#GAS活」皆勤賞！

Copyright © Plannauts,Inc.  Copyright © Plannauts,Inc.  
■高橋宣成(タカハシノリアキ)
 
・1976年5月5日生まれ 
・東京都板橋区在住 
・株式会社プランノーツ代表 
・ひとり社長で研修・執筆・開発とか 
 
　@ntakahashi0505
 
　noriaki.takahashi.923
 
　n_takahashi0505
自己紹介
3

ミッション 
- Office・VBA 
- G Suite・Google Apps Script 
- Python 
“日本の『働く』の価値を上げる“ 
⇒ノンプログラマーへのIT支援・プログラミング教育

ブログ
いつも隣にITのお仕事 
■ 103万PV/月 
■ カテゴリ 
- Excel・VBA
- G Suite・GAS
- Python
- IT・働き方 
5

書籍執筆 
5刷…12,000部突破！
ExcelVBAを実務で
使い倒す技術
祝・5刷…
7,900部！
パーフェクトExcelVBA（仮）
詳解！GoogleAppsScript
完全入門
11/25発売予定！
ノンプログラマーが動かして覚える
入門Python仕事術（仮）
執筆開始！

コミュニティ
ノンプログラマーのための 
スキルアップ研究会 
～プログラミングを中心としたスキルを身に
着け続ける研究をするための場 
 
■メンバー数96名 
■コンテンツ 
　- 月１回の定例会 
　- 月２回以上の勉強会 
　- プログラミング講座 
　- オンラインサポート 
　- 未発表書籍・記事の共有 
　- 執筆・登壇・実務等の機会の提供 
7

今日はApp Makerの話

1. App Makerとは
2. デモ
3. 補足情報と参考情報

App Makerとは 
G Suiteのローコードアプリ開発環境

App Makerの特徴 
● ドラッグ＆ドロップ＋ポチポチでアプリ開発
● G Suiteと簡単に連携できる
● 追加費用なしで使える（※）

App Makeで作れるアプリ 
● スタッフ管理
● 顧客管理
● 備品管理
● ワークフロー（稟議・出張）
● Q&Aフォーラム
● ギャラリー
Googleの20%プロジェクトから生まれたサービス

ただし… 
 
※G Suite Business以上 
※ドメイン外に公開不可 
（ロードマップとしては公開予定あり） 
↓ 
社内アプリケーション専用

GASによる社内ツール開発で悩ましいこと 
1. スプレッドシート自由すぎる問題
2. スマホ・タブレットで使いたい問題

よし、Webアプリケーションだ！

GASによるWebアプリ開発 
モデル
スプレッドシート操作
ビュー
HTML＋CSS
コントローラー
入力・制御
ビジネスロジック

GASによるWebアプリ開発 
機能何をどうする
モデル  ● スプレッドシートの読み書きはコードを書く 
ビュー  ● HTML＋CSSでコードベタ打ち 
● 画面更新はコードを書く 
コントローラー  ● ビジネスロジック 
● G Suite連携 
● リクエスト処理・イベント処理・その他

フロントの技術かなり必要 
コーディング＆デバッグがかなり辛い

そこで、App Maker

App MakerによるWebアプリ開発 
機能何をどうする
モデル  ● 「DATA」を使用 
ビュー  ● 「PAGES」にウィジェットを配置 
コントローラー  ● 「SCRIPTS」を書く 
○ ビジネスロジック 
○ G Suite連携 
○ その他

App MakerによるWebアプリ開発 
モデル
「DATA」
ビュー
「PAGES」
コントローラー
「SCRIPTS」

DATA 
● Cloud SQL
○ デフォルト／カスタム
○ テストなら月1000円くらい
● Directory
○ G Suiteアカウント一覧
● Calculatedほか
○ 計算モデル
アプリのデータ構造を定義

PAGES 
● Page
○ いわゆるページ
● Page Fragment
○ 再利用するUI部品
（ヘッダー・フッターなど）
● Popup
○ ポップアップ・ナビゲーションな
ど
ウィジェットを配置するしてページを作る

SCRIPTS 
● Client
○ ブラウザ側JS
○ UIとやり取り
● Server
○ サーバー側GAS
○ G Suiteと連携
GAS・JSでアプリをカスタマイズ

デモ 
1. アプリ作成
a. Cloud SQLモデル
b. ページ＆UI
2. ログインユーザー取得
a. Directoryモデル
b. ヘッダー修正

App Make補足情報 
● App Makerに適したアプリ
○ １つのソリューション＆小さなアプリ
○ １～２人の開発者で作成できる
https://developers.google.com/appmaker/getting-started/design-best-practices?hl=ja
● doGet／doPostは使えない
● トリガーはScriptApp.newTrigger(function)で設置

● 公式ドキュメント 
https://developers.google.com/appmaker/ 
● いつも隣にITのお仕事 App Makerマニュアル 
https://tonari-it.com/app-maker-manual/ 
● チュートリアル 
https://developers.google.com/appmaker/tutorials 
● サンプル 
https://developers.google.com/appmaker/samples
※「テンプレート」は沼なので「Starter App」以外は取り扱い注意
27
App Makerの参考情報

ぜひ活用してみてください！

 
ご清聴ありがとうございました 
 
29

20191112GAS活#5「ノンプログラマーのためのはじめてのApp Maker」

Recommandé

Recommandé

Contenu connexe

Dernier

Dernier (9)

En vedette

En vedette (20)

20191112GAS活#5「ノンプログラマーのためのはじめてのApp Maker」