概要
- wywy(ワイワイ)合同会社でCEO兼エンジニア担当しています。
- GASの開発を複数人でやるようになり、チーム開発が必要になってきたので、GitHubを活用したGAS開発手順をまとめてみました。
- GASの場合、ローカルでの開発とは異なり、クラウド上での開発になるので、Chrome拡張機能でGitを操作する必要があるなど特有のノウハウが必要になります。
- 「Node.jsのclaspを使えばいいじゃん！」って声も聞こえてきそうですが一般向きでは無いので、この記事では割愛します。
方針
-
GitHubフロー（現在、mainブランチが推奨です。masterブランチは非推奨です。）
-
スクリプトファイル名にGitHubリポジトリ名、ブランチ名を含めるように命名規則を決める。
- Apps Scriptサイトを
GitHubリポジトリ名で検索すれば対象のGASスクリプトをすぐに検索できます。また、ブランチ名で、本番用なのか開発用なのか判断ができます。 
- Apps Scriptサイトを
Githubフローとは
GitHub Flowは、GitHub社が実践している開発フローです。
6つのルールだけのとてもシンプルな開発フローで、GASのような小規模開発に最適です。
【ルール1】が最も重要で、それ以外のルールは【ルール1】を実現するために存在します。
- 6つのルール
- 【ルール1】 mainブランチは常にデプロイ可能である
- 【ルール2】 開発用ブランチをmainから作成する（例：add-new-record）
- 【ルール3】 開発用ブランチを定期的にプッシュする
- 【ルール4】 プルリクエストを活用する
- 【ルール5】 プルリクエストが承認されたらmainへマージする
- 【ルール6】 mainへのマージが完了したら直ちにデプロイを行う
＊ 概要をサクッと知りたい方は、この記事がよくまとまっています。
＊ より詳しく知りたい方は、以下原書(日本語翻訳版)を参照してください。
準備
GitHubにリポジトリ作成
- 「そもそもGitHubって何？」ってなった方は、以下の記事がよくまとまっています。記事を参考に、GitHubに入門してみることをオススメします！
- GitHubを活用できるようになると、チームメンバーでソースコードを安全に共有できるようになるので、非常に便利です。
Apps Scriptサイトをブックマーク
Apps Scriptサイトを活用することで、「コンテナバインド型」のスクリプトが簡単に探せるようになります 。
＊コンテナバインド型とは、スプレッドシートから作成できるGASスクリプトファイルのことです。
■ Apps Scriptサイトはこちら
https://script.google.com/home
Google Apps Script GitHub アシスタントのインストール
■ chrome ウェブストア
■ Google Apps Script GitHub アシスタントの使い方
基本的な使い方は、以下、記事がよくまとまっているのでご参照ください。
開発手順
Githubに「order-form」というリポジトリを事前に作成したケースとして解説します。
-
本番用のスプレッドシート、GASスクリプトを自分のGoogleドライブにコピーし、開発用のものを用意する
- スプレッドシートGAS（コンテナバインド型スクリプト）の場合、スプレッドシートをコピーすると、GASも一緒にコピーされます。
- 開発用のブランチ名は、
機能(フィーチャー)がわかるようにすると良いです。例えば、新規レコードを追加できるようする機能の開発であればadd-new-recordなどです。 -
命名規則：ファイル名_ブランチ名- 例：商品マスタ_add-new-record
- ファイル名：商品マスタ、ブランチ名：add-new-record
- 例：商品マスタ_add-new-record
-
GitHubに開発用ブランチを作成する
-
開発用スプレッドシート > 拡張機能 > Apps Scriptから、開発用GASを起動します。 - Google Apps Script GitHub アシスタントを使って開発用ブランチを作成します。
-
開発ブランチ名の例：add-new-record
-
-
開発用GASのプロジェクト名を変更する
-
命名規則：リポジトリ名_ブランチ名- 例：order-form_add-new-record
- リポジトリ名：order-form、ブランチ名：add-new-record
- 例：order-form_add-new-record
-
-
開発して、開発ブランチにコミット＆pushする
- GASスクリプト中のspreadsheetIDなどのプロパティ（設定値）は、開発用と本番用で切り替えられるように実装してください。
- spreadsheetIDとは、
SpreadsheetApp.openById("abc1234567");のabc1234567の部分です。 - 設定値切り替えのコードはこちら => 本番と開発のプロパティ（設定値）の切り替え方法
- spreadsheetIDとは、
- mainブランチにマージで修正があった場合、ローカル環境にgit cloneして、mainブランチの修正を自分の開発ブランチに取り込みます。
- GASスクリプト中のspreadsheetIDなどのプロパティ（設定値）は、開発用と本番用で切り替えられるように実装してください。
-
開発ブランチからmainブランチへのプルリクを作成する
- 修正内容
- 修正理由
- 開発用スプレッドシートURL
- 開発用GASスクリプトURL
チームメンバーにレビュー依頼
-
mainブランチにマージ
- マージする前に
spreadsheetIDなど本番のプロパティ（設定値）が、間違って変更されていないかを必ず確認してください。
- マージする前に
-
本番のスプレッドシートなどにmainブランチ修正を反映する
- Webアプリとして公開している場合は、新バージョンをデプロイします
-
マージ済の開発ブランチに関連するスプレッドシート、GASスクリプトを削除する
- この時に手順1, 3で決めた命名規則が役に立ちます
デプロイ方法
GoogleAppsScriptの場合、デプロイ方法は、Google Apps Script GitHub アシスタントで、mainブランチをGASスクリプトエディタ上でpullする方法となります。
本番と開発のプロパティ（設定値）の切り替え方法
■ 今回決めたGASスクリプト名の命名規則を活用して、本番、開発を判定します。
- 本番：「Gitリポジトリ名」
- 開発：「Gitリポジトリ名_ブランチ名」
＊Gitリポジトリ名もブランチ名も、ケバブケースを前提としたコードになってます
■ GASのProperties Serviceを使います。
Properties Serviceは、GASで共有する値をkey-value形式で保存する機能を提供してくれるクラス群です。
設定値を切り替えるコード
-
main.gsで、properties.gsのinitProperties()を実行して、プロパティを初期化します。-
main.gsは、個別ロジック -
properties.gsは、コピペで使える共通ロジック
-
-
PropertiesService.getUserProperties().getProperty('プロパティ名');と呼び出すことで、設定値を取得することができます。 - セキュアな情報(トークンなど)は、環境ごとのJSONファイルをGoogle Driveに用意。取得するJSONファイルを命名規則によって変更するなどすれば実現できそうです。
/**
* メイン
*/
function main(){
initProperties();
const spreadsheetId = PropertiesService.getUserProperties().getProperty('spreadsheetId');
Logger.log(`spreadsheetId：${spreadsheetId}`);
}
/**
* 開発用プロパティ
*/
const developProperties = {
'spreadsheetId': 'developId',
}
/**
* 本番用プロパティ
*/
const productionProperties = {
'spreadsheetId': 'productionId',
}
/**
* プロパティを初期化します。
*/
function initProperties() {
const id = ScriptApp.getScriptId();
const name = DriveApp.getFileById(id).getName();
const names = name.split('_');
const properties = PropertiesService.getUserProperties();
if (names.length === 1) {
// 本番用
properties.setProperties(productionProperties);
} else {
// 開発用
properties.setProperties(developProperties);
}
}
終わりに
- Google Apps ScriptとGitHubを使ったバージョン管理について解説した記事が少なかったので、弊社の手順を記事にしてみました。
- 複数人でGASを開発する場合、今回のような開発手順をチームで決めて、GitHubを活用することで、随分とチーム開発が楽になると思います。GASでチーム開発している方々の参考なれば嬉しいです(^^
宣伝
■ Udemy
【発売2ヶ月で受講生500人突破】GoogleアカウントとWebブラウザがあれば開発準備OK！これからプログラミングを始める方も取り組みやすいように「40のスキル」を選定。受講後、Googleアプリ連携による業務効率化ができるようになります。
現在、約900人の受講生で、ベストセラーに選定されてます。
■ YouTube
Google Apps Scriptの動画中心のチャンネルです。