2016年7月20日(水曜日)に中央電力さんで開催されたヤマムギ kintone入門ハンズオン vol.1のハンズオン資料です

1. 【ヤマムギ vol.1 kintone入門ハンズオン】
kintoneアプリを作ってみよう！
〜簡単アプリ開発してみる編〜
2016/07/20
アールスリーインスティテュート
いけがみみどり

2. 池上 緑（いけがみ みどり）
アールスリーインスティテュート
クラウドエンジニア
gusukuエバンジェリスト
業務に関すること
 クラウド使ったソリューション・構築・お客様への要件の
ヒアリングもやります！
 AWSやkintone、最近はマーケ活動も少々
 展示会ではコスプレエンジニア
 普段の姿もOLコスプレ
 心はわりと低レイヤー思考
 インフラエンジニアと思われ〼
 実際インフラもやってる！
 ネットワーク、サーバー、ストレージ、クラウドインフラ、
ミドルウェア好き
p526CA
p52_rocca
業務外のこと
 コミュニティ運営したり登壇したりMCしたり
 競技イベント参加したり #インフラセキュリティ系多め
 最近女子会コミュニティの立ち上げやフォロー多め
 JAWS-UG 関西女子会 運営コア
 kintone Café 大阪/関西女子会 運営コア
 kintone Café 沖縄女子会 立ち上げフォロー
 このあたりに書いてあるので見てください！
https://www.r3it.com/community/
自己紹介
2

3. ３
登壇する時の中の人（※すべて同一人物です）

4. ４
弊社アールスリーについて
アールスリーインスティテュート（以下
R3）は・・・
クラウドを駆使してお客様の課題解決
を行う大阪のシステム開発会社
※東京支社もあります
 ハイスピードSI（＝kintoneやAWS等
のクラウドサービスを活用し、お客
様が今必要なシステムを可能な限
り早くご提供するサービス）の会社
 インフラからアプリケーションまで幅
広くサポート

5. 1. アプリ作成前の事前準備
５

6. ６
アプリ作成前の事前準備〜kintoneユーザーの作成（１）〜
お持ちのkintoneアカウントでログインします
今回は管理者権限が必須となります
※Administrator相当のアカウントでログインして下さい

7. 7
アプリ作成前の事前準備〜kintoneユーザーの作成（２）〜
cybozu.com共通管理画面を開きます
まずは必要なユーザーを作成します

8. 8
アプリ作成前の事前準備〜kintoneユーザーの作成（３）〜
①左側のメニュー
「システム管理」＞「セキュリティ」＞「ログイン」から
ログインのセキュリティ設定画面を開きます
②パスワードポリシーの「パスワードの変更をユーザーに許可
する」のチェックは外して下さい

9. 9
アプリ作成前の事前準備〜kintoneユーザーの作成（４）〜
左側のメニュー
「ユーザー管理」＞「組織/ユーザー」から
ユーザーの追加画面を開きます

10. 10
アプリ作成前の事前準備〜kintoneユーザーの作成（５）〜
下記3ユーザーを追加して下さい
 木下（kinoshita）
 山本（yamamoto）
 鈴木（suzuki）
※パスワードはユーザー名と同一にして下さい

11. ２. アプリの作成
〜Excelから作成する〜
11

12. 12
今回は以下の2つのExcelファイルを使って
アプリを作成していきます
顧客リストsample.csv
案件リストsample.csv
アプリの作成〜Excelから作成する（１）〜

13. 13
アプリの作成〜Excelから作成する（２）〜
アプリを新規追加します

14. 14
アプリの作成〜Excelから作成する（３）〜
「Excel/CSVから作成」をクリック

15. 15
アプリの作成〜Excelから作成する（４）〜
インポートする対象のファイル「顧客リストsample.csv」
を選択します

16. 16
アプリの作成〜Excelから作成する（５）〜
①アプリ名を「顧客マスタ」に変更
②フィールドタイプを下記の通り変更
 会社コード：数値
 それ以外：文字列（1行）

17. 17
アプリの作成〜Excelから作成する（６）〜

18. 18
アプリの作成〜Excelから作成する（７）〜
アプリの設定を変更したい時
画面右上「・・・」をクリック
「アプリの設定を変更」を選択

19. 19
アプリの作成〜Excelから作成する（８）〜
「フォームの編集」で
アプリのフォームを編集することが可能です

20. 20
アプリの作成〜Excelから作成する（９）〜
Excelからアプリを作成した場合は
図のようなレイアウトになります

21. 21
アプリの作成〜Excelから作成する（10）〜
「会社コード」フィールドの設定変更を行います。フィー
ルド右上の歯車から「設定」をクリック

22. 22
アプリの作成〜Excelから作成する（11）〜
「値の重複を禁止する」にチェックを入れて保存

23. 23
アプリの作成〜Excelから作成する（12）〜
アプリの設定画面で保存ボタンを押して、最後は必ず
「設定完了」ボタンを押して下さい

24. ３. アプリの作成
〜1から自分で作成する〜
24

25. 25
アプリの作成〜1から自分で作成する（１）〜
kintoneのポータルの画面に戻り、アプリの作成で「はじ
めから作成」をクリックします

26. 26
アプリの作成〜1から自分で作成する（２）〜
ウィザードにそってアプリを作成していきます
まずはアプリの名前を入力します
アプリの名前：案件管理

27. 27
アプリの作成〜1から自分で作成する（３）〜
「一般設定」アプリのアイコンやデザインテーマの選択が可能です

28. 28
アプリの作成〜1から自分で作成する（４）〜
アプリ作成中は、他のユーザーから閲覧ができないように、
アプリグループを「Private」に設定しておきます
※設定反映のための「保存」を忘れないように！

29. 29
アプリの作成〜1から自分で作成する（５）〜
いよいよアプリの作成に入ります
「フォームの編集」をクリック

30. 30
アプリの作成〜1から自分で作成する（６）〜
左側メニューに並んでいるフィールドの部
品をドラッグ＆ドロップで空白のスペース
に設置していきます

31. 31
アプリの作成〜1から自分で作成する（７）〜
設置するフィールドとレイアウトです
こちらの図を参考に並べてみて下さい

32. 32
アプリの作成〜1から自分で作成する（８）〜
最終的にはこの図のように、各フィールドに
名前（項目名）を設定します

33. 33
アプリの作成〜1から自分で作成する（９）〜
設置したフィールドはドラッグすると横幅を
変更することが可能です

34. 34
アプリの作成〜1から自分で作成する（10）〜
各フィールドに名前（項目名）を設定したり、フィールドの設定を
何か変更したい時は・・・
フィールド右上の歯車から「設定」をクリック

35. 35
アプリの作成〜1から自分で作成する（11）〜
「フィールド名」に表示させたい名前（項目名）を入力します
※フィールドコードとは？
フィールドを識別するための識別名
（自動計算やカスタマイズ等で使用します。第1回では扱いません）
128文字以内であれば、任意の値・文字で変更が可能です

36. 36
アプリの作成〜1から自分で作成する（12）〜
 （フィールド名）ステータス：ドロップダウン
 項目と順番：下記のように設定してください
「要望確認」「商品説明」「見積提出」「稟議中」「受注確定」

37. 37
アプリの作成〜1から自分で作成する（13）〜
 （フィールド名）活動分類：ドロップダウン
 項目と順番：下記のように設定してください
「面談」「資料送付」「商品説明」「その他」

38. 38
アプリの作成〜1から自分で作成する（14）〜
 （フィールド名）受注金額：数値
 単位記号：¥（円）マークを入れて下さい

39. 39
アプリの作成〜1から自分で作成する（15）〜
会社コードをキーにして、先ほど作成した顧客マスタか
ら顧客情報を参照する設定を行います
 （フィールド名）会社コード：ルックアップ
 必須項目：チェック有り
 関連付けるアプリ：顧客マスタ
 コピー元のフィールド：会社コード

40. 40
アプリの作成〜1から自分で作成する（16）〜
下記のように、顧客マスタから必要な情報をコピーする
設定にします

41. 41
アプリの作成〜1から自分で作成する（17）〜
以下のフィールドはテーブルとして設定します
 活動日
 活動分類
 活動内容
 提出資料
一列に並べると右端にアイコンが出てくるので、「設定」を
クリックします

42. 42
アプリの作成〜1から自分で作成する（18）〜
「この行をテーブルにする」をクリック

43. 43
アプリの作成〜1から自分で作成する（19）〜
フィールドコードはそのままで「保存」をクリックします

44. 44
アプリの作成〜1から自分で作成する（20）〜
個々のフィールドとしてバラバラに設置されていたフィール
ドが、テーブルとして設定されました

45. 45
アプリの作成〜1から自分で作成する（21）〜
この図のようになったら左上の「保存」ボタンをク
リックして保存します

46. 46
アプリの作成〜1から自分で作成する（22）〜
kintoneアプリのデータを一覧で表示するための設定を追加します

47. 47
アプリの作成〜1から自分で作成する（23）〜
左側のフィールドのパーツを先ほどと同じようにドラッグ＆ドロップで並べます
 一覧名：全案件（受注日程）
 並べる順番：「会社名」→「案件名」→「受注日」→「ステータス」→「受注金額」

48. 48
アプリの作成〜1から自分で作成する（24）〜
最後は「設定完了」をクリックしてアプリの作成完了です

49. 4. 作成したkintoneアプリに
データを登録してみよう
49

50. 50
作成したkintoneアプリにデータを登録してみよう（１）
完成した案件管理アプリにはデータが入っていません
今回は、データをExcelから読み込むため、右上の「・・・」から
「ファイルから読み込む」をクリックします
※1件ずつ手作業で追加することも可能です

51. 51
作成したkintoneアプリにデータを登録してみよう（２）
①読み込むファイル「案件リストsample.csv」を選択
②アプリのフィールドと読み込むデータの列の対応付けが、「レ
コード番号」以外すべて一致していることを確認して「読み込む」
をクリック

52. 52
作成したkintoneアプリにデータを登録してみよう（３）
OKをクリックします

53. 53
作成したkintoneアプリにデータを登録してみよう（４）
データが正常に読み込まれると
「ファイルの読み込みが完了しました」となり、
案件管理アプリにデータが入ります
次に1件1件のデータを確認してみます

54. 54
作成したkintoneアプリにデータを登録してみよう（５）
1件1件のデータを編集したい時は、右上鉛筆マークをク
リックします

55. 55
作成したkintoneアプリにデータを登録してみよう（６）
ここでデータの修正や追記が可能です

56. 次回以降は
もう少しkintoneの機能について
見ていきましょう！
56