GAS活 #4 「Claspを用いたモダンGAS開発」

by takanakahiko

Slide 1

Slide 1 text

Claspを用いたモダンGAS開発 takanakahiko @ GAS活 #4

Slide 2

Slide 2 text

Instructions あとで公開しますハッシュタグでTwitterにリンクを掲載します．内容は変わるかもしれません．再利用スライドが多いです２回目の人はすみません... 撮影撮影OK! 撮影ダメなスライドでは以下の表示をします. - Cameras allowed - More info at https:/ /speakerdeck.com/takanakahiko - Please Impression to @takanakahiko 2

Slide 3

Slide 3 text

Hello! I am takanakahiko I like Pripara, Drawing and Programming. Graduate Student(Grade M2) at Takushoku Univ. Work at GaiaX Co.Ltd. and Japan Digital Design, Inc. You can ﬁnd me at @takanakahiko 3

Slide 4

Slide 4 text

GASのメリット/デメリット悪いところを知ると，良さを引き出せる 1

Slide 5

Slide 5 text

GASのメリット ◉ G suiteのサービスを扱える ◉ トリガーの選択肢が多い ◉ ブラウザ上で記述できる ◉ 環境カスタマイズの必要がない「手軽な G Suite マクロ環境」という位置づけ 5

Slide 6

Slide 6 text

GASのメリット ◉ G suiteのサービスを扱える ◉ トリガーの選択肢が多い ◉ ブラウザ上で記述できる ◉ 環境カスタマイズの必要がない「手軽な G Suite マクロ環境」という位置づけ 6 注目

Slide 7

Slide 7 text

それは本当にメリット？ ◉ ブラウザ上で記述できる ◉ 環境カスタマイズの必要がない 7 ◉ ブラウザ上でしか記述できない ◉ 環境がカスタマイズできない

Slide 8

Slide 8 text

Google Apps Scriptのデメリットブラウザでしか記述できない ◉ いつものエディタで書きたい...! 環境がカスタマイズできない ◉ 古いタイプのJS -> 拡張性に難 8

Slide 9

Slide 9 text

GASの新しい書き方 GASは”古い技術”じゃない 2

Slide 10

Slide 10 text

Clasp Develop Apps Script projects locally. 10

Slide 11

Slide 11 text

11 Claspとはローカル(オフライン)で書いたコードを GASにPush & Pull できるCLIツール

Slide 12

Slide 12 text

作業の流れ 1. ClaspとGASを連携する 2. 手元でコードを書く 3. ClaspでPushする 4. 実行する 5. エラーがあれば2に戻る ...手間では?(いやそんなことはなく) 12

Slide 13

Slide 13 text

Super Awesome Tools & Utilities Clasp 13 ローカルで書くことで使えるローカルで書けるようにする Claspの有効活用

Slide 14

Slide 14 text

Clasp & [???] Claspは組み合わせで真価を発揮します 3

Slide 15

Slide 15 text

組み合わせられるツール群 ◉ Git : バージョン管理ツール ◉ ES(TS)Lint : ソースコードのチェックツール ◉ VS Code 他(Editor) : 使い慣れたエディタを ◉ TypeScript : 型を扱えるJavaScript And more ... 15

Slide 16

Slide 16 text

TypeScriptを使う利点(ex : VSCode) ◉ 引数をいちいち調べる必要がない ◉ エディタで補完が使えるようになる 16 createAlldayEventメソッドはこういう引数を渡すと ... こういうデータが取得できる

Slide 17

Slide 17 text

Usage 17 $ clasp create ◉ GASプロジェクトを作成 $ clasp push ◉ ソースコードをアップロード

Slide 18

Slide 18 text

DEMO ● $ npx sao clasp でプロジェクト作成 ○ 参考 : https://www.npmjs.com/package/sao-clasp ● $ clasp create --rootDir ./src でGASプロジェクト作成 ● $ clasp push でソースコードのアップロード

Slide 19

Slide 19 text

OSSとしてのGAS GASはよりオープンに 4

Slide 20

Slide 20 text

ClaspはOSSです OSSとは ◉ ソースコードが公開されているソフトウェア ◉ 誰でもContribute(貢献)できますつまり ◉ Claspについて独学が可能 ◉ 機能の提案や議論が可能 20

Slide 21

Slide 21 text

OSS貢献のすすめ ◉ OSSを使う ◉ OSSの開発に参画する 21

Slide 22

Slide 22 text

● Google Apps Script (GAS) の本を書きました -> ● GAS流行れ流行れ.... ● GASが便利になるツールClaspを良くしよう（動機が不純すぎる） 22 きっかけ

Slide 23

Slide 23 text

● https:/ /github.com/google/clasp/issues/57 ● 「対話形式に操作をしたいよね」というIssue 23 はじめてのContribution

Slide 24

Slide 24 text

● 方針が決まっているものを実装しよう! ○ 「こうしよう」「でも手が足りない」というやつ ● タイポの修正をしよう! ● 質問系のIssueに対応しよう! あまり考えなくても(答えが決まってる)，貢献できるやつをやる 24 スタンス

Slide 25

Slide 25 text

● レビューされないとマージされない仕組みがある ○ メンテナが責任持ってレビュー ● 自動でテストする仕組み ○ CIであったりでテストが通らないとマージできない -> (一般的に)PR出すだけでは迷惑にならない 25 ミスして迷惑かけるかも?

Slide 26

Slide 26 text

26 １位 : Googler 2位 : Googler 3位 : ぼく気が付いたら

Slide 27

Slide 27 text

Any questions ? You can ﬁnd me at ● @takanakahiko ● [email protected] Thanks! 27