Salesforce Platform Mobile Serviceを使ったアプリ開発Sep 6, 2013
#forcedotcomjp
Safe HarborSafe harbor statement under the Private Securities Litigation Reform Act of 1995:
This presentation may contain forward-looking statements that involve risks, uncertainties, and assumptions. If any such uncertainties materialize or if any of the assumptions proves incorrect, the results of salesforce.com, inc. could differ materially from the results expressed or implied by the forward-looking statements we make. All statements other than statements of historical fact could be deemed forward-looking, including any projections of product or service availability, subscriber growth, earnings, revenues, or other financial items and any statements regarding strategies or plans of management for future operations, statements of belief, any statements concerning new, planned, or upgraded services or technology developments and customer contracts or use of our services.
The risks and uncertainties referred to above include – but are not limited to – risks associated with developing and delivering new functionality for our service, new products and services, our new business model, our past operating losses, possible fluctuations in our operating results and rate of growth, interruptions or delays in our Web hosting, breach of our security measures, the outcome of intellectual property and other litigation, risks associated with possible mergers and acquisitions, the immature market in which we operate, our relatively limited operating history, our ability to expand, retain, and motivate our employees and manage our growth, new releases of our service and successful customer deployment, our limited history reselling non-salesforce.com products, and utilization and selling to larger enterprise customers. Further information on potential factors that could affect the financial results of salesforce.com, inc. is included in our annual report on Form 10-Q for the most recent fiscal quarter ended July 31, 2012. This documents and others containing important disclosures are available on the SEC Filings section of the Investor Information section of our Web site.
Any unreleased services or features referenced in this or other presentations, press releases or public statements are not currently available and may not be delivered on time or at all. Customers who purchase our services should make the purchase decisions based upon features that are currently available. Salesforce.com, inc. assumes no obligation and does not intend to update these forward-looking statements.
#forcedotcomjp
Speakers
Kazuhiko ImamuraSales Support Engineer@KAZU_200WR
Masashi TsujiSales Support Engineer@h2z
#forcedotcomjp
Developer Force Japanを是非フォロー下さい
Developer Force Japan
+Developer Force Japan
DeveloperForce Japan
@developerforcej / #forcedotcomjp
#forcedotcomjp
Salesforce Platform Mobile Services 概要
Mobile Packs を使ったVFページ作成
Mobile Design Templates を使ったVFページ作成
Mobile SDK 2.0 getting started
Mobile SDK 2.0 を使った hybrid アプリ作成
Agenda
Demo
Demo
Demo
Demo
#forcedotcomjp
http://www2.developerforce.com/ja/mobile
Salesforce Platform Mobile Services 概要
salesforce platform mobile services
#forcedotcomjp
Trust Customer Data
Business Logic Identity Offline Social Analytics APIGeolocation
Mobile SDKs Mobile Packs Mobile Design Templates
Salesforce Platform Mobile Services 概要Salesforce Platform Mobile Serviceにより、顧客データに接続されたエンタープライズモバイルアプリケーションを最小限の工数で開発することが可能に。あらゆるデバイスに対応したアプリケーション開発に必要なツール, フレームワーク, APIを提供します。
#forcedotcomjp
Trust Customer Data
Business Logic Identity Offline Social Analytics APIGeolocation
Mobile SDKs Mobile Packs Mobile Design Templates
本セッションで扱うMobile ServicesSalesforce Platform Mobile Serviceにより、顧客データに接続されたエンタープライズモバイルアプリケーションを最小限の工数で開発することが可能に。あらゆるデバイスに対応したアプリケーション開発に必要なツール, フレームワーク, APIを提供します。
#forcedotcomjp
モバイルアプリ開発のパターンとMobile Services
iOSやAndroidなどのデバイスネイティブなプログラムでアプリケーションを作成する例 :
HTML5とデバイスのプログラムを使い分けてアプリケーション作成する例:
ブラウザベースでスマートフォンやタブレット向けのWebアプリケーションを作成する
Mobile Design Templates を使ったVFページ作成
Mobile SDKs
Mobile Packs
Mobile Design Templates
Mobile Packs を使ったVFページ作成
Mobile SDK 2.0 getting started Mobile SDK 2.0 を使った hybrid アプリ作成
Demo
モバイルアプリ開発パターン
デモのお題: Geolocationを使うアプリ
#forcedotcomjp
Mobile Packs Visualforce及びMobile SDKハイブリッドアプリケーションを作成するの為のジャンプスタート
モダンなJavascriptフレームワークを使ったサンプル
Force.com以外のプラットフォームにもデプロイ可能 (例 : Heroku)
クイックスタート & チュートリアル
http://www2.developerforce.com/mobile/services/mobile-packs (英語)
#forcedotcomjp
DemoMobile Packs を使ったVFページ作成
#forcedotcomjp
Mobile Design Templates ビジネスの典型的なMicro-Momentシナリオに対応する、20以上のアプリケーションのHTML5/CSSデザインテンプレート
モバイル向けの UI/UX を実現することができる、カスタマイズ可能なオープンソースのCSS3とHTML5のマークアップ
JavaScript(ForceTKやBackbone,Angular,Knockout のMobile Packs)と組み合わせることで、Salesforceのバックエンドとライブデータバインディングを提供
標準 / カスタムオブジェクト対応
クロスプラットフォーム対応(HTML5、CSS3やJavaScriptのような標準的なWeb技術を利用)
#forcedotcomjp
DemoMobile Design Templates を使ったVFページ作成
#forcedotcomjp
Salesforce Mobile SDK 2.0
Touch Platform
Cloud Application Platform
Multi-tenant Cloud Database Identity
Apache Cordova (PhoneGap) ベース
ユーザ管理 , 認証 (SAML2 ,OAuth2)
オフラインデータの格納
(ネイティブアプリ)REST APIのラッパー
(ハイブリッドアプリ)アプリケーションコンテナ
‒ iOS ,Android
‒ プッシュ通知(ロードマップ)
#forcedotcomjp
Mobile SDK 2.0 getting started for iOS 準備
‒ 環境• OS X “Lion”以上• Xcode 4.5以上
‒ Mobile SDK 2.0• npmからインストール
Getting Started with iOS Hybridhttp://www2.developerforce.com/ja/mobile/getting-started/ios#hybrid
#forcedotcomjp
プロジェクトの作成 (1)
対話型で作成
$ forceios create
Enter your application type (native, hybrid_remote, or hybrid_local): hybrid_local
Enter your application name: SampleApp
Enter your company identifier (com.mycompany): com.mycompany
Enter your organization name (Acme, Inc.): MyCompany
Enter the output directory for your app (defaults to the current directory): .
Enter your Connected App ID (defaults to the sample app's ID): sample_app
Enter your Connected App Callback URI (defaults to the sample app's URI): sfdc://success
#forcedotcomjp
プロジェクトの作成 (2)
コマンドで一気にパラメータを指定
$ forceios create \
--apptype="hybrid_local" \
--appname="SampleApp" \
--companyid="com.developerforce.jp.devcon.bo1" \
--organization="DevCon2013" \
--outputdir=. \
--appid="sample_app" \
--callbackuri="sfdc://success"
#forcedotcomjp
Demo:3force.com側の設定 ~ プロジェクト作成 ~ 実行
#forcedotcomjp
ハイブリッドアプリケーションの作成お題:日本の駅を検索するアプリケーション
駅名、路線名で検索が可能駅名、路線名をリスト表示
検索結果を地図に表示
現現在地から近いものを優先
検索結果に現在地からの距離を表示
元データは駅データ.jpを使用 (http://www.ekidata.jp/)
UIはtwitter bootstrap を適用
現現在地から近いものを優先
#forcedotcomjp
ハイブリッドアプリケーションの作成お題:日本の駅を検索するアプリケーション
駅名、路線名で検索が可能駅名、路線名をリスト表示
検索結果を地図に表示
現現在地から近いものを優先
検索結果に現在地からの距離を表示
元データは駅データ.jpを使用 (http://www.ekidata.jp/)
UIはtwitter bootstrap を適用
現現在地から近いものを優先
技術要素•Mobile SDK 2.0 for iOS (Hybrid)•駅データはSalesforce上 (カスタムオブジェクト Station__c)
•データの取得にはSmartSync Data Frameworkを利用
#forcedotcomjp
SmartSync Data Frameworkについて
Mobile SDK 2.0のHybridアプリケーションに含まれるJavaScriptライブラリ
Backbone.jp (http://backbonejs.org/) を継承している‒ Backbone.Model => Force.SObject
‒ Backbone.Collection => Force.SObjectCollection
オフラインキャッシュに対応‒ SmartStoreを利用している
#forcedotcomjp
ディレクトリ構造
編集を行うのはほぼ www 内のみ 利用する html は index.htmlのみ 主な処理は js/index.js 認証関連は js/salesforce_oauth.js backbone.js や underscore.js といったサードパーティーのJavaScript は lib/の中
#forcedotcomjp
FastClickについて
物理タップしてからクリックイベントが発生するまでの約300msの遅延を回避するたに使用されるライブラリ
約300msでダブルタップとシングルタップを区別 touchstartイベントをclickイベントとして発行 詳しくは https://github.com/ftlabs/fastclick を参照 FastClickデモhttp://ftlabs.github.io/fastclick/examples/layer.html
#forcedotcomjp
Demo:4Hybrid アプリ作成
#forcedotcomjp
GitHub(DeveloperForceJapan)にて公開しましたhttps://github.com/DeveloperForceJapan/StationSearch
Demo:4Hybrid アプリ作成
#forcedotcomjp
まとめ どのserviceを使っても大抵のことはできるので、用途に合わせて使いましょう‒ VFで、得意なJavaScript フレームワークを使って開発をしたい! => Mobile Packs‒ 業務に利用するアプリのイメージがTemplateのものと近い! => Mobile Templates‒ アプリケーションとして配布したい! => Mobile SDKでハイブリッド or Native開発
デモを作成した感想‒ Mobile Packs
• force.com開発を始める開発者がとりあえず使ってみると、外部ライブラリの使い方や forceTKの使い方などよい勉強になると思います。
‒ Mobile Template• 少ないコーディングで機能を持ったモバイルに最適化されたページを作ることができるので便利でした。
‒ Mobile SDK 2.0を使ったハイブリット開発• backbone.js 好きにはたまらないです。• 前のバージョンとあまり変わっていない様に見えるけど、実際にそんなに変わってないです。
#forcedotcomjp
まとめ
※SmartSync が使える様になったのと、いろいろシンプルになって使いやすくなってます
どのserviceを使っても大抵のことはできるので、用途に合わせて使いましょう‒ VFで、得意なJavaScript フレームワークを使って開発をしたい! => Mobile Packs‒ 業務に利用するアプリのイメージがTemplateのものと近い! => Mobile Templates‒ アプリケーションとして配布したい! => Mobile SDKでハイブリッド or Native開発
デモを作成した感想‒ Mobile Packs
• force.com開発を始める開発者がとりあえず使ってみると、外部ライブラリの使い方や forceTKの使い方などよい勉強になると思います。
‒ Mobile Template• 少ないコーディングで機能を持ったモバイルに最適化されたページを作ることができるので便利でした。
‒ Mobile SDK 2.0を使ったハイブリット開発• backbone.js 好きにはたまらないです。• 前のバージョンとあまり変わっていない様に見えるけど、実際にそんなに変わってないです。
#forcedotcomjp
ブースにお越し下さい!
•本セッションで紹介したアプリのこと•セッションでは紹介しなかったnativeアプリのこと
•mobileに限らずforce.com 開発について
Q & A
#forcedotcomjp
#forcedotcomjp