[gusuku] 基本機能を紹介してみる（前編）


# はじめに
kintoneでアプリを開発している人向けに[gusuku](https://gusuku.io/)の基本的な機能について紹介してみようと思います。ぼえーん。
![gusuku_logo.jpg](https://qiita-image-store.s3.amazonaws.com/0/133500/3a0f4bec-1475-e349-43c0-cd88056ea91b.jpeg "gusuku_logo.jpg")


# そもそもgusukuって？
簡単に言えば
kintoneによるアプリ開発をサポートするサービス
![gusuku-img.png](https://qiita-image-store.s3.amazonaws.com/0/73604/e0febce9-dc10-083f-bba6-a21f72d1246d.png "gusuku-img.png")


ちなみにバックエンドは **AWS** で構築されています。
アーキテクチャは<small>~~今後どこかで発表してくれる人がいるかもしれない~~</small>ので期待ageで(˘ω˘)

## gusukuの機能について
大きくわけて以下のような機能にわかれます。

* 基本機能
	- バージョン管理+アプリ配布機能
	- 添付ファイル保存プラグイン（kintoneプラグイン）
* オプション機能 
    - Excel帳票プラグイン（kintoneプラグイン）
    - バックアップ・リストア機能

# 主な利用シーン
kintoneでアプリを開発している時 **あるある。**

1. 間違ってフィールド削除 → 中のデータ消えた → 俺＼(^o^)／死亡
2. アプリの変更する時に、テストアプリで変更して、本番アプリでも同じ変更とかめんどくさくね？
3. JavaScriptでカスタマイズしたいけどフィールドコードってなにそれおいしいｎ（

…とまぁそんな感じで不便な点が出てくることもわりとあると思います。

kintoneだけだとちょっとひと手間がかかったり、実現が難しかったりする部分をサポートしてたりします。

今回は基本となる **バージョン管理** を見ていこうと思います。


# gusukuのはじめ方
gusukuはkintoneと同じように、 **ブラウザからログインして利用** します。
![gusuku_op_mini.png](https://qiita-image-store.s3.amazonaws.com/0/73604/338debd2-a831-6c1a-87fc-e9016731ca95.png "gusuku_op_mini.png")

専用の画面があり、その上でkintoneのアプリを操作していきます。
kintoneアプリ開発のお助けサービスであるため、kintoneとセットで利用します。
<b><font color="FF0000">※gusuku単独では利用できないので注意</font></b>

# gusukuアカウントの作成
まずはアカウントを取得して画面からログインを行います。

ログイン方法は2パターンあります。

* Facebook/googleアカウント等外部サービスの認証情報を利用したログイン
* gusuku専用のアカウントを利用したログイン（新規作成）


# gusukuでkintoneアプリを管理する（バージョン管理）
## kintoneのアプリをgusukuに登録する
### プロジェクトの作成
ログインすると、プロジェクト一覧というポータル画面が出てくるので、この画面上から **「プロジェクト」** を作成します。
ログインしてプロジェクトがまったく存在していない場合、チュートリアルで以下のようなポップアップが出るので、それに従えばOK。
![gusuku1.png](https://qiita-image-store.s3.amazonaws.com/0/73604/bdec2a5f-4626-aade-f7e3-b47972941b89.png "gusuku1.png")


### 環境の作成
プロジェクト作成後に、環境を追加します。
![gusuku4.png](https://qiita-image-store.s3.amazonaws.com/0/73604/afec0dc2-3b21-cda7-8935-3cc613ba75c4.png "gusuku4.png")


gusukuの環境追加画面では、登録したいkintoneアプリのスペース・スレッド情報が必要になります。
kintoneアプリのURLをチェックしてメモしておきます。
![gusuku5.png](https://qiita-image-store.s3.amazonaws.com/0/73604/1c7a41c0-207e-e596-088d-a02b7bb481b2.png "gusuku5.png")


* サブドメイン情報<b><font color="#FF0000">（■印の部分）</font></b>
* スペース情報（URLの<b><font color="#0000FF">「#/space/★」の★部分。</font></b>この画面上では<b><font color="#FF0000">「3」</font></b>）
* スレッド情報（URLの<b><font color="#0000FF">「/thread/☆」の☆部分。</font></b>この画面上では<b><font color="#FF0000">「3」</font></b>）

メモした情報を環境追加画面で設定します。
![gusuku19.png](https://qiita-image-store.s3.amazonaws.com/0/73604/a5e7b9e0-e345-44fb-7825-a33c89f130c5.png "gusuku19.png")

#### プロジェクト名について
実際の開発現場で利用することを想定すると<b><font color="0000FF">「案件名」とか「プロジェクト名」</font></b>を登録するのが一般的だけど、kintoneのユーザーさんで、そもそもプロジェクトとか無縁だよって人も多いと思います。

##### kintoneのユーザーはプロジェクト名どうすんの？
ってことなんですが、これはわりと少ない脳みそで俺考えたんだよ…
<b><font color="0000FF">アプリのカテゴリ・種類（営業支援系、顧客管理用など）</font></b>みたいな感じで、<b><font color="FF0000">目的別</font></b>に登録したらきっとみんな幸せになれるよ！

#### 環境名について
##### 開発者のひと
通常のシステム開発で「開発環境」「本番環境」と環境を分けて開発されているケースが多いと思うので、現場のルールに沿った形で登録したらOK。
![kintone_developer.png](https://qiita-image-store.s3.amazonaws.com/0/73604/c1a43f8a-ab4a-28f2-624a-f4549e79e733.png "kintone_developer.png")

##### ユーザーさん
そもそも **「開発環境」「本番環境」** なんて環境わけてねーよって人多いですよね。
<small>（わたしが聞いた人もそういう人が大半だったよ</small>

じゃあどう考えたらいいかなーって思ったんですが、<b><font color="FF0000">kintone上のスペース名 = gusukuの環境名</font></b>のように考えたらいいんじゃないかな！
![kintone_user.png](https://qiita-image-store.s3.amazonaws.com/0/73604/36ad25ae-0e54-09d3-5139-4685d5915b95.png "kintone_user.png")

### （補足）gusukuの環境管理
<b>※次回<font color="#FF0000">アプリの配布編</font>で設定説明予定</b>
gusukuは複数のkintone環境をひとつのプロジェクトで一元管理することができます。
なので煩雑になってたアプリの管理がすっきりできるようになります。
<small>（公式サイトには「マトリックス」ってカッコ良く書いてる</small>
![gusuku15.png](https://qiita-image-store.s3.amazonaws.com/0/73604/e31d50ca-58d8-89c7-6ac2-fec466c1cd85.png "gusuku15.png")

### kintoneアプリの登録
いよいよkintoneアプリをgusukuに登録します。
作成済みの環境名をクリックします。
![gusuku17.png](https://qiita-image-store.s3.amazonaws.com/0/73604/79232d9f-8956-de55-1f0c-7c7092b296ad.png "gusuku17.png")

![gusuku20.png](https://qiita-image-store.s3.amazonaws.com/0/73604/a08acb42-47f1-ce80-5fee-b8829b81d3fe.png "gusuku20.png")

アプリ追加ボタンをクリックして追加します。
![gusuku21.png](https://qiita-image-store.s3.amazonaws.com/0/73604/0211fc48-f290-0c47-9d5f-eae9f6f2124d.png "gusuku21.png")

ここで、kintoneアプリのappidが必要になるので、appidを調べます。
登録対象となるアプリは、kintoneのURLから調べることが可能。
この図の例では<b><font color="#FF0000">「32」</font></b>となります。
![gusuku18.png](https://qiita-image-store.s3.amazonaws.com/0/73604/d761d050-88ee-1af4-8969-96d24713feaf.png "gusuku18.png")

追加画面で確認したappidを入力するとアプリの登録ができるよ！
（図はちょっと違うけど
![gusuku22.png](https://qiita-image-store.s3.amazonaws.com/0/73604/d6328985-57e7-6534-1726-ebafda96d6ce.png "gusuku22.png")

### （補足）ルックアップなどで紐付いている複数のkintoneアプリを登録する場合
ルックアップなどで紐付いているアプリがある場合は、ルックアップで参照されているアプリ<b><font color="0000FF">（ = マスタアプリ）</font></b>を先に登録します。
![gusuku23.png](https://qiita-image-store.s3.amazonaws.com/0/73604/519a1183-cb27-1967-846a-475e4c5267df.png "gusuku23.png")

### アプリのバージョン管理（差分の取り込み）
gusukuにkintoneアプリを登録をした時点で、初回の取り込みが出来た状態になっています。
初回の取り込みが完了した段階で、バージョンは **「1」** となり、取り込む作業を行うごとにバージョンが上がっていきます。

kintoneでフィールドの追加・変更作業を行ってみましょう。
その後、gusukuの画面上で **「アプリ取り込み」** をクリックします。
※取り込みは手動なので注意。
![gusuku24.png](https://qiita-image-store.s3.amazonaws.com/0/73604/69cf60dd-62cc-e307-5962-32b8bfa39e6d.png "gusuku24.png")

アプリの取り込み時には、作業ログを残せます。
今回は備考欄フィールド（文字列）を追加したので、その内容でコメント。
コミットログですね。要は。
![gusuku25.png](https://qiita-image-store.s3.amazonaws.com/0/73604/a32a0ca3-5116-6906-d9e4-fe726b74e0c2.png "gusuku25.png")

実行すると、バージョンが **「2」** に！
これで変更箇所の取り込みができました。
![gusuku26.png](https://qiita-image-store.s3.amazonaws.com/0/73604/74170c10-d62d-1374-0844-0c04df67593f.png "gusuku26.png")

過去のバージョンとの差分の確認も画面上から行うことが可能です。
JSONのデータを見てる感じですね。
![gusuku27.png](https://qiita-image-store.s3.amazonaws.com/0/73604/519c9ec0-8b67-c6b8-0a66-61bdcdef460f.png "gusuku27.png")


### アプリのバージョン管理（過去のバージョンへ戻す）
次は変更前の状態に戻してみます。
アプリを変更前の状態に戻す時は戻したいバージョンを選択して、現在アプリが登録されている環境（この図では<b><font color="#FF0000">「ステージング環境」</font></b>）を選択し、**「指定バージョンの配布」**をクリック。
![gusuku28.png](https://qiita-image-store.s3.amazonaws.com/0/73604/a072dcd3-dc01-588e-2a86-5c215974f2e2.png "gusuku28.png")

アプリ取り込み同様、作業ログを残します。
今回のアプリには、アクセス権は未設定、アプリ名の変更もないため、チェックは入れていません。
もしアプリにアクセス権を設定してあったり、アプリ名を上書き変更する必要がある場合はチェックが必要になります。
![gusuku29.png](https://qiita-image-store.s3.amazonaws.com/0/73604/50016067-9331-be71-f328-c16d64a42f6f.png "gusuku29.png")


実行すると、kintoneアプリがgusukuで指定したバージョンの状態まで戻ります。

### アプリをロールバックする時の注意点
ちまちまgusukuからkintoneアプリの取り込みをしておかないと、下手したらすごく前の状態にまで戻ってしまうこともあるかもしれないから、取り込みはこまめにすることをオヌヌメする(•ө•)

次回は [基本機能を紹介してみる（後編）](http://qiita.com/rocca0504/items/0dcf94c1b42f614bbef7) **「アプリの配布機能」と「基本の便利機能」** の説明です。