Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
kintoneって聞いたことあるぞ!?
ならアプリを作成してみよう!
ハンズオン(アプリ作成編)
(株)アイティー・プラス・ワン
kintoneエバンジェリスト
星野智久
2016年2月6日
kintone Café 新潟 Vol.3
自己紹介
去年は、プライベートで枝豆の収穫イベ
ントに参加したら、なぜかkintoneを導
入してもらえることになりました。
株式会社アイティー・プラス・ワン
星野 智久(愛称は・・・のんびん、ブルー)31歳
新潟県長岡市(旧川口町)出身
サイ...
kintoneCafé??
kintoneCafé??
kintoneCafé?
kintone Caféは、まだkintoneに触れたことの無い方から、
より高度なカスタマイズを行いたいと考えているプロ
フェッショナルの方まで幅広い層を対象に、 楽しく学び・
教え合うことで、kintoneの魅力や...
kintoneCafé?
5
2013/12/7 札幌 Vol.1(起源)
2014/5/16 札幌 Vol.2
2014/10/25 札幌 Vol.3
2015/3/14 札幌 Vol.4
2015/6/4 札幌 Vol.5
2015/10/...
kintoneCafé?
現在17支部で
活動しています
kintone??
kintone??
kintone??
kintoneって?
サイボウズ株式会社が提供する
業務改革クラウドサービス
kintone??
何ができるの?
専門知識なしに業務用
アプリが作れます
kintone??
時間は?
簡易なものなら3分です
「俺コーヒー入れてくるからその間に作っておいてねw?」
なんて言われても・・・
できちゃいます
出典:kintone公式サイト
kintone??
プログラム経験ないよ?
ノンプログラムで作れます
・業務で利用しているExcelから
・サイボウズのアプリストアから
・マウスのドラッグ&ドロップから
kintone??
画面をちょっと変えたい?
カスタマイズ対応可能です
・REST APIを利用した連携
・JavaScript/CSSでカスタマイズ
・プラグインを利用したカスタマイズ
kintone??
ワークフロー・・・無理?
標準機能で備わってます
・交通費申請などに
・日報管理などに
kintone??
イメージがちょっとつかめない?
ハンズオンで実際に体験してみましょう!!
今日の目標
参加者の皆様が
後でハンズオン資料を見直すだけで
・Excelからkintoneのアプリを作成できる
・サンプルのJavaScriptの設定方法を体験できる
ハンズオン開始
それではハンズオン開始です
アプリの追加
案件管理_Cafe新潟Vol3.csvをダウンロード
アプリの追加
まずはここを選択
アプリの追加
今回は、Excel/CSVから作成
アプリの追加
参照をクリック
ダウンロードしておいた「案件管理_Cafe新潟Vol3.csv 」を選択
アプリの追加
「アプリ名を変更」をクリック
好きな名前に変更
アプリの追加
「アプリ名を変更」をクリック
好きな名前に変更
アプリの追加
アプリ名が変更される
アプリの追加
CSVのデータもとに自動でフィールドが設定される
アプリの追加
フィールドタイプを変更
アプリの追加
作成をクリック
アプリの追加
作成されたアプリをクリック
アプリの追加
アプリにCSVデータは保存済み
アプリの追加
一番左のアイコンをクリック
アプリの追加
詳細画面が表示される
アプリの追加
一番右のアイコンをクリック
アプリの追加
フォームの編集をクリック
アプリの追加
フィールドをドラッグで移動
アプリの追加
保存をクリック
アプリの追加
設定完了をクリック
アプリの追加
一番左のアイコンをクリック
アプリの追加
ドラッグしたフィールドが反映
アプリの追加
新規・編集・複製することも可能
アプリの追加
まずはここを選択
アプリの追加
今回は、テンプレートから作成
アプリの追加
アプリを作成するをクリック
アプリの追加
作成されたアプリをクリック
アプリの追加
データが何もないことを確認
アプリの追加
+(レコードを追加する)をクリック
アプリの追加
アプリの追加
キャンセルをクリック
アプリの追加
URLの番号を保持
ポータルをクリック
アプリをJavaScriptで
カスタマイズしてみよう
JavaScriptの追加
と、その前にちょっと下準備
JavaScriptの追加
JavaScriptの追加
jsファイルをダウンロード
URLをコピー
JavaScriptの追加
先ほど保持したURLの番号に変更
JavaScriptの追加
CSVから作成した案件管理アプリをクリック
一番右のアイコンをクリック
JavaScriptの追加
フォームの編集をクリック
JavaScriptの追加
JavaScriptの追加
会社名の歯車をクリック
設定をクリック
JavaScriptの追加
保存をクリック
フィールドコードをフィールド名と同じにする
JavaScriptの追加
保存をクリック
すべての項目のフィールドコードをフィールド
名と同じにする
JavaScriptの追加
JavaScript / CSSでカスタマイズをクリック
JavaScriptの追加
URL指定で追加をクリック
JavaScriptの追加
ポータルでコピーしたURLを張り付けて保存をクリック
JavaScriptの追加
アップロードして追加をクリック
ポータルでダウンロードしたjsファイルを指定
JavaScriptの追加
保存をクリック
JavaScriptの追加
保存をクリック
カスタマイズの結果を
見てみましょう!
JavaScriptの追加
一番左のアイコンをクリック
JavaScriptの追加
JavaScriptの追加
受注確定ボタンが表示される
JavaScriptの追加
受注確定ボタンをクリック
JavaScriptの追加
登録完了のメッセージが表示
JavaScriptの追加
レコードが追加
JavaScriptの追加
一番左のアイコンをクリック
JavaScriptの追加
情報が登録されている
ハンズオンは以上となります
おしまい
ちょっとカスタマイズ例を
カスタマイズ
kintoneでシフト管理が
できちゃうんです
カスタマイズ
kintone標準のカレンダー
カスタマイズ
標準機能では若干苦手
・日付をまたいだ表現が苦手
・時間単位表現も苦手
カスタマイズ
カスタマイズカレンダー
カスタマイズ
時間表現もできちゃう
カスタマイズ
アプリ作りを楽しみ
カスタマイズを楽しみ
kintoneを楽しみましょう!
カスタマイズ
Upcoming SlideShare
Loading in …5
×

kintone Café 新潟 Vol.3 ハンズオン(アプリ作成編)

585 views

Published on

kintone Café 新潟 Vol.3 ハンズオン(アプリ作成編)の資料です。

Published in: Software
  • Be the first to comment

  • Be the first to like this

kintone Café 新潟 Vol.3 ハンズオン(アプリ作成編)

  1. 1. kintoneって聞いたことあるぞ!? ならアプリを作成してみよう! ハンズオン(アプリ作成編) (株)アイティー・プラス・ワン kintoneエバンジェリスト 星野智久 2016年2月6日 kintone Café 新潟 Vol.3
  2. 2. 自己紹介 去年は、プライベートで枝豆の収穫イベ ントに参加したら、なぜかkintoneを導 入してもらえることになりました。 株式会社アイティー・プラス・ワン 星野 智久(愛称は・・・のんびん、ブルー)31歳 新潟県長岡市(旧川口町)出身 サイボウズ公認kintoneエバンジェリスト kintoneCafé新潟支部長もしています
  3. 3. kintoneCafé?? kintoneCafé??
  4. 4. kintoneCafé? kintone Caféは、まだkintoneに触れたことの無い方から、 より高度なカスタマイズを行いたいと考えているプロ フェッショナルの方まで幅広い層を対象に、 楽しく学び・ 教え合うことで、kintoneの魅力や活用法をみんなで共有 するための勉強会コミュニティです。
  5. 5. kintoneCafé? 5 2013/12/7 札幌 Vol.1(起源) 2014/5/16 札幌 Vol.2 2014/10/25 札幌 Vol.3 2015/3/14 札幌 Vol.4 2015/6/4 札幌 Vol.5 2015/10/17 札幌 Vol.6 2015/11/30 札幌 Vol.7 2014/5/29 福岡 Vol.1 2014/7/11 福岡 Vol.2 2014/10/24 福岡 Vol.3 2015/4/17 福岡 Vol.4 2015/6/24 福岡 Vol.5 2015/8/29 福岡 Vol.6 2015/10/24 福岡 Vol.7 2015/12/19 福岡 Vol.8 2014/5/30 土佐 2015/5/30 高知 Vol.2 2014/7/5 弘前 #1 2015/1/29 京橋 Vol.1 2015/4/6 京橋 Vol.2 2014/8/1 千葉(第1回) 2014/9/3 千葉(第2回) 2014/12/12 千葉(第3回) 2014/8/21 横浜 Vol.1 2014/8/11 釧路 2014/9/12 松江 #1 2014/9/2 Seoul #1 2014/9/24 松山 #1 2015/9/26 愛媛 Vol.1 2016/1 愛媛 Vol.2 2014/9/25 神戸 Vol.1 2015/5/25 神戸 Vol.2 2014/9/28 Okinawa #1 2015/2/11 沖縄 Vol.2 2015/10/10 沖縄 Vol.3 2014/10/22 京都 #1 Korea 3ヶ国 19都道府県 65回開催!※2015/11/19現在 2014/11/21 北九州 Vol.1 2014/12/3 @chiba みずいろ会館※女性限定 2015/1/30 新潟 Vol.1 2015/7/4 新潟 Vol.2 2014/12/15 八王子 Vol.1 2015/2/19 八王子 Vol.2 kintone Café 創始者です! 2015/1/24 仙台 Vol.1 2015/3/7 仙台 Vol.2 2015/4/4 仙台 Vol.3 2014/12/11 荻窪 Vol.1 2015/1/26 荻窪 Vol.2 2014/7/23 東京 Vol.1 2015/2/20 東京 Vol.2 2015/7/24 東京 Vol.3 2015/9/4 東京 Vol.4 2015/2/13 出雲 Vol.1 2015/3/4 大阪 Vol.1 2015/5/19 大阪 Vol.2 2015/7/15 大阪 Vol.3 2015/9/18 大阪 Vol.4 2015/11/20 大阪 Vol.5 2015/6/17 名古屋 Vol.1 2015/11/13 名古屋 Vol.2 2015/6/25大分 Vol.1 2015/12/5大分 Vol.2 2015/9/29 鹿児島 Vol.1 2015/11/26 鹿児島 Vol.2 札幌支部・運営事務局 斎藤 栄 USA 2015/10/6 Grand Canyon Vol.1 2015/11/28 熊本 Vol.1
  6. 6. kintoneCafé? 現在17支部で 活動しています
  7. 7. kintone?? kintone??
  8. 8. kintone?? kintoneって? サイボウズ株式会社が提供する 業務改革クラウドサービス
  9. 9. kintone?? 何ができるの? 専門知識なしに業務用 アプリが作れます
  10. 10. kintone?? 時間は? 簡易なものなら3分です 「俺コーヒー入れてくるからその間に作っておいてねw?」 なんて言われても・・・ できちゃいます 出典:kintone公式サイト
  11. 11. kintone?? プログラム経験ないよ? ノンプログラムで作れます ・業務で利用しているExcelから ・サイボウズのアプリストアから ・マウスのドラッグ&ドロップから
  12. 12. kintone?? 画面をちょっと変えたい? カスタマイズ対応可能です ・REST APIを利用した連携 ・JavaScript/CSSでカスタマイズ ・プラグインを利用したカスタマイズ
  13. 13. kintone?? ワークフロー・・・無理? 標準機能で備わってます ・交通費申請などに ・日報管理などに
  14. 14. kintone?? イメージがちょっとつかめない? ハンズオンで実際に体験してみましょう!!
  15. 15. 今日の目標 参加者の皆様が 後でハンズオン資料を見直すだけで ・Excelからkintoneのアプリを作成できる ・サンプルのJavaScriptの設定方法を体験できる
  16. 16. ハンズオン開始 それではハンズオン開始です
  17. 17. アプリの追加 案件管理_Cafe新潟Vol3.csvをダウンロード
  18. 18. アプリの追加 まずはここを選択
  19. 19. アプリの追加 今回は、Excel/CSVから作成
  20. 20. アプリの追加 参照をクリック ダウンロードしておいた「案件管理_Cafe新潟Vol3.csv 」を選択
  21. 21. アプリの追加 「アプリ名を変更」をクリック 好きな名前に変更
  22. 22. アプリの追加 「アプリ名を変更」をクリック 好きな名前に変更
  23. 23. アプリの追加 アプリ名が変更される
  24. 24. アプリの追加 CSVのデータもとに自動でフィールドが設定される
  25. 25. アプリの追加 フィールドタイプを変更
  26. 26. アプリの追加 作成をクリック
  27. 27. アプリの追加 作成されたアプリをクリック
  28. 28. アプリの追加 アプリにCSVデータは保存済み
  29. 29. アプリの追加 一番左のアイコンをクリック
  30. 30. アプリの追加 詳細画面が表示される
  31. 31. アプリの追加 一番右のアイコンをクリック
  32. 32. アプリの追加 フォームの編集をクリック
  33. 33. アプリの追加 フィールドをドラッグで移動
  34. 34. アプリの追加 保存をクリック
  35. 35. アプリの追加 設定完了をクリック
  36. 36. アプリの追加 一番左のアイコンをクリック
  37. 37. アプリの追加 ドラッグしたフィールドが反映
  38. 38. アプリの追加 新規・編集・複製することも可能
  39. 39. アプリの追加 まずはここを選択
  40. 40. アプリの追加 今回は、テンプレートから作成
  41. 41. アプリの追加 アプリを作成するをクリック
  42. 42. アプリの追加 作成されたアプリをクリック
  43. 43. アプリの追加 データが何もないことを確認
  44. 44. アプリの追加 +(レコードを追加する)をクリック
  45. 45. アプリの追加
  46. 46. アプリの追加 キャンセルをクリック
  47. 47. アプリの追加 URLの番号を保持 ポータルをクリック
  48. 48. アプリをJavaScriptで カスタマイズしてみよう JavaScriptの追加
  49. 49. と、その前にちょっと下準備 JavaScriptの追加
  50. 50. JavaScriptの追加 jsファイルをダウンロード URLをコピー
  51. 51. JavaScriptの追加 先ほど保持したURLの番号に変更
  52. 52. JavaScriptの追加 CSVから作成した案件管理アプリをクリック
  53. 53. 一番右のアイコンをクリック JavaScriptの追加
  54. 54. フォームの編集をクリック JavaScriptの追加
  55. 55. JavaScriptの追加 会社名の歯車をクリック 設定をクリック
  56. 56. JavaScriptの追加 保存をクリック フィールドコードをフィールド名と同じにする
  57. 57. JavaScriptの追加 保存をクリック すべての項目のフィールドコードをフィールド 名と同じにする
  58. 58. JavaScriptの追加 JavaScript / CSSでカスタマイズをクリック
  59. 59. JavaScriptの追加 URL指定で追加をクリック
  60. 60. JavaScriptの追加 ポータルでコピーしたURLを張り付けて保存をクリック
  61. 61. JavaScriptの追加 アップロードして追加をクリック ポータルでダウンロードしたjsファイルを指定
  62. 62. JavaScriptの追加 保存をクリック
  63. 63. JavaScriptの追加 保存をクリック
  64. 64. カスタマイズの結果を 見てみましょう! JavaScriptの追加
  65. 65. 一番左のアイコンをクリック JavaScriptの追加
  66. 66. JavaScriptの追加 受注確定ボタンが表示される
  67. 67. JavaScriptの追加 受注確定ボタンをクリック
  68. 68. JavaScriptの追加 登録完了のメッセージが表示
  69. 69. JavaScriptの追加 レコードが追加
  70. 70. JavaScriptの追加 一番左のアイコンをクリック
  71. 71. JavaScriptの追加 情報が登録されている
  72. 72. ハンズオンは以上となります おしまい
  73. 73. ちょっとカスタマイズ例を カスタマイズ
  74. 74. kintoneでシフト管理が できちゃうんです カスタマイズ
  75. 75. kintone標準のカレンダー カスタマイズ
  76. 76. 標準機能では若干苦手 ・日付をまたいだ表現が苦手 ・時間単位表現も苦手 カスタマイズ
  77. 77. カスタマイズカレンダー カスタマイズ
  78. 78. 時間表現もできちゃう カスタマイズ
  79. 79. アプリ作りを楽しみ カスタマイズを楽しみ kintoneを楽しみましょう! カスタマイズ

×