IBM Dojo #5 AI (Watson API) アプリ開発 on OpenShift / IBM Dojo AI on OpenShift 20200212

2020年2月12日開催のIBM Dojo #5 AI (Watson API) アプリ開発 on OpenShiftの資料です。
2020/02/12 23:17更新　間違い修正、Appendix追加

Transcript

1. 冬のIBM Dojo #5 AI(Watson API) アプリ開発+ App on OpenShift Kyoko Nishito Developer Advocate Tokyo City Team
2. Kyoko Nishito IBM Developer Advocate 2 KyokoNishito
3. 本⽇のタイムテーブル 14:00-14:05 (5min) オープニング 資料ダウンロード,出席登録など 14:05-15:00 (55min) AI (Watson API) <座学+DEMO> 15:00-16:30 (90min) AI (Watson API) + App on OpenShift コードチャレンジ <ワークショップ> 16:30-17:00 (30min) クローズ
4. 本⽇の資料 本⽇の資料はこちらからPCにダウンロードお願いし ます。URLをクリックしたり、コマンドをコピペしたりでき ますので、サイトでみるのではなく、ダウンロードをお勧めし ます。(connpassの資料にもリンクあり) http://ibm.biz/dojo20200212doc
5. 出席登録 こちらのURLにアクセスして、IBM Cloudにログイン お願いします。 アカウント未登録の⽅もこちらから登録お願いします。 https://ibm.biz/dojo0212
6. ハンズオン事前準備 https://ibm.box.com/v/20200212DojoPrep 1. IBM Cloudアカウントの取得 2. IBM Cloud CLIのインストール 3. Node.jsのインストール 4. Gitのインストール 5. VS Codeなどコードエディタ 詳細は
7. 学習の⽬的とゴール ⽬的 WatsonとWatson APIの概要について理解する ゴール Watson APIを利⽤したアプリケーションを作成できる このコースを学ぶ⽅の想定スキル 何かしらのプログラミング経験があり、Watson APIを初めて 利⽤する⽅
8. 本⽇の説明内容 1. AI & IBM Watson 2. Watson API 3. Watson APIの使い⽅ (DEMO) 4. まとめ 5. コードチャレンジ
9. 1. AI & IBM Watson
10. ⼈⼯知能(AI)は ⼈間の知能のはたらきを模倣し, 機械(技術)で実現した能⼒です。 10
11. ⼈間の知能の例 Human Intelligence 11 計画 学習 創造性 問題解決 推論 知覚 操作
13. Watson APIサービス⼀覧 2019年3⽉現在 Watson Assistant アプリケーションに⾃然⾔語インターフェースを追加して エンドユーザとのやり取りを⾃動化 Text to Speech テキスト⽂章を⾳声に変換する Speech to Text ⾳声をテキスト⽂章に変換する Visual Recognition 画像コンテンツに含まれる意味を検出する Discovery 先進的な洞察エンジンを利⽤して、デー タの隠れた価値を解明し、回答やトレン ドを発⾒する Discovery News Discovery上に実装され、エンリッチ情報 も付加されたニュースに関する公開デー タセット Personality Insights テキストから筆者の性格を推定する Language Translator テキストを他⾔語へ翻訳を⾏う Natural Language Understanding ⾃然⾔語処理を通じてキーワード抽出、エン ティティー抽出、概念タグ付け、関係抽出な どを⾏う Natural Language Classifier テキスト⽂章の分類を⾏う(質問の意図推定など) Tone Analyzer(⽇本語未対応) テキストから筆者の感情、社交性、⽂体を解析 Knowledge Studio コーディングなしに、業務知識から⽣成した 機械学習モデルで、⾮構造テキストデータか ら洞察を取得(学習⽀援ツール) ⼼理系 ⾔語系 照会応答系 知識探索系 ⾳声系 画像系 https://www.ibm.com/watson/jp-ja/developercloud/services-catalog.html
14. • データにラベルをつけたりDeep Learningのモデルを⼤量データで学習させるのは ⾮常に労⼒がかかります。企業は⼤量のデータを持つがラベル付けされているデー タは多くはなく、また学習のための仕組みを持っていません。 • すでに多くの企業がWatsonを業務に活⽤しており、顧客体験の向上や専⾨家の ワークの効率化や新しいビジネスモデルや戦略の開発を実現しています。 • 社内の様々なシステムと連携しフルトランザクションに対応 • 顧客が選べるよう複数チャネルを展開 • 双⽅向のデジタルコミュニケーション • 少ないデータでも効率的に学習できるというWatsonのアドバンテージ • ①ラベルのないデータからの学習 • ②コンセプトからの学習 • ③誤りからの学習 • ④学習の仕⽅についての学習 • Watsonはテクノロジーをシンプルなものとして企業にお届けし、AIを企業全体に スケールして活⽤することを⽀援します Trends & Directions: Put AI to Work @think2019
15. Cloud上で使えるAIサービス ・・・ Internet PC Azure AWS GCP IBM Cloud Smart Phone Server 各社クラウド Direct Link
16. 16 Watson APIの特徴 • ネットワーク経由でアクセス • REST形式のインターフェイス • Java, Python, Node.jsなどに対応した APIライブラリ(SDK) • https://github.com/watson-developer-cloud
17. 17 Watson APIの特徴 • ネットワーク経由でアクセス • REST形式のインターフェイス • Java, Python, Node.jsなどに対応した APIライブラリ(SDK) • https://github.com/watson-developer-cloud
18. 18 Watson API REST形式のインターフェース ・・・ HTTP Request GET POST PC HTTP Response JSON JSON Azure AWS GCP IBM Cloud Smart Phone Server 各社クラウド
19. RESTインターフェースの例 19 クライアント https://gateway.watsonplatform.net /language- translator/api/v3/translate URL: https://gateway.watsonplatform.net/ language-translator/api/v3/translate メソッド: POST {"text":["Hello"], "model_id":"en-ja"} {"text":["Hello"], "model_id":"en-ja"} JSON ②対応する 処理 APIサービス {"text":["Hello"], "model_id":"en-ja"} JSON { "translations" : [ { "translation" : "ハロー" } ], "word_count" : 1, "character_count" : 5 } ①リクエスト 送信 ③レスポンス 送信
20. 20 Watson APIの特徴 • ネットワーク経由でアクセス • REST形式のインターフェイス • Java, Python, Node.jsなどに対応した APIライブラリ(SDK) • https://github.com/watson-developer-cloud
21. IBM の データ & AI プラットフォーム インフラ ストラクチャー インダストリー プラット フォーム Security Services Any SaaS Insurance Industrial Public & Comms Any AI Watson OpenScale Block- chain IoT Watson Studio Watson Machine Learning Watson Knowledge Catalog Watson API RedHat OpenShift Any Cloud AWS, Azure… Cloud Integration SW(Cloud Pak) Banking & Financial Markets Any Hardware IBM Systems Z, P IBM Cloud VMware SAP Cloud Native Distribution Cloud Pak for Data Any Tool ハイブリッド、マルチクラウドに対応し、オープンなAI活⽤を実現
22. 2. Watson API
23. Watson APIサービス一覧 2019年3⽉現在 Watson Assistant アプリケーションに⾃然⾔語インターフェースを追加して エンドユーザとのやり取りを⾃動化 Text to Speech テキスト⽂章を⾳声に変換する Speech to Text ⾳声をテキスト⽂章に変換する Visual Recognition 画像コンテンツに含まれる意味を検出する Discovery 先進的な洞察エンジンを利⽤して、デー タの隠れた価値を解明し、回答やトレン ドを発⾒する Discovery News Discovery上に実装され、エンリッチ情報 も付加されたニュースに関する公開デー タセット Personality Insights テキストから筆者の性格を推定する Language Translator テキストを他⾔語へ翻訳を⾏う Natural Language Understanding ⾃然⾔語処理を通じてキーワード抽出、エン ティティー抽出、概念タグ付け、関係抽出な どを⾏う Natural Language Classifier テキスト⽂章の分類を⾏う(質問の意図推定など) Tone Analyzer(⽇本語未対応) テキストから筆者の感情、社交性、⽂体を解析 Knowledge Studio コーディングなしに、業務知識から⽣成した 機械学習モデルで、⾮構造テキストデータか ら洞察を取得(学習⽀援ツール) ⼼理系 ⾔語系 照会応答系 知識探索系 ⾳声系 画像系 https://www.ibm.com/watson/jp-ja/developercloud/services-catalog.html
24. Watson APIサービス一覧 2019年3⽉現在 Watson Assistant アプリケーションに⾃然⾔語インターフェースを追加して エンドユーザとのやり取りを⾃動化 Text to Speech テキスト⽂章を⾳声に変換する Speech to Text ⾳声をテキスト⽂章に変換する Visual Recognition 画像コンテンツに含まれる意味を検出する Discovery 先進的な洞察エンジンを利⽤して、デー タの隠れた価値を解明し、回答やトレン ドを発⾒する Discovery News Discovery上に実装され、エンリッチ情報 も付加されたニュースに関する公開デー タセット Personality Insights テキストから筆者の性格を推定する Language Translator テキストを他⾔語へ翻訳を⾏う Natural Language Understanding ⾃然⾔語処理を通じてキーワード抽出、エン ティティー抽出、概念タグ付け、関係抽出な どを⾏う Natural Language Classifier テキスト⽂章の分類を⾏う(質問の意図推定など) Tone Analyzer(⽇本語未対応) テキストから筆者の感情、社交性、⽂体を解析 Knowledge Studio コーディングなしに、業務知識から⽣成した 機械学習モデルで、⾮構造テキストデータか ら洞察を取得(学習⽀援ツール) ⼼理系 ⾔語系 照会応答系 知識探索系 ⾳声系 画像系 https://www.ibm.com/watson/jp-ja/developercloud/services-catalog.html
25. Watson Assistant 25 ü チャットボットのような対 話アプリケーションの開発 に最適 ü 会話フローをグラフィカル に開発できるツールを提供 ü 作成した会話フローをAPIで 呼び出し Watson: こんにち はシステムサポー トです。何かお困 りですか︖ User: 交通費精算シ ステムだよ。 エンティティー: システム Value: 交通費精算システム Watson: 何のシス テムにログインで きないのですか︖ User: ログインでき ないよ 意図: ログイン不可 Watson:交通費精 算システムにログ インできない場合 のチェック項⽬の URLを送ります http://xxx 交通費精算システムのログイ ン不可にに関する情報を検索 色々な言い回し “ログインエラーになる” “ログインが失敗するけど” 色々な言い回し “交通費のやつ” “精算システム” Webツールで インテント、 エンティ ティー、 会話フロー を作成可能 https://www.ibm.com/watson/jp- ja/developercloud/conversation.html
26. DEMO 26 DOC ID / Month XX, 2018 / © 2018 IBM Corporation Watsonを使⽤したLINE chat bot
27. 参考情報 27 LINEチャットボットとWatsonを連携する https://medium.com/@taiponrock/line%E3%83 %81%E3%83%A3%E3%83%83%E3%83%88% E3%83%9C%E3%83%83%E3%83%88%E3%81 %A8watson%E3%82%92%E9%80%A3%E6%90 %BA%E3%81%99%E3%82%8B-8a7d89a49e57 10分で解説︕ Watson Assistantでチャットボットを開発する https://www.youtube.com/watch?v=ZRwsu4OXLeE
28. Natural Language Understanding (NLU) üテキストを分析し、概念、エンティ ティー、キーワード、カテゴリー、 感情、関係、意味役割などのメタ データを抽出※ ü事前学習済みであり、学習なしで解 析結果を取得 抽出できるもの • エンティティ(Entities) • 関係(Relations) • 概念(Concepts) • キーワード(Keywords) • 評判 (Sentiment) • 感情 (Emotion) ※ • カテゴリー(Categories) • 構⽂解析(Semantic Roles) ※ 感情分析(Emotion)は⽇本語には対応していません https://www.ibm.com/watson/services/natural-language- understanding/
29. DEMO 29 https://dte-nlu-demo.mybluemix.net/self-service/home 今⽇のニュースからメタデータを抽出してみます
30. üWatsonを利⽤した⽂書検索 エンジン ü膨⼤なテキストデータを取 り込み、NLUで解析、検索に 利⽤ ü⾃然⾔語でも検索できる (またはDiscovery Query Language(DQL)) Discovery https://www.ibm.com/watson/jp-ja/developercloud/discovery.html
31. Discovery News üDiscoveryのインスタンスを作成すると、世界各地のニュー ス記事を保持している、事前作成済み読み取り専⽤コレク ション Discovery News がすぐに使える状態になります。 ・データ登録の必要なしにすぐに使える ・IBM選定の10万のニュースソース ・1⽇当たり30万件以上の記事(⽇本語記事は１⽇あたり17,000件)
32. DEMO 32 気になるニュースを検索してみましょう︕ https://discovery-news-demo.ng.bluemix.net/
33. 33 Visual Recognition • 画像認識「⼀般種別」(General Tagging): • 事前学習済みの分類器の出⼒を返します • 画像認識「カスタム」: • 識別を⾏いたいクラスのイメージを事前学習させ、その 分類器の出⼒を返します。 事前学習 不要 事前学習 必要 https://www.ibm.com/watson/jp-ja/developercloud/visual-recognition.html
34. DEMO 34 後ほどの「コードチャレンジ」で実際に作成できます
35. DOC ID / Month XX, 2018 / © 2018 IBM Corporation Text to Speech テキスト⽂章を⾳声に変換する https://text-to-speech-demo.ng.bluemix.net DEMO
36. DOC ID / Month XX, 2018 / © 2018 IBM Corporation Speech to Text ⾳声をテキスト⽂章に変換する https://www.ibm.com/watson/jp-ja/developercloud/speech-to-text.html Language Translator ⾃然⾔語テキストについて他⾔語へ翻訳を⾏う Natural Language Classifier テキスト⽂章の分類を⾏う(質問の意図推定など) https://www.ibm.com/watson/jp-ja/developercloud/language-translator.html https://www.ibm.com/watson/jp-ja/developercloud/nl-classifier.html
37. 37 © 2018 IBM Corporation Personality Insights テキストから筆者の性格を推定する https://www.ibm.com/watson/jp-ja/developercloud/personality-insights.html DEMO https://personality-insights-demo.ng.bluemix.net/
38. 38 © 2018 IBM Corporation Tone Analyzer(⽇本語未対応) テキストから筆者の感情、社交性、⽂体を 解析する https://tone-analyzer-demo.ng.bluemix.net/
39. 3. Watson APIの使い⽅ (DEMO) ここからDEMOになります。 事前準備がお済みの⽅は⼀緒にやってみましょう︕
40. Watson APIの使い⽅の基本 40 1. IBM Cloudにログインして必要なサービスを作成 今回はLanguage Translator を使います。 2. 作成したサービスの資格情報である API KEY(API鍵)、URLを取得 3. 取得したAPI KEY、URLを指定してAPIを呼び出す APIの詳細はこちらから確認 https://cloud.ibm.com/apidocs
41. Watson APIの使い⽅の基本 41 1. IBM Cloudにログインして必要なサービスを作成 今回はLanguage Translator を使います。 2. 作成したサービスの資格情報である API KEY(API鍵)、URLを取得 3. 取得したAPI KEY、URLを指定してAPIを呼び出す APIの詳細はこちらから確認 https://cloud.ibm.com/apidocs
42. 本イベントでは、 IBM Cloud へのアクセスは上記URLから行ってください • IBM Cloud ログイン アカウントをすでにお持ちの方は、 こちらからログインしてください • IBM Cloud ライトアカウント作成 アカウントをお持ちでない方は、 ご登録をお願いします 【本⽇のお願い】 1. IBM Cloudにログイン︕ DEMO 本イベント以外では https://cloud.ibm.com/login からログイン可能です https://ibm.biz/dojo0212
43. 2. 「カタログ」をクリック 43 DEMO
44. 44 3. 左側のメニューから 「AI」をクリック DEMO
45. 45 3. スクロールして使いたいWatsonサービスを クリック 今回は Language Translator をクリックしてください。 DEMO
46. 46 4. 地域とプランを選んだら「作成」をクリック DEMO
47. 47 5. 下記のような画⾯に変わったら作成完了! DEMO
48. Watson APIの使い⽅の基本 48 1. IBM Cloudにログインして必要なサービスを作成 今回はLanguage Translator を使います。 2. 作成したサービスの資格情報である API KEY(API鍵)、URLを取得 3. 取得したAPI KEY、URLを指定してAPIを呼び出す APIの詳細はこちらから確認 https://cloud.ibm.com/apidocs
49. 49 1. 左側のメニューから「管理」をクリック DEMO
50. 50 資格情報にあるAPI KEYとURLをテキストファイルなどにコピーします。 このアイコンで コピーできます ２. API鍵(＝API KEY), URLをコピー DEMO
51. 51 1 HINT: よくわからない画⾯になった場合 IBM Cloud→リソースの表⽰→Services→表⽰させたいサービス名 2 3 4
52. Watson APIの使い⽅の基本 52 1. IBM Cloudにログインして必要なサービスを作成 今回はLanguage Translator を使います。 2. 作成したサービスの資格情報である API KEY(API鍵)、URLを取得 3. 取得したAPI KEY、URLを指定してAPIを呼び出す APIの詳細はこちらから確認 https://cloud.ibm.com/apidocs
53. 53 APIの詳細はこちらから確認 https://cloud.ibm.com/apidocs 1. まずはAPIの使い⽅を確認 クリック DEMO
54. 54 2. 今回はNodeを使うのでNodeのタブを確認 他の⾔語の SDKから使 う場合は対 応する⾔語 をクリック します DEMO
55. 55 3. Translateの使い⽅を確認 DEMO
56. 56 4-1: ターミナル または コマンドウィンドウを開きます。 4-2: 以下のコマンドでディレクトリを作成し、作成したディ レクトリに移動します。($は⼊⼒しないでください) 4. サンプルコード実⾏ DEMO $ mkdir translate $ cd translate 4-3:ターミナル または コマンドウィンドウはそのままにして、 エディター(VSCode, メモ帳(windows), vi(Mac)など)を開き ます。
57. 57 4-4: APIドキュメントにあるExample requestのコードをコ ピーします。 url: https://cloud.ibm.com/apidocs/language-translator?code=node#translate 4. サンプルコード実⾏ DEMO
58. 58 4-5: コピーしたコードを開いているエディターにペーストし ます。 4. サンプルコードの実⾏ DEMO
59. 59 4-6: 7⾏⽬: {apikey}を2でコピーしたAPI鍵で置き換えます。 4. サンプルコードの実⾏ DEMO 4-7: 9⾏⽬: {url}を2でコピーしたURLで置き換えます。
60. 60 4-8: 4-2で作成したディレクトリに translate.js という名前で保存します。 4. サンプルコードの実⾏ DEMO
61. 61 4-9: APIドキュメントIntroductionにあるInstallationのコード をコピーします。 url: https://cloud.ibm.com/apidocs/language-translator?code=node#introduction 4. サンプルコードの実⾏ DEMO このアイコン でコピー できます
62. 62 4-10: 先ほど開いたターミナル または コマンドウィンドウに 戻り、コピーしたコマンドをペーストし実⾏します。 4. サンプルコードの実⾏ DEMO $ npm install ibm-watson@^5.1.0 4-11: 以下のコマンドでtranslate.jsを 実⾏します。 $ node translate.js Macで権限エラーが発⽣する場合は、先頭に sudo をつけて実⾏してください。 sudo npm install ibm-watson@^5.1.0
63. 63 4-12: 実⾏結果は確認できましたか︖ 英語のHelloがスペイン語のHolaに変換されています。 4. サンプルコードの実⾏ DEMO サンプルコード 結果
64. 64 translate.jsを修正し、13⾏⽬のtextを適当な⽇本語の⽂章に、 model_idを'ja-en'にして保存し、実⾏してみましょう。 4. [オプション]サンプルコードの実⾏ A. 翻訳⾔語の変更 DEMO サンプルコード 結果 https://cloud.ibm.com/docs/services/language-translator?topic=language-translator-translation-models 使⽤可能なmodel_idはこちら: $ node translate.js 以下をのコマンドを実⾏
65. 65 サービスのAPI KEY, URLが取得できる管理画⾯から ibm-credentials.env というAPI KEYとURLが⼊っているファ イルがダウンロードできます。 これを以下のいずれかに置くと、コード内でAPI KEYとURLの 記述が不要です。 • 環境変数IBM_CREDENTIALS_FILEで指定したPATH • システムのhome directory • プログラムの実⾏directory(working directory) 4. [オプション]サンプルコードの実⾏ B. Credentials fileの使⽤ DEMO
66. 66 4B-1: この資料の46ページ、 44­15ページを参照して、 Language Translationサービス の管理画⾯を表⽰します。 資格情報の「ダウンロード」をク リックし、4-2で作成したディレ クトリにibm-credentials.env と いうファイルを保存します。 4. [オプション]サンプルコードの実⾏ B. Credentials fileの使⽤ DEMO
67. 67 4B-2: translate.jsを修正し、 IamAuthenticatorの定義をしている2⾏⽬と、APIKEYとURL を指定している6⾏⽬から9⾏⽬部分を//でコメントアウトし、保存します。 4. [オプション]サンプルコードの実⾏ B. Credentials fileの使⽤ DEMO 修正前: 修正後:
68. 68 実⾏します。 4. [オプション]サンプルコードの実⾏ B. Credentials fileの使⽤ DEMO 4B-3: 以下のコマンドでtranslation.jsを 実⾏します。 $ node translation.js ソースでAPIKEY、URLしてしなくとも、 ibm-credentials.env から読み込まれ正しく実⾏できることを確認します。
69. まとめ Watsonはビジネスで使いやすいAIサービス いろいろなサービスがAPIで呼び出せる SDKで簡単に実装可能
70. おすすめ情報 今すぐ使えるWatson API／サービス⼀覧 https://www.ibm.com/watson/jp-ja/developercloud/services-catalog.html チュートリアル Watson APIを使うための前準備: サービスの作成と資格情報の取得 https://qiita.com/nishikyon/items/9b8f697db7ad0a693839 Watson Visual Recognition カスタムクラスを作ろう! https://qiita.com/nishikyon/items/7d1c07e2f50c1002e815 IBM Code Patterns - アプリ開発パターン集 http://ibm.biz/ibmcodejp
71. コードチャレンジ: AI (Watson API+Openshift)
72. ベーシックチャレンジ 1. 事前準備を完了しましょう http://ibm.biz/dojo20200212doc この資料: https://ibm.box.com/v/20200212DojoPrep 2. 先ほど実施の「 3. Watson APIの使い⽅ 」を完了しましょう
73. IBM Watson Visual Recognitionを使った node.jsの画像認識Webアプリの作成 https://github.com/kyokonishito/watson-vr-node • IBM CloudのCloud Foundry環境にDeployします • 「 2. Visual Recognition サービスの作成」の「6.(オプション) カスタ ム分類クラスの作成」はオプションです。とりあえず⾶ばして実施し、 時間があればチャレンジしてみてください。 メインチャレンジ
74. IBM CloudのCloud Foundry アプリケーションはクレジットカードを登録したPAYGアカウントの場合、動かし たまま1ヶ⽉経過すると課⾦対象になります。またライトアカウントの場合は最⼤256Mまでしかメモリが使⽤ できませんので、新しいアプリケーションを動かしたい場合は、使っていないアプリケーションを停⽌しないと 動かない場合があります。 必要に応じてアプリケーションを停⽌お願いします。 停⽌の⽅法はこちら: IBM Cloud: Cloud Foundry アプリケーションの停⽌・開始 https://qiita.com/nishikyon/items/3356db8bb4c1524517be メインチャレンジ:補⾜
75. メインチャレンジ IBM Watson Visual Recognitionを使った node.jsの画像認識Webアプリ https://github.com/kyokonishito/watson-vr-node をOpenShiftで動かしてみよう! • メインチャレンジを完了していなくとも実施可能 OpenShift チャレンジ
76. 操作の流れ 1. ワークショップ⽤の環境へのIBM Cloud ID関連付け 2. OpenShiftをコマンド実⾏できる環境の準備 3. Visual Recognitionサービスの作成(メインチャレンジ未 実施の⽅のみ) 4. 資格情報のダウンロード 5. 資格情報のアップロード 6. 資格情報の編集 7. OpenShiftアプリの作成
77. 1. ワークショップ⽤のIBM Cloud環境にご⾃⾝の IBM Cloud IDを関連付ける 注意事項 ・ブラウザはFirefoxをご利⽤ください ・本ワークショップ⽤のIBM Cloud環境はセミナー開催⽇を 含めて約3⽇間限定でお使いいただけます ・IBM Cloud上で継続的にOpenShiftを検証する環境が 必要な場合は、5-1. OpenShiftをご利⽤ください ・ローカルでOpenShiftを検証する環境を構築されたい場合は、 Appendix. Minishiftをご利⽤ください
78. 1.1: 下記URLにFirefoxブラウザでアクセスする https://ostokyo.mybluemix.net/ 1.2: [Lab Key] 、[Your IBMid]にご⾃⾝のIDを ⼊⼒し、チェックボックスにチェックを⼊れて [Submit]をクリックする Lab Keyは 講師にお尋ねください
79. 1.3: Congratulations! が表⽰されたら [1. Log in IBM Cloud] リンクをクリックする
80. 1.5: IBM Cloudダッシュボードの右上のアカウント情報の 右横の v をクリックする 1.6:[xxxxxxx – IBM] をクリックする
81. 1.7: IBM Cloudダッシュボードの右上のアカウント情報が 変更されたことを確認し、[リソースの要約]の [Clusters]をクリックする
82. 1.8: Clustersの下の⾚枠部分(下図参照)をクリックする ※本ワークショップではこちらのクラスタを使⽤します ※名前は⾃動的に割り当てられます
83. 1.9: [OpenShift Webコンソール]ボタンをクリックします。
84. 1.10: [OpenShift Container Platform]画⾯が表⽰されたら 右上のアカウント情報の隣の v をクリックし、 [Copy Login Command]を選択する ※後ほど使⽤する為、必要に応じてメモしておいてください
85. 2.2: メニューバーからIBM Cloud Shellのアイコンをクリック 2. OpenShiftをコマンド実⾏できる環境の準備 2.1: IBM Cloudのダッシュボードを表⽰
86. 2.: しばらくするとターミナルが表⽰される
87. 2.4: 前章1.10でコピーしたコマンドを⼊⼒し実⾏する 2.5: 「Welcome!」が表⽰されればログイン成功です
88. 3. Visual Recognitionサービスの作成 Visual Recognitionを新規に作成する⽅は次のページに進んでください。 既に以前に作成済みの⽅は、作成済みのものが使⽤できます。 作成済みの⽅は以下の⼿順を参照しVisual Recognitionの管理の画⾯を表⽰後、 http://ibm.biz/watson-service-screen 当資料「4. Visual Recognitionサービスibm-credentials.env のダウンロード」まで進んでく ださい。 ブラウザー上で、新しいタブを開きます。 https://cloud.ibm.com/ にアクセスして、ダッシュボードを開きます。 XXXXXXX – IBM ではなく⾃分のアカウントになっていることを確認し、異なっ ている場合はクリックして変更します
89. 3.1 上部のメニューにある「カタログ」をクリックします
90. 3.2 Visual Recognitionサービスの選択 1. 左側のメニューから「AI」をクリック 2. 下にスクロールして表⽰された「Visual Recognition」をクリック
91. 価格プランに「ライト」が選択されていることを確認して、 「作成」をクリック 3.3 Visual Recognitionサービスを作成する
92. 3.4 Visual Recognitionサービスを作成確認、管理画⾯の表⽰ 下の画⾯が出たら、作成完了です。 左のメニューから「管理」をクリックして管理画⾯を表⽰します
93. 資格情報の「ダウンロード」を クリックし、⾃分のPCに ibm-credentials.env という ファイルを保存します。 4. Visual Recognitionサービス ibm-credentials.env のダウンロード
94. 5. ibm-credentials.env のアップロード 5.1. ブラウザーのIBM Cloud Shell for Workshopのタブ をクリックして表⽰します。
95. 5. ibm-credentials.env のアップロード 5.2. メニューバーのアップロードアイコンをクリック、 ibm-credentials.envを指定してアップロード
96. 5. ibm-credentials.env のアップロード 5.3 ファイルアップロードを確認 ls ターミナルに下記コマンドを⼊⼒し、確認します。 出⼒例: 尚、今後のコマンドは以下からコピペできます https://ibm.box.com/v/openshift-101-command
97. 6.1. プロジェクトを作成する oc new-project watson-vr --display-name="watson-vr" -- description="Sample Watson Visual Recognition Node.js app" ターミナルに下記コマンドを⼊⼒し、新しいアプリケーション⽤に新しい プロジェクトを作成します。 (コマンドは１⾏です。コマンドは以下からコピペできます。 https://ibm.box.com/v/openshift-101-command) 6. Openshift アプリの作成 出⼒例:
98. 6.2. アプリケーションの作成 ターミナルに下記のコマンドを⼊⼒し、 githubのソースコードから、アプ リケーションを作成します。 (コマンドは１⾏です) oc new-app https://github.com/kyokonishito/watson-vr-node.git --build-env-file=./ibm-credentials.env --build-env CLASSIFIER_ID=food 6. OpenShiftアプリの作成
99. 6.2. アプリケーションの作成 出⼒例: 6. OpenShiftアプリの作成
100. 6.3 ビルドログを表⽰します oc logs -f bc/watson-vr-node ターミナルに下記のコマンドを⼊⼒しビルドログを表⽰し、 「 Push successful 」で終わるまで待ちます。 6.4 ロードバランサーのサービスを作成します oc expose dc watson-vr-node --port=3000 --type=LoadBalancer -- name=watson-vr-node-ingress ターミナルに下記のコマンドを⼊⼒し実⾏します。(コマンドは１⾏です) 6. OpenShiftアプリの作成
101. 6.5. ロードバランサーのサービスを公開します oc expose service watson-vr-node-ingress ターミナルに下記のコマンドを⼊⼒し実⾏します。 6. OpenShiftアプリの作成 これで完了です!ターミナルに下記のコマンドを⼊⼒し実⾏し、その結果を 参照して、OpenShift で実⾏されているアプリケーションにアクセスでき ます。 oc get route/watson-vr-node-ingress NAME HOST/PORT PATH SERVICES PORT TERMINATION WILDCARD watson-vr-node-ingress watson-vr-node-ingress-watson-vr.openshifttokyo17-0e3e0ef4c9c6d831e8aa6fe01f33bfc4-0002.jp- tok.containers.appdomain.cloud watson-vr-node-ingress 3000 None 以下のような出⼒があった場合は、 watson-vr-node-ingress-watson-vr.openshifttokyo17-0e3e0ef4c9c6d831e8aa6fe01f33bfc4-0002.jp- tok.containers.appdomain.cloud にブラウザでアクセスします。
102. 6.6 ブラウザーでアプリケーションにアクセスします アプリケーションは表⽰できましたか? ボタンを押して動作確認してみましょう! 「ファイルの選択」から写真を選んだ後、各⻘ボタンを クリックして、Visual Recognitionの結果を確認します。 • Watsonで認識（Watson学習済みモデルを利⽤): • Watsonが写真を認識した内容を表⽰します。 • Watsonで認識（カスタムモデルを利⽤): • IBM提供の⾷品に特化したカスタムモデルFoodで認識し たクラスを表⽰します。 ※スマートフォンでの確認 ⼀番下にQRコードが表⽰されているので、それをスマートフォ ンのカメラで読んでアプリケーションのURLにアクセすると、ス マートフォンでも結果を確認できます。 スマートフォンでは「ファイルの選択」ボタンでその場で撮った 写真も認識可能です。
103. [オプション] ブラウザーでOpenShift Web Consoleに アクセスして作成したアプリを確認 1/2(1.10で開いたWeb画⾯ です) ←View Allをクリック 下にスクロールすると watson-vr プロジェクト があるので、クリックし ます。
104. [オプション] ブラウザーでOpenShift Web Consoleに アクセスして作成したアプリを確認 1/1 ←このあたりをいろいろクリックすると情報が⾒れます ↑ここもクリックするといろいろ情報が⾒れます
105. IBM Code Patterns https://ibm.biz/ibmcodejp 解説 + デモ動画 + ソースコードが揃ったアプリ開発パターン集
106. 開発者向けサイト IBM Developer ibm.biz/IBMDevJP 最新情報やスキルアップに役⽴つ6,000を超える技術記事を提供
107. Appendix: Minishift とは • OpenShiftは、Kubernetesに、Red Hat社独⾃の拡張を加え、さらに、 Red Hatのソフトウェア保守とウェブや電話での問い合わせ対応 サービスを提供する企業向けKubernetesのプラットフォーム • OpenShiftは、Red Hat社が提供する有償サービス(サブスクリプション) のもとで利⽤できるソフトウェア • OpenShiftの学習やローカルの開発環境⽤に無償で提供されるのが、 Minishift (OpenShift 3.11に相当) 「MiniShiftに関する疑問の整理、「 Dockerから⼊るKubernetes」執筆打明け話とか、OKDやCRCとの整理など」 https://qiita.com/MahoTakara/items/3c1c208640518e832660 より抜粋
108. Appendix: Minishift ワークショップ 101 (オプション) Setup 1 「仮想化環境を構成する」の⽇本語版はこちら」 • Windows: ibm.biz/Bdz39H • Mac: ibm.biz/Bdz39E Setup 2 MinishiftのインストールおよびOpenShiftサーバーを開始し、 Lab1から順番に進める。 ibm.biz/openshift1