MVP Community Camp (2015年1月31日(土) 開催）セッション資料 LightSwitch の基本的な開発とカスタマイズのポイントの紹介

1. 瀬尾佳隆 (@seosoft)
Microsoft MVP for .NET
MVP Community Camp
2015/1/31
改めて LightSwitchで
Web開発 & Office 365開発

2. 瀬尾佳隆 (せおよしたか)
MVP for .NET (Jan 2015 – Dec 2015)
MVP for Visual C# (Jan 2009 – Dec 2014)
 y.seo@seosoft.jp
技術ひろば .net
ジャンルにとらわれずに、視野を広げられる場所
本当に “誰でも” 参加しやすいコミュニティーを目指してます
http://hiroba-tech.connpass.com/
次回は 2月21日 (土)、全体テーマは Azure
自己紹介 / コミュニティー紹介

3. • LightSwitch の紹介
• LightSwitch の開発手順
LightSwitch で
Web 開発
• カスタマイズのポイント
• デモ
カスタマイズと
機能拡張
• クラウドビジネスアプリ
Office 365
開発
今日の進め方

4. LightSwitch で Web 開発

5. Visual Studio Community は、
個人、学生などは無償で利用できます
利用時には、必ずライセンス条項の確認をしてください
LightSwitch も無償で利用できます
簡単に高い生産性で Web アプリを開発できます
今日は、LightSwitch の基本的な開発手順と
カスタマイズの要点を紹介します
VS Community + LightSwitch

6. 高い開発生産性
開発手順の一貫性
画面レイアウトの一貫性
誰にでも一定水準の Web アプリが作れます
”ものすごい” アプリケーションにもならないと考えてください
決して Visual Studio に変わる開発ツールではありません
LightSwitch の特徴

7. LightSwitch の開発手順
テーブル定義
画面定義
プロパティ変更
カスタマイズ
サーバーに発行
繰り返し
 「テーブルを書いて
画面を定義」 を繰り返す
 できるだけコードを書かない
 必要に応じて最低限の
カスタマイズを行う

8. Visual Studio 2013 Update 4
Commuity でも Professional 以上でも、どちらでも可
http://www.visualstudio.com/ja-jp/products/visual-
studio-community-vs
Office Developer Tools
http://aka.ms/OfficeDevToolsForVS2013
Office 365 開発をしたい場合は
開発者用 Office 365 テナントの契約が必要
LightSwitch の開発環境の作り方

9. デモ ～基本的な開発手順～
テーブル定義
画面定義
プロパティ変更
カスタマイズ
サーバーに発行
繰り返し
まずは、ここ

10. LightSwitch アプリのカスタマイズ

11. • 画面の要素ごとに表示の書式・形式を調整
• 画面の要素ごとに表示内容を調整
クライアント
サイド
• 条件付きのエンティティセット
• テーブル定義以外のデータを返す Webサービス
• データ操作前後に、他システムと連携
サーバー
サイド
• アプリケーションのテーマ変更
• SharePoint オンラインとの連携
その他
カスタマイズの種類

12. デモ ～カスタマイズ～
テーブル定義
画面定義
プロパティ変更
カスタマイズ
サーバーに発行
繰り返し

13. エンティティの created
“Order” がクライアントサイドで作成されたタイミングで、
今日の日付を設定する

14. エンティティの created ～結果

15. エンティティの postRender
詳細画面のタイトルを変更する

16. エンティティの postRender ～結果

17. 要素の CSS 操作
条件によって、一覧画面の各行の背景色を変更する

18. 要素の CSS 操作 ～結果

19. サーバーサイドのクエリデザイナー
サーバーから取得するエンティティセットを変更する

20. ServerApplicationContext (1)
テーブル定義にはないデータをクライアントに返す

21. ServerApplicationContext (2)

22. promiseOperation (1)
クライアントに新しいデータ項目を追加する

23. promiseOperation (2)
新しいデータ項目の表示前の関数を準備

24. promiseOperation (3)
Ajax で Web サービスを呼び出して、結果を表示する

25. ServerApplicationContext ～結果

26. LightSwitch で Office 365 開発

27. SharePoint 用アプリとして実装
Office 365 と連携して業務アプリをクラウド化する方法
Office 365 の認証基盤 (Azure AD) を利用できる
Office 365 のユーザー情報を利用できる
SharePoint Online のリストの読み書きができる
クラウドビジネスアプリ

28. ユーザー情報の利用 (1)
ユーザー情報 ＝ Person 型の変数

29. ユーザー情報の利用 (2)
ユーザーのオートコンプリート
プロフィール情報の取得

30. VS Community + LightSwitch で簡単 Web 開発
個人、学生なら無償で LightSwitch 利用可能
コードは必要最小限にとどめるのがポイント
カスタマイズの観点
サーバーサイド・・・クエリの作成で結果のカスタマイズ
クライアントサイド・・・ postRender で表示のカスタマイズ
テーブル定義以外のデータが欲しい時・・・
ServerApplicationContext + promiseOperation
クラウドビジネスアプリは Office 365 と連携して動作
まとめ