kintone ノーコード開発体験ハンズオン

kintone ノーコード開発体験ハンズオン教材について

この内容は大学から講義のご依頼をいただきました、ノーコード開発のハンズオン教材になります。
最近は大学などでノーコード開発の講義や、ハンズオンの依頼が多なり、この教材は今後も最新の状況に更新しながら利用できるように作成しました。この教材を大学のハンズオン講義で体験するだけでなく、後の復習教材や個人の自習教材、そして kintone cafe などのコミュニティ活動で活用できないかと考えたところ、複業先である 株式会社ダンクソフト さんのご厚意で公開利用できることになりました。

環境構築用のデータなども利用できるようにしていますので、皆様のハンズオン教材としてご活用いただければ幸いです。

以下の目次で「2.kintoneの基本」～「7.プラグインを試してみる（初・中級）」までが kintone のノーコード開発のハンズオンになります。
「8.Webhook で Gmail に通知してみる（中級）」以降はステップアップ教材として kintone のノーコード開発に加えて JavaScript プログラム開発をプラスすることで、利用の幅を広げるだめの外部コンテンツを紹介しています。可能な方は是非挑戦してみてください！

---

kintone ノーコード開発体験ハンズオン（初級編）

1.事前準備

事前にご準備いただく内容についてご紹介しますが、普段利用する環境がある場合はそちらをご利用ください。

1.1.講義やコミュニティのハンズオンに参加した場合

kintone の環境は準備されていいると思いますので、そちらをご利用ください。
その他では、以下をご準備ください。
・ブラウザが利用できるPC（タブレットではできない内容も含まれるため、PCを推奨）
・可能ならEXCELか、EXCEL形式のファイルを表示、編集できるソフト
・「8.Webhook で Gmail に通知してみる（中級）」以降のハンズオンを行う場合は、テキストエディタや開発ツールなど（例：サクラエディタ）

1.2.自分で試してみる場合

上記の「講義やコミュニティで参加した場合」に加えて、以下の kintone の環境を準備する必要があります。
・kintone の試用環境か、開発者ライセンス環境（開発利用のみ可能）
　kintone 30日間無料試用のお試し申込み　https://kintone.cybozu.co.jp/trial/
　kintone 開発者ライセンス（開発環境）https://developer.cybozu.io/hc/ja/articles/200720464

1.3.わからないことは？

kintone の情報はネットで検索できますが、特に以下は参考になります。
kintone ヘルプ　https://jp.cybozu.help/k/ja/
kintone資料・動画　https://kintone.cybozu.co.jp/material/

1.4.kintone のハンズオン環境を準備（ハンズオン主催者）

kintone の試用環境にハンズオンを準備するのに大変なのは、ユーザIDを人数分用意することです。10人を超えると手動で登録するのは大変ですので、以下を参考にユーザを一括登録すると良いでしょう。

ユーザーを一括で登録、編集する
https://jp.cybozu.help/general/ja/admin/list_useradmin/list_csv/user.html

一括登録用のCSVテンプレートファイルを以下に置いています。pawwsord 等を適宜変更してご活用ください。

さらに、予め 5～10 アカウントが所属する kintone の「スペース」を作っておくと良いでしょう。

---

2.kintoneの基本

2.1.用語の解説

kintone の用語については以下を参照ください。

kintone用語集
https://jp.cybozu.help/k/ja/glossary.html

以下の用語は事前に確認しておくと良いでしょう。

|用語|解説ページ|
|:---|:---||
|アプリ|https://jp.cybozu.help/k/ja/glossary/app.html|
|スペース|https://jp.cybozu.help/k/ja/glossary/space.html|
|スレッド|https://jp.cybozu.help/k/ja/glossary/thread.html|
|レコード|https://jp.cybozu.help/k/ja/glossary/records.html|
|フィールド|https://jp.cybozu.help/k/ja/glossary/field.html|
|テーブル|https://jp.cybozu.help/k/ja/glossary/table.html|
|プラグイン|https://jp.cybozu.help/k/ja/glossary/plug-in.html|
|Webhook|https://kintone-blog.cybozu.co.jp/developer/000283.html|

2.2.ログインとポータル画面

指定されたURLをブラウザで開いて「ログインID」と「パスワード」を入力します。

初回ログイン時にはパスワードを変更します。（パスワードは忘れないようにしてください！）

初回だけ以下のような画面が表示されますので、全て「X」で閉じます。

kintone にログイン後は以下のポータル画面が表示されます。

ポータル画面で主に利用する機能は以下です。

No.	機能	説明
①	サイドメニュー	kintone の各機能に移動するためのサイドメニューを表示
②	ホーム	各画面に遷移していても、このポータル画面に戻ります
③	スペース	利用できるスペースが表示されます
④	アプリ	利用できるアプリが表示されます
⑤	アプリの追加	アプリを追加します

画面遷移先で戻り方がわからなくなった時は、②の「ホーム」でこのポータル画面に戻ると良いでしょう。

3.アプリを簡単に作って操作してみる（初級）

kintone の指定されたスペース（作業環境）にアプリを追加しましょう！
ログインした直後のポータルでアプリを追加するとアプリが整理しにくくなりますので、予めスペースを準備して、そちらにアプリを追加することをお勧めします。

3.1.スペースの追加（必要な場合のみ）

kintoneのアプリは後々の管理を考えるとスペースに追加して紐づけた方が良いでしょう。紐づけがない場合、たまに使うアプリを探すのが手間になります。以下の説明ではスペースを活用する前提で話を進めますので、自分で試してみる場合はスペースを追加しておいてください。

スペースの追加については、以下を参照ください。
https://jp.cybozu.help/k/ja/user/space/add_space.html

3.2.アプリ作成のシナリオ

**課題：**会社内でお客様の情報が共有されてないため、担当者が休むとお客様に連絡できない
**解決案：**お客様の情報を社内の全員で共有し、担当者が休みでもお客様に連絡できるようにする
**解決手段：**kintoneでお客様の情報を共有する「顧客リスト」アプリを作成する

3.3.スペースへの移動

ポータル画面の ③ の「ハンズオンXX-XX」のスペースに移動します。
例えば「ハンズオン41-50」のスペースは、user41 から user50 が利用するスペースです。

userXX の XX 部分はログインしたユーザIDで設定します。

以下のスペースが表示されます。

以降の全ての作業はこのスペースで行う前提での説明となります。

3.4.アプリをマーケットから追加

スペースの上部右端①をクリックし、開いたドロップダウンの「アプリの追加」を選択します。

kintone アプリストアが開きますので、今回はお勧めアプリから「顧客リスト」を選択します。

「このアプリを追加」しますが、サンプルデータも含めるようにして「追加」します。

以下のように「顧客リスト」アプリが追加されたことが確認できます。
クリックして「顧客リスト」アプリを開いてみましょう。

「顧客リスト」アプリの一覧が表示されました。

3.5.アプリの名前を変更する

先ず最初にアプリの名前を変更します。

１つのスペースで最大10人が作業していますので「顧客リスト」を「userXX顧客リスト」に変更して誰が作ったアプリかわかるようにします。

userXX の XX 部分はログインしたユーザIDで設定します。

④の歯車マークをクリックすると、以下の設定画面が表示されます。

赤が囲みのアプリ名の「顧客リスト」を「userXX顧客リスト」に上書きして「アプリを更新」します。

確認画面で「OK」した後に一覧画面に戻り、アプリ名が変更されたことが確認できます。

①のリンクをクリックするとスペースに戻りますが、スペースでもアプリ名が変わったことが確認できます。

以上で「userXX顧客リスト」アプリの追加は完了です。
簡単ですよね！

3.6.アプリの基本操作

アプリの基本操作について説明します。

以下に各機能と説明を参照に、色々な操作を試してみましょう。

No.	機能	説明
①	一覧の選択	アプリの一覧を選択します
②	グラフの選択	アプリのグラフを選択します
③	データの追加	アプリにデータを追加します
④	アプリの設定	アプリの設定作業を行います（一覧、グラフもこちらで設定）
⑤	アプリのオプション	一覧の表示件数を変更したり、アプリのデータの出力や取込みを行います
⑥	データの詳細表示	一覧の1行分のデータを詳細に表示します（通常、データの変更・削除はこの画面から行います）
⑦	データの変更	一覧の1行分のデータを変更します
⑧	データの削除	一覧の1行分のデータを削除します

先ほど作成した「userXX顧客リスト」アプリで、以下のようにデータの③追加や④修正をしてみましょう。

データの詳細を確認するため⑥詳細表示を試してみましょう。

詳細画面からも各操作ができますので、以下を試してみましょう。

No.	機能	説明
①	前後の情報を表示	一覧で前後に表示されていたデータの詳細表示に遷移します
②	データの追加	データを追加します
③	データの変更	データを変更します
④	データの複写	表示しているデータを複写して、データを追加します
⑤	アプリの設定	アプリの設定を行います
⑥	オプション	このデータのリンク（URL）をコピーや、データの印刷、データの削除を行います
⑦	戻る	アプリの一覧画面やスペースの画面に戻ります

一通りできましたか？

---

4.アプリをEXCELファイルから作りグラフで分析する（初級）

前の課題では予め kintone に準備されているテンプレートからアプリを追加しました。しかしながら、実際は目的に合致したテンプレートがない場合が多いでしょう。
そのような場合には、集計や分析で良く利用されるエクセルのデータがあれば、そのデータから簡単にアプリを追加することもできます。

4.1.シナリオ

**課題：**とある大学では過去に実施した公開講座の参加者の満足度わからず、継続すべきか判断できない
**解決案：**過去の公開講座参加者のアンケート結果から満足度を分析し、継続するか判断する
**解決手段：**kintone に過去の公開講座参加者のアンケート結果を取り込んで満足度をグラフで分析する

これまでの公開講座アンケート結果はエクセルファイルで保管されているものとします。

4.2.アンケート結果データの準備

EXCELのデータは以下のように項目とデータだけのシンプルなシートが1枚のものを用意します。

サンプルのアンケート結果データが入っているEXCELファイル（以下）をダウンロードします。

URLを開いて表示した後、右上の「ダウンロード」でPCにEXCELのシートを保管します。

4.3.アプリの追加

先の「1.アプリを簡単に作って操作してみる」と同じ手順で、スペース①のプルダウンから「アプリの追加」を選択します。

今回は以下の画面で「EXCELを読み込んで作成」を選択します。

最初に開いた（１／３）画面で「作成を開始する」を選択すると以下の（２／３）画面になります。「すべてにチェックを入れる」をクリックして、全てのチェックを入れた後に「アップロードへ進む」を選択します。

（３／３）画面で先ほどダウンロードした「アンケート集計サンプルデータ.xlsx」を選択します。
すると、以下のようにプレビュー画面でデータが確認できるようになります。

画面をスクロールさせると、以下の画面が表示されます。
「ノーコード開発」項目がドロップダウンになっていますので、ラジオボタンに変更してアプリを「作成」します。

スペース画面に戻ると「アンケート集計サンプルデータ」というアプリが追加されていますので、アプリの設定を開きます。

今回もアプリの名称「アンケート集計サンプルデータ」を「userXXアンケート集計サンプルデータ」に変更して誰が作ったアプリかわかるようにします。

以上でアプリは完成です。
この方法でも簡単にアプリを追加できますね！

4.4.グラフを追加

アンケート結果はグラフで表示すると結果を簡単に把握できて便利ですので、グラフを追加してみます。
グラフは設定画面で追加しますので、右上歯車のアイコンから設定画面を開きます。

以下の設定画面で「グラフ」のタブを開きます。

以下のグラフ画面の「＋」でグラフを追加します。

いきなりグラフを自動で設定表示しています。
先ずはグラフ名を設定してください。（グラフの名称にはユーザ名を含まなくても良い）

グラフの設定項目には以下があります。

No.	機能	説明
①	グラフの種類	グラフの種類を選択します（グラフ以外に集計表も選択可）
②	分類する項目	グラフ表示するデータ項目を選択します（データ項目は複数選択可、「＋」で項目を追加、「Ｘ」で項目を削除）
③	集計方法	分類項目の集計方法（レコード数、平均、最小値など）を選択します（集計方法は複数選択可、「＋」で項目を追加、「Ｘ」で項目を削除）
④	条件	データを選択する条件を設定します（条件は複数設定可、「＋」で項目を追加、「Ｘ」で項目を削除）
⑤	ソート	グラフのデータ表示順を設定します（表示順は複数設定可、「＋」で項目を追加、「Ｘ」で項目を削除）

自動で設定したグラフはわかりづらいので、グラフの種類を縦棒グラフや、円グラフに変えて確認してみます。

好みのグラフの種類が見つかったら「保存」します。
グラフを保存すると、以下のように追加されたことが確認できます。

グラフは複製追加することも可能ですので、色々表示を変えて試してみるのも良いでしょう。
この状態ではグラフはまだ保管されないので「アプリを更新」します。

アプリを更新した後に、アプリの一覧画面から追加したグラフを表示できます。

グラフは以下のように表示されます。

グラフ以外に集計も表作成できます。
グラフ、表のいずれも先ず作ってみて表示を確認しながら進めることが活用の近道になるでしょう。

---

5.アプリのレコードを他の人が追加・変更・削除できないようにする（初級）

先の章「4.アプリをEXCELファイルから作りグラフで分析する」で作成したアプリは、アンケート結果を分析するためのものです。現状のデータを勝手に追加・変更・削除などされては集計が正確でなくなるため困ります。
そのような場合はアプリの「アクセス権」を設定してデータの追加・変更・削除の操作ができないように設定します。

5.1.アプリの「アクセス権」を設定

「userXXアンケート集計サンプルデータ」アプリの、右上歯車のアイコンから設定画面を開きます。

以下の設定画面で「設定」のタブを開きます。

以下の画面の中央下部にある「アクセス権」の「アプリ」を開きますます。

以下のアプリの権限を設定する画面が開きます。

「userXX」と「アプリ作成者」はアプリを追加した自身のことでです。「Everyone」はその他のkintoneユーザのことです。
初期設定では全てのユーザがデータの追加・編集・削除が可能になっています。

以下のように全ユーザの「レコード追加」と「レコード編集」、「レコード削除」のチェックを外して、ユーザが誤ってデータの追加・編集・削除の操作ができないように設定します。

上記のように編集を終えたら、右上青色の「保存」で設定内容を保存します。

以下の画面で「アプリを更新」すると、設定がアプリに反映されます。

以上で設定は完了です。

5.2.アプリのデータ追加・変更・削除の操作を確認

先ほど権限設定した「userXXアンケート集計サンプルデータ」アプリで実際にデータの追加・変更・削除の操作ができないか確認してみます。

アプリの右上に注目してください。「＋」マークの追加ボタンが表示されてないことが確認できます。

次に、どの行でも良いので行の右端の青色紙のアイコンで明細画面を開いてみます。

明細画面の右上から**「＋」の追加マーク、ペンの編集マークが表示されず**、三つの点が並んだマークで表示される**「レコードを削除」選択が表示されない**ことが確認できます。

以上で、権限の設定が反映されてアプリのデータを追加・変更・削除ができない状態に変更できたことが確認できました。
余裕があれば、色々なパターンの権限設定をためしてみましょう。

---

6.アプリを１から作って用途に応じた表示画面にする（初級）

これまでの課題では、テンプレートやEXCELファイルから簡単にアプリを追加しました。無論これらの方法でアプリを作成しても問題ないですが、kintone で全く何もない状態からアプリを作る場合も多くあります。
kintoneで最初からアプリを作成して、用途に応じた表示を追加してみます。

6.1.シナリオ

**課題：**リーダがゼミを欠席した時に、出席者を先生に報告できずに困っている
**解決案：**ゼミの参加者が出席を記録して、結果をリーダが先生に報告できるようにする
**解決手段：**kintone にゼミ出席管理アプリを作成しカレンダーで簡単に出席者を確認する

ゼミの出席報告で欲しい項目は以下とします。

No.	項目	説明
①	出席日	出席した日（必須入力）
②	氏名	出席者の氏名（必須入力）
③	発表	発表の有無
④	提出	提出物があれば記載

6.2.アプリの追加

シナリオの課題解決のため、「ゼミ出席管理」アプリを１から作成してみます。

スペース①のプルダウンから「アプリの追加」を選択します。

今回は「初めから作成」を選びます。

以下の画面が表示されます。

今回も先ずは「新しいアプリ」というアプリ名を「userXXゼミ出席管理」に変更して、誰が作ったアプリかわかるようにします。

6.3.項目の追加と編集

アプリを「初めから作成」した場合はフォームには何もありませんので、先ずはフィールド（入力項目となりデータを保存する部品）を配置します。

以下にフォームのフィールドの配置や設定方法を簡単に説明します。

フィールドにはいくつかの種類が準備されていますが、詳細は以下を参照ください。

kintoneで利用できるフィールド一覧
https://jp.cybozu.help/k/ja/user/app_settings/form/form_parts.html

今回利用するフィールドは以下です。

|フィールド（部品）|説明|表示形式|
|:---|:---|:---|:---|
|日付|日付形式のデータを入力して保管|日付形式|
|文字列（1行）|1行の文字列を入力して保管|そのままの文字列|
|ラジオボタン|指定した項目を選択します|選択項目|

最初に使いたい部品をドラッグ（クリックしたまま配置したい場所に移動してクリックを外す）します。

これでフォームにフィールドを配置できます。

フィールドの設定や複製、削除を行う場合は、作業するフィールドにマウスを近づけた後に、表示された歯車にマウスを近づけと以下のプルダウンメニューが表示されるので、作業内容を選択します。

フィールドの表示サイズを変更する場合は、フィールドの右端にマウスを近づけると左右の矢印が表示されるので、左や右にドラッグ（クリックしたままちょうどのサイズでクリックを外す）して調整します。

その他フィールドに関する設定については、以下を参照ください。

kintone HELP フォームを設定する
https://jp.cybozu.help/k/ja/user/app_settings/form/set_form.html

6.4.項目の設定

では、実際に以下のフィールドを設定してみます。

No.	フィールド名	フィールド（部品）	説明
①	出席日	日付	出席した日（必須入力）
②	氏名	文字列（1行）	出席者の氏名（必須入力）
③	発表	ラジオボタン	発表の有無
④	提出	文字列（1行）	提出物があれば記載

先ずは「6.3.項目の追加と編集」の手順で「日付」フィールドを配置します。
設定画面を開いてフィールド名を「出発日」にして「必須項目にする」をチェックして「保存」します。

続いて「文字列（1行）」フィールドを配置します。
設定画面を開いてフィールド名を「氏名」にして「必須項目にする」をチェックして「保存」します。

続いて「ラジオボタン」フィールドを配置します。
設定画面を開いてフィールド名を「発表」にします。
ラジオボタンの項目と順番は「有り」、「無し」で設定し、初期値は「無し」を選択して「保存」します。

最後に、再度「文字列（1行）」フィールドを配置し、フィールド名を「提出」にして「保存」します。

以上で、フォーム全フィールド（項目）の設定を完了したので「フォームを保存」します。

6.5.カレンダー表示の設定

ゼミの出席者は日付と名前の一覧で表示されるより、カレンダーのような表示形式で月毎に一見するだけで確認できると便利です。
kintone はカレンダー形式の表示機能があり、今回はその機能を使ってみます。

「一覧」のタブを選択すると、以下の画面が表示されます。
「＋」をクリックして、新たな一覧を追加します。

初期表示では以下のように「レコード一覧の表示形式」が一覧になっています。

通常は一覧形式の表示を利用することが多いですが、日付に関するデータを含む場合はカレンダー表示形式も選択できます。

以下のように一覧名を「カレンダー」と入力し、レコード一覧の表示形式を「カレンダー形式」を選択します。
「カレンダー形式」を表示すると日付とタイトルの選択が表示されるので、日付に「出席日」、タイトルに「氏名」を選択して「保存」します。

以下のように、一覧に「カレンダー」が追加できたら「アプリを公開」します。（すでに一旦「アプリを公開」した後に修正する場合は「アプリを更新」します。）

以下のように、アプリを最初に開いた時に一覧ではなくカレンダーが表示されるようになります。

実際に何人か分の出席を追加します。

出席を追加した後は、その日に出席者の名前が表示されます。
以下の例ではカレンダーの7月13日に「テスト太郎」さんが表示されています。

「テスト太郎」さんの出席を変更する時は、カレンダーの氏名をクリックして一旦詳細画面を表示、そこから変更画面に遷移することができます。

一から kintone アプリを作る場合でも、操作に慣れてしまいえばさほど難しくはないですよね！

---

7.プラグインを試してみる（初・中級）

7.1.プラグインとは

kintone には地図を表示したり、個別レイアウトを作成してPDF帳票を出力するなどの機能はありません。
実際に kintone を使い始めると、地図やPDF帳票などを使いたい要望が出てきますが、これを自分でカスタマイズ（プログラム開発して機能を追加したり）することは大変です。そこで、簡単に機能を拡張できるプラグインが提供されています。

プラグインには有償のものと、無償のものがあり、アプリで利用する前に kintone のシステム管理の権限を持つユーザがプラグインを追加する必要があります。システム管理の権限を持つ場合は、必ず事前に追加の設定を行っておくか、権限がない場合はシステム管理者の方にお願いして事前に追加してもらいましょう。

このハンズオンでは「いいねプラグイン」を利用します。以下のリンクを参考に事前にプラグインを準備しておきます。

プラグインを追加／削除する（システム管理）
https://jp.cybozu.help/k/ja/admin/add_plugin/plugin.html

いいね!プラグインダウンロード
https://developer.cybozu.io/hc/ja/articles/203711920#step3

7.2.いいねプラグインを試す

「6.アプリを１から作って用途に応じた表示画面にする（初級）」で作成した「ゼミ出席管理」アプリに、いいね!プラグインを使って Facebook のような「いいね」できる機能を追加します。

いいね!プラグイン
https://developer.cybozu.io/hc/ja/articles/203711920

7.3.プラグイン用項目の追加

「いいねプラグイン」を使うためには、アプリにいいねが押された回数を保管するフィールドと、いいねを押したユーザを保管するフィールドを追加する必要があります。

以下のカレンダー表示画面で「ゼミ出席管理」アプリに項目を追加するため歯車アイコンで設定画面を表示します。

フォームの設定画面で「数値」ファイールドと、「ユーザー選択」フィールドをフォームに追加します。

数値フィールドの設定を開き、フィールド名を「いいねの数」に設定します。

ユーザー選択フィールドの設定を開き、フィールド名を「いいね押した人」に設定します。

一旦フォームを保存します。

7.4.プラグインの設定

続いてプラグインの設定に移ります。

「設定」タブを選択して、プラグインを開きます。

「ゼミ出席管理」アプリはまだプラグインを利用していないため、何も表示されません。
「プラグインの追加」画面を開きます。

「いいねプラグイン」をチェックして「追加」します。

以下のようにいいねプラグインが追加されましたが、このままでは利用できません。
「設定」の歯車をクリックして、プラグインの設定を行います。

「いいねした人」に使うフィールドを「いいね押した人」に、「いいねの数」に使うフィールドを「いいねの数」に設定し保存します。

プラグインの設定を有効にするため、以下の「アプリの設定」リンクで設定画面に戻ります。

「アプリを更新」するとプラグインが利用できます。

7.5.プラグインの確認

早速プラグインが使えるか確認します。

最初に表示される「カレンダー」表示から、「（すべて）」の一覧表示に変更します。
レコード番号にいいねのアイコンが表示されていますので、1回クリックします。

以下のようにいいねのアイコンが青塗に変わり、いいねの回数がアイコンの小指辺りに表示されます。

折角ですので、同じスペースで別の方が作成した「ゼミ出席管理」アプリの一覧を開いて、いいねを試し合ってみましょう！

7.6.その他のプラグイン

kintone にはすでに多くのプラグインがありますので、困った時は以下の情報などを参考に自分のやりたいことに合うプラグインを探すと良いでしょう。

Cybozu Developer Network サンプルプラグイン
https://developer.cybozu.io/hc/ja/sections/200681620

kintone のすぐに使えるプラグイン
https://qiita.com/yukataoka/items/8109e390e31eb89af278

kintone プラグイン一覧
https://qiita.com/rex0220/items/6ceefa1677b3dc58a523

---

初級編をもっと体験したい方は

初級編のハンズオンなど、kintone についてもっと体験したい方は以下などを参考に、オンラインやオフラインで参加してみると良いでしょう！

【サイボウズ主催】kintoneハンズオンセミナー 便利に使おう講座
https://page.cybozu.co.jp/-/cy-handson-k

kintone セミナー
https://kintone.cybozu.co.jp/seminar/

kintone Café
https://www.kintonecafe.com/
https://kintonecafe-kochi.doorkeeper.jp/

---

kintone ノーコード開発体験ハンズオン（中・上級編）

8.Webhook で Gmail に通知してみる（中級）

kintone にはデータの追加やコメントの書き込み時に他のサービスの外部APIと連携できる Webhook という機能があります。この機能を利用するとプログラミングの知識がなくても、kintone の Webhook で送信したデータを zapier で中継して Gmai に送ることで、kintone にデータを追加した時に Gmail に通知することができます。

プログラム開発はしませんが、zapier のような中継サービスを利用して、Gmail などの他のサービスとの連携を実現する場合でもそれなりに面倒な設定などがあります。ですが Webhook と zapier で他のサービスと連携して使えると非常に便利ですので、是非に以下にご紹介する「WebhookでGmailに通知する」ハンズオン体験もお勧めします。

WebhookでGmailに通知する
https://developer.cybozu.io/hc/ja/articles/115000299143

---

9.Google Form の回答結果をアプリに保管する（上級）

kitnone は先に紹介したプラグインやWebhookで kintone にない機能を拡張することが可能です。
しかしながら、プラグインやWebhookでできることにも限界があります。例えばアンケートなどに良く利用されている Google Form の結果を kintone で管理したい場合は Google Form 側で簡単なプログラム開発を行うことで実現できます。（無論 kintone 側で JavaScript プログラム開発を行うことでも拡張できますが、Google Form との連携の例では Google Form 側での開発が簡単にできるため、Google Form 側のプログラム開発を行っています。）

Google Form はアンケートなどに良く利用されていますが、この回答を kintone に保管するとアンケート結果をチームで共有・解析できて便利です。この方法は普段私も活用しています。Googleのアカウントを取得して、サンプルのJavaScriptプログラムを少し修正するだけですので、こちらのハンズオン体験もお勧めします。

Google フォームとkintoneを連携
https://developer.cybozu.io/hc/ja/articles/115003856483

補足１（APIトークンについて）

APIトークンとは、アプリごとに「トークン」と呼ばれる文字列を発行し、この文字列をユーザIDとパスワードの代わりに利用することで、kintone以外の外部アプリ等との連携を行うことができます。発光するAPIトークンには権限を設定することもできるので、例えばデータの閲覧のみを許可することで安全に外部アプリとの連携を行うことが可能になります。
設定方法や詳細については、以下を参照ください。

APIトークンを使ってみよう
https://developer.cybozu.io/hc/ja/articles/202463840

補足２（Apps Script でトリガーを追加し保存する際のトラブル）

Google Apps Script でトリガーを追加し保存する時に、以下の画面が表示されます。Googleアカウントを複数登録されている方は、必ずGoogleフォームを作成したアカウントを選択してください。

以下の画面が表示されたら「詳細」を確認します。

外部の Google Apps Script ライブラリィを利用するため、このような画面の表示されます。今回はハンズオン利用で問題ないため、アクセスを許可するため、ページに移動します。

以下の画面をスクロールすると「許可」ボタンが表示されますので、許可します。

---

10.kintoneからSlackに通知を送る方法（上級）

kintone の JavaScript カスタマイズ開発を体験してみたい方は、kintone から Slack に通知を送る以下を試してみると良いでしょう。slack 側で Webhook を設定して、テキストエディタで JavaScript プログラムをコピペして、プログラムの <ドメイン名> と 部分を自分の環境に合わせて修正するだけで使えます。

以下のような紹介されているプログラムのコードを活用して動かしながら体験することが、kintone の JavaScript カスタマイズ開発を習得するための近道になるかもしれません。

kintoneからSlackに通知を送る方法
https://developer.cybozu.io/hc/ja/articles/207419736

---

11.その他 kintone でさらに開発に挑戦してみる方向けの情報

以上、ハンズオンを体験して、kintone の JavaScript カスタマイズ開発に挑戦したい方は以下の情報を参照すると良いでしょう。

外部連携サービス一覧
https://developer.cybozu.io/hc/ja/articles/360000877166

cybozu developer network
https://developer.cybozu.io/hc/ja

kintone 開発者ライセンス（開発環境）
https://developer.cybozu.io/hc/ja/articles/200720464

開発ノウハウ
https://developer.cybozu.io/hc/ja/sections/360000188063

kintone API
https://developer.cybozu.io/hc/ja/articles/360028177472

---

以上でこの内容は終わりです