Room Metro 2014-03-01
-
Upload
kazuhide-maruyama -
Category
Technology
-
view
2.231 -
download
2
Transcript of Room Metro 2014-03-01
最近の.NET系Webアプリケーションテクノロジーについて
自己紹介
• 丸山です。
• 最近はWebアプリよく作ってます。• エンタープライズ系です。
以上。
Webアプリ
クライアント サービス データアクセス
今日の話
クライアント サービス データアクセス
• Entity Frameworkとかも面白いですが割愛
• ASP.NET Web API を少々• SignalR を少々• Owinとかも面白いですがSignalRが
動かなかったので割愛
• Typescriptを少々• Bootstrapとかも面白いですが割愛• MVCとかも面白いですが割愛
今日のゴール
• とりあえず単語だけ持って帰ってください。
ASP.NET Web API
HTTPのサービスを公開するためのテクノロジー
• RESTじゃなくてもOK• でも基本的にはREST
• URLのテンプレートを指定したら勝手にクラスとかメソッドとか引数とかにマッピング
• 引数も戻り値もJSONとかXMLにシリアライズ/デシリアライズしてくれる
• 普通の.NETクラスのノリで書けてしまう• ノリすぎるとトラップもいっぱいあるので普通はちゃんと考えないとだめですが、とりあえずお手軽
• HTTP ContextとかWCFとかに依存しない
• ODataも大丈夫
config.Routes.MapHttpRoute(name: "DefaultApi",routeTemplate: "api/{controller}"
);
簡単な使い方(1)
ルーティング(どういうURLの時にどのクラスとかメソッドとか引数とかを呼び出すか)を指定する
public class RoomController : ApiController {public IEnumerable<Room> Get() {
return new Room[]{new Room(){Id=1, Name="Room Metro",
Description="Room Metro users room."},new Room(){Id=2, Name="Silverlight Square",
Description="Silverlight Square users room."},new Room(){Id=3, Name="Windows Phone Arch",
Description="Windows Phone Arch users room."},new Room(){Id=4, Name="VSHTC",
Description="VS Hackathon users room."},new Room(){Id=5, Name="Typescript",
Description="Typescript users Room."},new Room(){Id=6, Name="Miscellaneous",
Description="miscellaneous...."}};
}}
ApiControllerを継承してメソッド作って返すだけ
簡単な使い方(2)
ブラウザから直接たたけます。
テンプレートが“api/{controller}”だったのでRoomControllerに割り当てられて、ブラウザからURL直接たたくと HTTP Get 要求なので Get メソッドが呼ばれる
[{"Description": "Room Metro users room.","Id": 1,"Name": "Room Metro"
},{
"Description": "Silverlight Square users room.","Id": 2,"Name": "Silverlight Square"
},・・・・・
詳しいことはこの辺で
SignalR
リアルタイムWebを実現するテクノロジー
• クライアントとサービス間で非同期と双方向通信• 通信方法はWebSocketを利用するが、ブラウザの実装状況により使えない場合は、代替え手段が利用される• Server Sent Eventsとか、Forever Frameとか、Ajax long poolingとか
• 基本形はRPC方式• クライアントからはサービスのメソッドを呼んでるかのように
• サービスからはクライアントのメソッドを呼んでるかのように
• もちろんもっと低レベルなインターフェイスもあります
簡単な使い方(1)
public class Startup {public void Configuration(IAppBuilder app) {
app.MapSignalR();
}}
使うよって宣言
[HubName("room")]public class RoomHub : Hub {
public void Enter(int groupId) {this.Groups.Add(this.Context.ConnectionId, groupId.ToString());
}
public void Leave(int groupId) {this.Groups.Remove(this.Context.ConnectionId, groupId.ToString());
}
public void Send(int groupId, string message) {this.Clients.Group(groupId.ToString()).receive(message);
}
}
Hubクラスを継承して普通にメソッドを定義。このメソッドがクライアントから呼ばれる
“receive”はクライアント側で受け取る用のイベント名のようなイメージ
簡単な使い方(2)
<script src="Scripts/jquery.signalR-2.0.2.js"></script><script src="signalr/js"></script>
とりあえずインクルード
var room = room = $.connection.room;
$.connection.hub.start().done(function () {
room.on('receive', function (message) {if (currentRoomId) {
writeMessages(message);}
});
room.server.enter(currentRoomId);room.server.send(currentRoomId, "Hello world");room.server.leave(currentRoomId);
});
Hub取り出してつないでイベント受け取る設定して呼び出して
詳しいことはこの辺で
TypeScript
規模の大きな開発にも使えるJavaScript
• ECMAScript6(Harmony)をベースに作られたJavaScriptのスーパーセット• JavaScriptはほぼほぼそのままTypeScriptにできる
• moduleとかclassとかがあるから構造化しやすい
• 静的片付けができるからコンパイルでエラーが分かる
• コンパイル後のJavaScriptがきれい
• なんといってもアロー関数式
• 26日(水)曜日に1.0RCが登場(0.9.7)• 4月に開催されるBuildで1.0が登場とのうわさ
• Visual Studioでも正式サポート
簡単な使い方
詳しいことはこの辺で
ご清聴ありがとうございました。