Sencha & Delphi Ready Study https://connpass.com/event/66896/

1. Delphi開発者のためのSencha入門
2017.09.26 at Sencha & Delphi Ready Study
@shinobukawano, Sales Engineer of Sencha, Inc.

2. Sencha Ext JS って知っていますか？
1. 使ったことがある
2. 名前は聞いたことがある
3. 知らない、聞いたことがない
4. 晩ご飯何食べよう

3. 2009年当時、最先端だったJavaScriptライブラリです。

4. あっ… （察し）

5. ダメそうに見えますよね？

6. 実は、世界中の多くの企業システムを支えています！
ソフトウェア
自動車
政府機関
金融サービス
医療
メディア
エンターテイメント
コンピュータ
情報通信
運輸
ゲーム

7. こんなアプリが作れます！
そう、Senchaならね。

8. 自己紹介
川野 忍
Sales Engineer at Sencha, Inc.
Twitter: @shinobukawano
GitHub: @shinobukawano

9. 本日のアジェンダ
1. Sencha 製品概要
2. Delphiとの類似点、相違点
3. 開発デモ
4. 参考リソース

10. Sencha 製品概要

11. Sencha, Inc. (2007年設立, Redwood City, CA, USA)
エンバカデロ親会社のアイデラが、Senchaを買収
エンバカデロへの統合により開発ツールビジネスを強化

12. Senchaを利用しない場合、何が起こるのでしょうか

13. 81%が3年以上、さらに48%が5年以上メンテナンスしていると回答
企業のアプリケーションは長期間メンテナンスされる

14. minifyjs Concat UglifyJS
各種ライブラリの選定、組み合わせ、保守 …

16. データ集約型・クロスプラットフォームの
エンタープライズWebアプリケーションを
迅速に開発するために必要な全てを提供

17. 機能 ライブラリやツールを組み合わせて独自の基盤を構築する場合
アーキテクチャ Ext JS
UI部品 Over 200 UI components built-in
レイアウト Built-in
テーマ Built-in
パッケージ管理 Sencha Cmd
ビルド Sencha Cmd
テスト
Sencha Test (Q4)
Sencha Inspector
デプロイ
Sencha Cmd
Sencha Web Application Manager
サポート
Sencha Support Team
Sencha Professional Services Team
トレーニング
Sencha Training Team
Official training partners worldwide
ExtJS
単純なCSS
結合, 圧縮、最適化
第三者からの支援
第三者からの支援

18. Ext JS – JavaScript によるクロスプラットフォームアプリ開発
• データ集約型のクロスプラットフォーム
アプリケーションのための包括的な
フレームワーク
• 幅広いブラウザのサポート
• しっかりとテストされたカスタマイズ
可能なUI部品のセット –
より迅速な開発と高度なユーザー
エクスペリエンスの向上のために設計

21. 魅力的な外観のWebアプリの迅速な設計
Ext JS Stencils Architect
• ワイヤフレームとモックアップを迅速に作成
• デザイナーと開発者の協業の改善
• Adobe Illustrator、Sketch、Omnigraffle、
Balsamiq 用の完全なUIアセットキット
SVG/PNGとしても利用可能
• 手作業によるコーディングの削減
• 完全な機能を持つアプリケーションの開発が可能
• 既存のテンプレートもしくは独自に作成した
テンプレートの利用

22. 開発者の生産性向上のためのエンタープライズツール
IDE & エディタプラグイン
• コード生成、補完
• コード分析、リファクタリング
Cmd – ビルドの最適化
• 開発タスクの自動化
• ビルドの生成と最適化
Inspector – デバッグ支援
• ソースコードのデバッグ
• 性能問題の特定
Themer – テーマ作成
• GUIによるテーマ作成
• リアルタイムのテーマ生成

23. • 長年の経験を結集した
Ext JS アプリのための完全で
統合されたテストプラットフォーム
• Ext JSとの深い統合により、
テスト作成の高速化と高精度化
• 複数ブラウザでのテストの同時実行
• 既存のテストともシームレスに連携
• WebDriverとの統合により、
複数ページのアプリケーションの
テストを高速化 - ユーザーの動作を模倣
Sencha Test - Ext JSアプリの単体・機能テストの最善のソリューション

24. Senchaサポート
• 遠隔でのトラブルシューティング
• 次のメジャーリリースへの無料アップグレード
• 顧客のバグ修正への早期アクセス
• 夜間開発ビルドへのアクセス
• プレミアムフォーラム
“Senchaは商用のバックアップ
体制を持ち、開発した会社に
よって完全にサポートされてい
る唯一のフレームワークです。
問題がある場合は、責任の所在
を明らかにできます”
- 「 Sencha 投資のビジネスケース」より:
実際のお客様のROI分析
テクニカルエキスパートへのアクセスを提供

25. データ集約型
複雑なデータを
どのようなソースからも取得し
分析、可視化、操作
単一のコーディング方式
個性的な”JavaScriptファースト”
方式により、業務系Webアプリ
固有の複雑さを軽減
オール・イン・ワン
115種類以上の良く設計され
テストされ文書化されたUI部品と
企業向けの堅牢なツール群
エンタープライズ品質のサポート
世界規模でのトレーニングや
コンサルティング・サービス、
技術サポートと製品の保守
Senchaの4つの特長

26. Sencha製品体系
Standard、Pro、Premiumの3パターン
エディションによって含まれる
モジュールが異なります。

27. Delphiとの類似点、相違点

28. ごめんなさい、私、Delphiのこと良く分かりません。

29. こういうところが似ているのではなかろうか。
1. クロスプラットフォームのアプリ開発ツール
（ネイティブとHTML5というアプローチの大きな違いはある）
2. コンポーネントモデル
3. ビジュアル開発ができる
4. 商用製品で企業のサポートがある
5. 栄光の過去（涙）

30. 開発デモ

31. Sencha Architect + RAD Server の連携！

32. Sencha Architect + RAD Server の連携！

33. 参考リソース

34. Sencha Ext JS、使ってみたくなりましたか？

36. “Ext JSの開発者になるには絶好の時期です！”
"It is a great time to be an
Ext JS developer" by
Atanas Popov - GM, Dev
Tools, IDERA
https://www.sencha.com/
blog/it-is-a-great-time-
to-be-an-ext-js-
developer/

37. 試してみる。
1) 評価版のダウンロード
https://www.sencha.com/products/extjs/evaluate/
2) インストール手順（日本語）
https://www.sencha.com/forum/showthread.php?321249
3) チュートリアル（日本語）
http://shinobukawano.com/2016/09/modern-tutorial/
4) Awesome ExtJS
https://github.com/abenhamdine/awesome-extjs

38. App Camp （ハンズオンセミナー）に参加する。
1) 申し込みページ - 次回は10月16日（月）13時 – 17時
https://reg.canon-its.co.jp/public/seminar/view/572
2) 研修資料
http://se.sencha.com/appcamps/AppCamp6Japan

39. uniGUI という選択肢も …
http://www.unigui.com/

40. “Software is eating the world”
ソフトウェアは世界を食べている
- Marc Andreessen

41. ありがとうございました！
Twitter: @shinobukawano
Email: shinobu.kawano@sencha.com