Tweet
Tweet

Slide 1

Slide 1 text

Functions × OutSystems FaaSはやっぱり便利︖ Taiji (Eddie) Hagino Lead Community Manager, DevRel @ OutSystems

Slide 2

Slide 2 text

Taiji (Eddie) Hagino @taiponrock Please follow me! My books for programming: “Hajimete-no Node-RED”, “Node-RED Katsuyo Manual” (工学社) “Practical Node-RED Programming” (Packt Publishing), etc. My books for developer relations: “Developer Marketing DevRel Q&A”, “Developer’s Career Book with English” (Impress R&D), etc. Lecturer, University of Tsukuba Lead Community Manager, DevRel Team APAC (Japan, Philippines, Thailand, China, Korea, Australia, New Zealand)

Slide 3

Slide 3 text

3 What You’ll Learn Here 1. OutSystems 2. IBM Cloud Functions 3. Build Sample App with OutSystems & Functions 4. Conclusion

Slide 4

Slide 4 text

OutSystems 4

Slide 5

Slide 5 text

コーディングする理由 アプリを作るにはコード書かなきゃでしょ？ みんなコーディングしてるよね？ 他にどうやってアプリ作るの？ 5

Slide 6

Slide 6 text

Software is handcrafted

Slide 7

Slide 7 text

AUTOMATION

Slide 8

Slide 8 text

Low-Code/No-Code 開発: レガシーソフトウェア開発: • 開発に時間がかかる • 運用保守にも高いコストが必要 • 気軽に仕様変更できない • 手離れが悪い（コード解釈が必要） • 迅速でアジャイルな開発 • 高い生産性 • 変更や保守が比較的容易 • 複雑なコードが無いので可読性が良い

Slide 9

Slide 9 text

9 65% 35% ローコード開発 w/Low-Code Only Legacy “65% of all software development will include low-code by 2024” https://timitsolutions.com/65-of-application-development-activity-will-be-low-code-by-2024-gartner/ https://www.gartner.com/en/documents/3956079/magic-quadrant-for-enterprise-low-code-application-platf

Slide 10

Slide 10 text

Welcome to the Low-Code World!

Slide 11

Slide 11 text

Why use Office Tools? Write Document Calculate with Table Design Presentation Material W E P

Slide 12

Slide 12 text

Why Use Low-Code tools? アプリ開発をより生産的にするため？ イノベーションに集中するため？ 12 コードやモジュールの抽象化 生産性の向上 パーツの共通化 エラー発生率の低下

Slide 13

Slide 13 text

● コーディングが不要 (拡張コードも書けます) ● データモデル作成にDDL/DMLは不要 ● Reactive Web App や Mobile App がかん たんに作成可能 OutSystems 13

Slide 14

Slide 14 text

IBM Cloud Functions

Slide 15

Slide 15 text

15 サーバーレス・コンピューティング（Serverless computing） とは、クラウド・プロバイダーがアプリケーションに必要なマ シン・リソースの割り当てを動的に管理し、事前に購入された ことに基づく請求ではなく、各アプリケーション要求を満たす ために使用される個々のリソース量に基づいた請求を行うよう なクラウド・コンピューティングの実行モデルである。 Serverless, Function as a Service

Slide 16

Slide 16 text

16 ● コードを書き、それを連携させるだけで一連の処理を実行できる ● 実行に必要なサーバーリソースが自動的に割り当てられる ● スケールアップ/アウトが必要に応じて自動的に行われる ● 実行が終了すると自動的にインスタンスが消去されるため、課金はコードが動いてい た時間だけになる ● さまざまなサービスをコード起動のトリガーとして利用でき、定期的、あるいは何ら かのイベントを起点にサービスを起動できる なぜFaaSを使うのか？

Slide 17

Slide 17 text

17 ● 実行環境はベンダー管理なので個別にチューニングの余地が無い ● 提供ベンダーに依存するが、対応しているプログラミング言語が限定的 ● 原則設計思想がFunction/Action、つまり個の関数の集合体となるので、コールバック の処理に対する考慮が必要 FaaS利用のデメリット

Slide 18

Slide 18 text

18 IBM Cloud FunctionsはIBMが提供するFaaS (Serverless)のサービスです。 オープンソースの Apache OpenWhisk (*1) を使っているので、OpenWhiskと同じ操作で扱 うことが可能です。 OpenWhiskは、Dockerコンテナを使用してインフラストラクチャ、サーバ、スケーリングを 管理するため、効率的なアプリケーションの構築が可能です。 *1 https://openwhisk.apache.org/ IBM Cloud Functionsについて

Slide 19

Slide 19 text

Build Sample App with OutSystems & Functions

Slide 20

Slide 20 text

Functionsで サーバー処理を作成

Slide 21

Slide 21 text

21 IBM Cloudへログインし、Functionsメニューへアクセス ※IBM CloudアカウントはライトアカウントでOKです

Slide 22

Slide 22 text

22 FunctionsでActionを作成 Start Creatingボタンをクリック Actionを選択

Slide 23

Slide 23 text

23 Action Nameに 「Get Customer Ingo」 と入力 RuntimeはNode.js 12を選択 Createボタンをクリック FunctionsでActionを作成

Slide 24

Slide 24 text

24 Actionを実装 Codeを以下のように書き換える（値は講師の情報になってるのでご自身の情報で置き換えてください） Invokeをクリックし、値が正常に返されることを確認

Slide 25

Slide 25 text

25 Web Actionを有効可 Web Actionボタンをク リックし、Enable as Web Actionにチェック を入れる PublicのHTTPメソッド のURLをコピーする

Slide 26

Slide 26 text

26 Web Actionを有効可 Web Actionボタンをク リックし、Enable as Web Actionにチェック を入れる PublicのHTTPメソッド のURLをコピーする

Slide 27

Slide 27 text

27 Actionのチェック ブラウザからコピーし たURLへアクセスして 値が正常に返されるこ とを確認 ※ URLのみでうまく表 示されない場合は URLの末尾に”.json” を付けて実施して下 さい

Slide 28

Slide 28 text

OutSystemsで フロントエンドを作成

Slide 29

Slide 29 text

29 アカウント作成（クレジットカード不要・無料） https://outsyste.ms/icfesta2021w OutSystemsのアカウント・開発環境を作成

Slide 30

Slide 30 text

30 名前、メールアドレス、アカウントログイン用 パスワードを設定し 「Agree and Start Free」ボタンをクリック

Slide 31

Slide 31 text

31 必要項目を設定し 「Download our development tool and continue」ボタンをクリック ※ この後、OutSystemsクラウドの画面が開き ますが、並行してアカウント登録確認のメール が届きます。

Slide 32

Slide 32 text

32 届いたメールを確認し、表示されている 「Confirm your email address」ボタン をクリック

Slide 33

Slide 33 text

33 OutSystemsクラウドの画 面より、OutSystemsの IDEであるService Studio をダウンロードする

Slide 34

Slide 34 text

34 Service Studioを起動

Slide 35

Slide 35 text

35 New Application を選択 From scratchを選 択 Phone App を選択 任意のアプ リ名を入力 してCreate Appボタンを クリック

Slide 36

Slide 36 text

36 Create Moduleボタンをクリック Screenをワークスペースへドラッグ

Slide 37

Slide 37 text

Emptyを選択して Create Screen ボタン をクリック

Slide 38

Slide 38 text

ButtonをScreenのContent エリアへドラッグ ボタンが配置されるので表 示文言を修正 ここでは「データ取得」と した

Slide 39

Slide 39 text

Text AreaをScreenの Contentエリアへドラッ グ テキストボックスが配置 される

Slide 40

Slide 40 text

配置されたテキストボッ クスのプロパティが Service Studioの右下へ 表示されるのでVariable からNew Local Variable を選択 TextVarというオブジェ クトが作成されるので、 これをTextNameへリネ ーム Text Lines（テキストボ ックスの高さ）はデフォ ルトだと3行分になって るので、これを1に変更

Slide 41

Slide 41 text

同じ要領でText Areaをもう2つ配置し、それぞれ TextTeamとTextRoleとする さらに、Labelを3つ配置して、図のようにレイアウ トする

Slide 42

Slide 42 text

Logicタブに移動し、Integrations配下のRESTを右クリックし 、Consume REST API を選択 Add single method を選択し、Continueボタンをクリック

Slide 43

Slide 43 text

Method URLに、IBM Cloud Functionsで 作成したREST APIのURLを入力 MethodはGETを選択（デフォルト） Testボタンをクリックすると、ペーストし たURLが呼び出され、結果がResponse test resultエリアへ出力される 正しく結果が返されているのを確認して、 Copy to response bodyボタンをクリック

Slide 44

Slide 44 text

Bodyタブへ自動で切り替わり、Response エリアにAPIの結果値が設定される Finishボタンをクリック LogicタブのRESTの下にメソッドが作成さ れていることを確認

Slide 45

Slide 45 text

Screen上に配置したデータ取得ボタンをダブルクリックして、ボタンクリック時の処理を実装 処理フロー画面が表示されるので、先程作成したREST呼び出しのメソッドをドラッグ

Slide 46

Slide 46 text

配置したメソッドとEndの間に、Assignをドラッグ Assignのプロパティで、VariableにTextNameを選択し、Valueでは Expression Editorを選択 Expression EditorでNameをダブルクリックするとValueエリアに値がセ ットされるので、Closeボタンをクリック

Slide 47

Slide 47 text

同じ手順で、Assignをもう2つ追加 し、それぞれTextTeamとTextRole がセットされるように設定する これでOutSystemsでのアプリ作成 は完了なので、① Publishボタンを クリック ボタンが青色のOpen in browserに 変わったら再度クリック

Slide 48

Slide 48 text

ブラウザ上にスマホのエミュレー ターが表示され、作成したアプリ がロードされるので、データ取得 ボタンをクリックしてデータが正 しく表示されることを確認

Slide 49

Slide 49 text

Conclusion 49

Slide 50

Slide 50 text

基幹系システム 情報系システム 外部API Functions Front-end Server-side Internal Cloud Low-Code Pro-Code FaaS

Slide 51

Slide 51 text

● Low-Codeはビジュアルプログラミングとしてクイ ックに確実にUIを作成 ● Low-Codeでは実装しづらい処理は、FaaSを上手 く活用してコーディング ● 稼働した分だけ課金されるFaaSは処理のHubとし て使うと便利 51 Low-CodeとFaaSを上手 に活用しよう

Slide 52

Slide 52 text

Thanks! Taiji (Eddie) Hagino Lead Community Manager, DevRel Team APAC (Japan, Philippines, Thailand) 52 @taiponrock Please follow me!

Slide 53

Slide 53 text

ワークショップ、セッション、および資料は、OutSystemsまたはセッション発表者によって準備され、それぞれ独自の見解 を反映したものです。それらは情報提供の目的のみで提供されており、いかなる参加者に対しても法律的またはその他の指 導や助言を意図したものではなく、またそのような結果を生むものでもありません。本講演資料に含まれている情報につい ては、完全性と正確性を期するよう努力しましたが、「現状のまま」提供され、明示または暗示にかかわらずいかなる保証 も伴わないものとします。本講演資料またはその他の資料の使用によって、あるいはその他の関連によって、いかなる損害 が生じた場合も、OutSystemsは責任を負わないものとします。 本講演資料に含まれている内容は、OutSystemsまたはその サプライヤーやライセンス交付者からいかなる保証または表明を引きだすことを意図したものでも、OutSystems製品の使用 を規定する適用ライセンス契約の条項を変更することを意図したものでもなく、またそのような結果を生むものでもありま せん。 本講演資料でOutSystems製品、プログラム、またはサービスに言及していても、OutSystemsが営業活動を行っているすべ ての国でそれらが使用可能であることを暗示するものではありません。本講演資料で言及している製品リリース日付や製品 機能は、市場機会またはその他の要因に基づいてOutSystems独自の決定権をもっていつでも変更できるものとし、いかなる 方法においても将来の製品または機能が使用可能になると確約することを意図したものではありません。本講演資料に含ま れている内容は、参加者が開始する活動によって特定の販売、売上高の向上、またはその他の結果が生じると述べる、また は暗示することを意図したものでも、またそのような結果を生むものでもありません。 ユーザーが経験する実際のスループ ットやパフォーマンスは、ユーザーが有する数多くの要因に応じて変化します。したがって、個々のユーザーがここで述べ られているものと同様の結果を得られると確約するものではありません。 記述されているすべてのお客様事例は、それらのお客様がどのようにOutSystems製品を使用したか、またそれらのお客様が 達成した結果の実例として示されたものです。実際の環境コストおよびパフォーマンス特性は、お客様ごとに異なる場合が あります。 OutSystems、OutSystems ロゴ、outsystems.comは、 OutSystemsの商標です。他の製品名およびサービス名等は、それ ぞれOutSystemsまたは各社の商標である場合があります。