Slide 1
Slide 1 text
SignalR を使った
アプリケーション開発をより快適に！
.NET ラボ 2023/01/28
何縫ねの。
Slide 2
Slide 2 text
自己紹介
1
• 所属: NTTコミュニケーションズ
イノベーションセンター
• 趣味: C#, OSS, ドール, 一眼(α7 IV)
• 執心領域
• C# ⇔ TypeScript
• SignalR
何縫ねの。
nenoNaninu
nenoMake
ブログ https://blog.neno.dev
その他 https://neno.dev
Slide 3
Slide 3 text
SignalR を使った
アプリケーション開発どうしてますか？
2
Slide 4
Slide 4 text
SignalR を使ったアプリケーション開発
3
• SwaggerUI 使ってますよね。
• ASP.NET Core のテンプレに
組み込まれている。
WEB API の場合…
Slide 5
Slide 5 text
SignalR を使ったアプリケーション開発
4
• SwaggerUI 使ってますよね。
• ASP.NET Core のテンプレに
組み込まれている。
WEB API の場合…
WEB API を定義したら
エンドポイントを叩ける
GUI が自動生成される
Slide 6
Slide 6 text
SignalR を使ったアプリケーション開発
5
SignalR を使う場合は？
Slide 7
Slide 7 text
SignalR を使ったアプリケーション開発
6
たぶん多くの人がこんな感じ。
Slide 8
Slide 8 text
SignalR を使ったアプリケーション開発
7
SignalR Hub
(server)
たぶん多くの人がこんな感じ。
Slide 9
Slide 9 text
SignalR を使ったアプリケーション開発
8
SignalR Hub
(server)
たぶん多くの人がこんな感じ。
WEB
Frontend
Native GUI App
(WPF, etc.)
Slide 10
Slide 10 text
SignalR を使ったアプリケーション開発
9
SignalR Hub
(server)
たぶん多くの人がこんな感じ。
WEB
Frontend
Native GUI App
(WPF, etc.)
開発中のプロダクトの
client app に手を入れる
開発中のプロダクトの
client app に手を入れる
Slide 11
Slide 11 text
SignalR を使ったアプリケーション開発
10
SignalR Hub
(server)
たぶん多くの人がこんな感じ。
WEB
Frontend
Native GUI App
(WPF, etc.)
開発中のプロダクトの
client app に手を入れる
開発中のプロダクトの
client app に手を入れる
ちょっと試したいだけなのに
適当な場所にボタンと入力
フィールド生やしてコールバッ
クバインドしてサーバから送ら
れてきたデータをどっかに出力
してうんぬんかんぬん
Slide 12
Slide 12 text
SignalR を使ったアプリケーション開発
11
SignalR Hub
(server)
たぶん多くの人がこんな感じ。
WEB
Frontend
Native GUI App
(WPF, etc.)
開発中のプロダクトの
client app に手を入れる
開発中のプロダクトの
client app に手を入れる
ちょっと試したいだけなのに
適当な場所にボタンと入力
フィールド生やしてコールバッ
クバインドしてサーバから送ら
れてきたデータをどっかに出力
してうんぬんかんぬん
Console
App
Slide 13
Slide 13 text
SignalR を使ったアプリケーション開発
12
SignalR Hub
(server)
たぶん多くの人がこんな感じ。
WEB
Frontend
Native GUI App
(WPF, etc.)
Console
App
開発用の Console App を用意
開発項目に合わせ都度変更
開発中のプロダクトの
client app に手を入れる
開発中のプロダクトの
client app に手を入れる
ちょっと試したいだけなのに
適当な場所にボタンと入力
フィールド生やしてコールバッ
クバインドしてサーバから送ら
れてきたデータをどっかに出力
してうんぬんかんぬん
Slide 14
Slide 14 text
SignalR を使ったアプリケーション開発
13
SignalR Hub
(server)
たぶん多くの人がこんな感じ。
WEB
Frontend
Native GUI App
(WPF, etc.)
Console
App
開発用の Console App を用意
開発項目に合わせ都度変更
開発中のプロダクトの
client app に手を入れる
開発中のプロダクトの
client app に手を入れる
ちょっと試したいだけなのに
適当な場所にボタンと入力
フィールド生やしてコールバッ
クバインドしてサーバから送ら
れてきたデータをどっかに出力
してうんぬんかんぬん
複数のコネクション
張るためにコンソール
複数開いてうんぬん
Slide 15
Slide 15 text
SignalR を使ったアプリケーション開発
14
SignalR Hub
(server)
たぶん多くの人がこんな感じ。
WEB
Frontend
Native GUI App
(WPF, etc.)
Console
App
開発用の Console App を用意
開発項目に合わせ都度変更
開発中のプロダクトの
client app に手を入れる
開発中のプロダクトの
client app に手を入れる
ちょっと試したいだけなのに
適当な場所にボタンと入力
フィールド生やしてコールバッ
クバインドしてサーバから送ら
れてきたデータをどっかに出力
してうんぬんかんぬん
複数のコネクション
張るためにコンソール
複数開いてうんぬん
入力も出力もコンソール。
つまり割としっかり実装しない
とコンソールに何か書き込んで
いる時に受信したデータがコン
ソール上に表示され…とかが
発生してうんぬんかんぬん
Slide 16
Slide 16 text
SignalR を使ったアプリケーション開発
15
😭めんどくさい😭
Slide 17
Slide 17 text
SignalR を使ったアプリケーション開発
16
😭めんどくさい😭
双方向の RPC ですし、さらにgrouping とかが
絡むため REST に比べてメンドクサイのは
仕方がないといえば仕方ない…?
いやしかし…!
Slide 18
Slide 18 text
SignalR を使ったアプリケーション開発
17
😭めんどくさい😭
SignalR の Hub / Receiver の
interface 定義をしたら
Hub / Receiver のメソッドを呼び出せる/出される
GUI app が自動生成されれば大解決のハズ！
双方向の RPC ですし、さらにgrouping とかが
絡むため REST に比べてメンドクサイのは
仕方がないといえば仕方ない…?
いやしかし…!
Slide 19
Slide 19 text
SignalR を使ったアプリケーション開発
18
SignalR にも
SwaggerUI 的なのが必要…!
Slide 20
Slide 20 text
SignalR を使ったアプリケーション開発
19
• SignalR 使ったアプリを快適に開発するための GUI を自動生成
• Hub のメソッドの呼び出し
• Hub から呼ばれたメソッドに
渡されたデータの表示
• 必要な手順は2点だけ
• http pipeline に middleware の追加
• Hub と Receiver を定義してる
interface に属性を付与
• JWT 認証をサポート
• プリミティブ型以外の
入力/表示はJSON 形式
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
TypedSignalR.Client.DevTools
SignalR 版 SwaggerUI
Slide 21
Slide 21 text
TypedSignalR.Client.DevTools
20
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
使い方
①Middleware を追加
②属性を付与
Slide 22
Slide 22 text
TypedSignalR.Client.DevTools
21
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
使い方
①Middleware を追加
②属性を付与
Middleware を追加
Slide 23
Slide 23 text
TypedSignalR.Client.DevTools
22
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
使い方
属性を付与
①Middleware を追加
②属性を付与
Middleware を追加
Slide 24
Slide 24 text
TypedSignalR.Client.DevTools
23
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
使い方
属性を付与
属性を付与
①Middleware を追加
②属性を付与
Middleware を追加
Slide 25
Slide 25 text
TypedSignalR.Client.DevTools
24
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
使い方
属性を付与
属性を付与
①Middleware を追加
②属性を付与
通常通りに実装。特別な事必要なし。
Middleware を追加
Slide 26
Slide 26 text
TypedSignalR.Client.DevTools
25
あとは /signalr-dev にアクセスすればいいだけ！
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
使い方
Slide 27
Slide 27 text
TypedSignalR.Client.DevTools
26
あとは /signalr-dev にアクセスすればいいだけ！
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
使い方
自動で開発用 GUI が構築
(まるで SwaggerUI)
Slide 28
Slide 28 text
TypedSignalR.Client.DevTools
27
あとは /signalr-dev にアクセスすればいいだけ！
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
使い方
自動で開発用 GUI が構築
(まるで SwaggerUI)
launchSettings.json に
swagger 用と signalr-dev 用を
用意しておくと便利
Slide 29
Slide 29 text
TypedSignalR.Client.DevTools
28
サポートしている機能
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
• Client-to-server invocation
• Server-to-client invocation
• Client-to-server streaming
• Server-to-client streaming
• JWT Authentification
Slide 30
Slide 30 text
TypedSignalR.Client.DevTools
29
Client-to-server invocation
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#built-in-types
Slide 31
Slide 31 text
TypedSignalR.Client.DevTools
30
Client-to-server invocation
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#built-in-types
Slide 32
Slide 32 text
TypedSignalR.Client.DevTools
31
Client-to-server invocation
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#built-in-types
メソッド名
Slide 33
Slide 33 text
TypedSignalR.Client.DevTools
32
Client-to-server invocation
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#built-in-types
パラメータ名 : 型名
メソッド名
Slide 34
Slide 34 text
TypedSignalR.Client.DevTools
33
Client-to-server invocation
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#built-in-types
パラメータ名 : 型名
メソッド名
Slide 35
Slide 35 text
TypedSignalR.Client.DevTools
34
Client-to-server invocation
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#built-in-types
パラメータ名 : 型名 ユーザ定義型は
JSON 形式で入力
メソッド名
Slide 36
Slide 36 text
TypedSignalR.Client.DevTools
35
Client-to-server invocation
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#built-in-types
パラメータ名 : 型名 ユーザ定義型は
JSON 形式で入力
Guid / DateTime 等の Built-in で
サポートしている型は README を参照…!
メソッド名
Slide 37
Slide 37 text
Guid / DateTime 等の Built-in で
サポートしている型は README を参照…!
TypedSignalR.Client.DevTools
36
Client-to-server invocation
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#built-in-types
パラメータ名 : 型名 ユーザ定義型は
JSON 形式で入力
メソッド名
Slide 38
Slide 38 text
Guid / DateTime 等の Built-in で
サポートしている型は README を参照…!
TypedSignalR.Client.DevTools
37
Client-to-server invocation
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#built-in-types
パラメータ名 : 型名 ユーザ定義型は
JSON 形式で入力
メソッド名 JSON が壊れてたら
ちゃんと教えてくれます。
Slide 39
Slide 39 text
TypedSignalR.Client.DevTools
38
Client-to-server invocation
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
Slide 40
Slide 40 text
TypedSignalR.Client.DevTools
39
Client-to-server invocation
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
Slide 41
Slide 41 text
TypedSignalR.Client.DevTools
40
Client-to-server invocation
戻り値の型
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
Slide 42
Slide 42 text
TypedSignalR.Client.DevTools
41
Client-to-server invocation
戻り値の型
戻り値は
JSON 形式で表示
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
Slide 43
Slide 43 text
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#server-to-client-streaming
TypedSignalR.Client.DevTools
42
Server-to-client invocation (broadcast)
Slide 44
Slide 44 text
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#server-to-client-streaming
TypedSignalR.Client.DevTools
43
Server-to-client invocation (broadcast)
Slide 45
Slide 45 text
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#server-to-client-streaming
TypedSignalR.Client.DevTools
44
Server-to-client invocation (broadcast)
Slide 46
Slide 46 text
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#server-to-client-streaming
TypedSignalR.Client.DevTools
45
Server-to-client invocation (broadcast)
右のパネルにサーバから
呼ばれた メソッド名 と
渡されたデータ が表示
Slide 47
Slide 47 text
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#server-to-client-streaming
TypedSignalR.Client.DevTools
46
Server-to-client invocation (broadcast)
右のパネルにサーバから
呼ばれた メソッド名 と
渡されたデータ が表示
Indent のcheck boxを
マークするとインデント
された JSON が表示される
Slide 48
Slide 48 text
TypedSignalR.Client.DevTools
47
Client-to-server streaming
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#client-to-server-streaming
Slide 49
Slide 49 text
TypedSignalR.Client.DevTools
48
Client-to-server streaming
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#client-to-server-streaming
Slide 50
Slide 50 text
TypedSignalR.Client.DevTools
49
Client-to-server streaming
IAsyncEnumerable
ChannelReader
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#client-to-server-streaming
Slide 51
Slide 51 text
TypedSignalR.Client.DevTools
50
Client-to-server streaming
IAsyncEnumerable
ChannelReader
パラメータに何れかが存在したら
Client-to-server streaming
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#client-to-server-streaming
Slide 52
Slide 52 text
TypedSignalR.Client.DevTools
51
Client-to-server streaming
IAsyncEnumerable
ChannelReader
パラメータに何れかが存在したら
Client-to-server streaming
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#client-to-server-streaming
Next, Complete, Cancel の 3 つで
ストリームを操作
Slide 53
Slide 53 text
TypedSignalR.Client.DevTools
52
Server-to-client streaming
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#server-to-client-streaming
Slide 54
Slide 54 text
TypedSignalR.Client.DevTools
53
Server-to-client streaming
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#server-to-client-streaming
Slide 55
Slide 55 text
TypedSignalR.Client.DevTools
54
Server-to-client streaming
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#server-to-client-streaming
IAsyncEnumerable
Task>
Task>
Slide 56
Slide 56 text
TypedSignalR.Client.DevTools
55
Server-to-client streaming
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#server-to-client-streaming
IAsyncEnumerable
Task>
Task>
Return Type が以下の何れかなら
Server-to-client streaming
Slide 57
Slide 57 text
TypedSignalR.Client.DevTools
56
Server-to-client streaming
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#server-to-client-streaming
IAsyncEnumerable
Task>
Task>
Return Type が以下の何れかなら
Server-to-client streaming
Slide 58
Slide 58 text
TypedSignalR.Client.DevTools
57
Server-to-client streaming
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#server-to-client-streaming
IAsyncEnumerable
Task>
Task>
[EnumeratorCancellation]
とセット
Return Type が以下の何れかなら
Server-to-client streaming
Slide 59
Slide 59 text
TypedSignalR.Client.DevTools
58
Server-to-client streaming
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#server-to-client-streaming
IAsyncEnumerable
Task>
Task>
CancellationToken 等の入力不要
のパラメータはグレーアウト
[EnumeratorCancellation]
とセット
Return Type が以下の何れかなら
Server-to-client streaming
Slide 60
Slide 60 text
Return Type が以下の何れかなら
Server-to-client streaming
TypedSignalR.Client.DevTools
59
Server-to-client streaming
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#server-to-client-streaming
IAsyncEnumerable
Task>
Task>
CancellationToken 等の入力不要
のパラメータはグレーアウト
Slide 61
Slide 61 text
Return Type が以下の何れかなら
Server-to-client streaming
TypedSignalR.Client.DevTools
60
Server-to-client streaming
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#server-to-client-streaming
IAsyncEnumerable
Task>
Task>
CancellationToken 等の入力不要
のパラメータはグレーアウト
ストリームに流れてくる値は
メソッド名 : OnNext, OnCompleted, OnError
という形で表示される
Slide 62
Slide 62 text
TypedSignalR.Client.DevTools
61
JWT Authentification
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#jwt-authentification-support
Slide 63
Slide 63 text
TypedSignalR.Client.DevTools
62
JWT Authentification Hub に [Authorize] を付与
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#jwt-authentification-support
Slide 64
Slide 64 text
TypedSignalR.Client.DevTools
63
JWT Authentification Hub に [Authorize] を付与
Hub の method に
[Authorize] を付与
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#jwt-authentification-support
Slide 65
Slide 65 text
TypedSignalR.Client.DevTools
64
JWT Authentification Hub に [Authorize] を付与
JWT 入力フィールドが
自動で現われる Hub の method に
[Authorize] を付与
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools#jwt-authentification-support
Slide 66
Slide 66 text
TypedSignalR.Client.DevTools
の仕組み
65
Slide 67
Slide 67 text
TypedSignalR.Client.DevTools の仕組み
66
https://www.nuget.org/packages/TypedSignalR.Client.DevTools/#dependencies-body-tab
依存関係をみてみましょう。
Slide 68
Slide 68 text
TypedSignalR.Client.DevTools の仕組み
67
https://www.nuget.org/packages/TypedSignalR.Client.DevTools/#dependencies-body-tab
依存関係をみてみましょう。
[Hub] / [Receiver]
属性が含まれるパッケージ
Slide 69
Slide 69 text
TypedSignalR.Client.DevTools の仕組み
68
https://www.nuget.org/packages/TypedSignalR.Client.DevTools/#dependencies-body-tab
依存関係をみてみましょう。
[Hub] / [Receiver]
属性が含まれるパッケージ
SignalR の Hub を解析して
Hub の仕様を表現する JSON (spec.json) を
生成するための Source Generator
Slide 70
Slide 70 text
TypedSignalR.Client.DevTools の仕組み
69
https://www.nuget.org/packages/TypedSignalR.Client.DevTools/#dependencies-body-tab
依存関係をみてみましょう。
[Hub] / [Receiver]
属性が含まれるパッケージ
SignalR の Hub を解析して
Hub の仕様を表現する JSON (spec.json) を
生成するための Source Generator
コンパイル時に interface を
ガリガリ解析してJSON を作り
アセンブリに埋め込む
Slide 71
Slide 71 text
TypedSignalR.Client.DevTools の仕組み
70
https://www.nuget.org/packages/TypedSignalR.Client.DevTools/#dependencies-body-tab
依存関係をみてみましょう。
[Hub] / [Receiver]
属性が含まれるパッケージ
SignalR の Hub を解析して
Hub の仕様を表現する JSON (spec.json) を
生成するための Source Generator
コンパイル時に interface を
ガリガリ解析してJSON を作り
アセンブリに埋め込む
1. app.MapHub() を見つける
2. T が実装している Hub /
Hub の型引数で渡される
Receiver の interface を見つけ
3. それらの interface で定義され
ているメソッドを解析する
Slide 72
Slide 72 text
TypedSignalR.Client.DevTools の仕組み
71
https://www.nuget.org/packages/TypedSignalR.Client.DevTools/#dependencies-body-tab
依存関係をみてみましょう。
[Hub] / [Receiver]
属性が含まれるパッケージ
SignalR の Hub を解析して
Hub の仕様を表現する JSON (spec.json) を
生成するための Source Generator
spec.json を元に
GUI を構築する
React アプリ(Next.js 製)
が埋め込まれている
コンパイル時に interface を
ガリガリ解析してJSON を作り
アセンブリに埋め込む
1. app.MapHub() を見つける
2. T が実装している Hub /
Hub の型引数で渡される
Receiver の interface を見つけ
3. それらの interface で定義され
ているメソッドを解析する
Slide 73
Slide 73 text
TypedSignalR.Client.DevTools の仕組み
72
https://www.nuget.org/packages/TypedSignalR.Client.DevTools/#dependencies-body-tab
依存関係をみてみましょう。
[Hub] / [Receiver]
属性が含まれるパッケージ
SignalR の Hub を解析して
Hub の仕様を表現する JSON (spec.json) を
生成するための Source Generator
spec.json を元に
GUI を構築する
React アプリ(Next.js 製)
が埋め込まれている
/signalr-dev を叩いたら
これが読みだされる
コンパイル時に interface を
ガリガリ解析してJSON を作り
アセンブリに埋め込む
1. app.MapHub() を見つける
2. T が実装している Hub /
Hub の型引数で渡される
Receiver の interface を見つけ
3. それらの interface で定義され
ているメソッドを解析する
Slide 74
Slide 74 text
TypedSignalR.Client.DevTools の仕組み
73
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
ミドルウェアをもう一度みてみると…
Slide 75
Slide 75 text
TypedSignalR.Client.DevTools の仕組み
74
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
ミドルウェアをもう一度みてみると…
/signalr-dev/spec.json で
Source Generator 生成した
SignalR の Hub の仕様を表現する
JSON を返すようにパイプラインを構築
Slide 76
Slide 76 text
TypedSignalR.Client.DevTools の仕組み
75
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
ミドルウェアをもう一度みてみると…
/signalr-dev でReact アプリが
読みだされるようパイプラインを構築
/signalr-dev/spec.json で
Source Generator 生成した
SignalR の Hub の仕様を表現する
JSON を返すようにパイプラインを構築
Slide 77
Slide 77 text
TypedSignalR.Client
シリーズ
76
Slide 78
Slide 78 text
TypedSignalR.Client.DevTools の名前の由来
77
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
TypedSignalR.Client.DevTools
Slide 79
Slide 79 text
TypedSignalR.Client.DevTools の名前の由来
78
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
TypedSignalR.Client.DevTools
Slide 80
Slide 80 text
TypedSignalR.Client.DevTools の名前の由来
79
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
TypedSignalR.Client.DevTools
型付けされた SignalR Client
Slide 81
Slide 81 text
TypedSignalR.Client.DevTools の名前の由来
80
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
TypedSignalR.Client.DevTools
型付けされた SignalR Client
今までの話に型付けとか
なにもないじゃん
Slide 82
Slide 82 text
TypedSignalR.Client.DevTools の名前の由来
81
https://github.com/nenoNaninu/TypedSignalR.Client.DevTools
TypedSignalR.Client.DevTools
型付けされた SignalR Client
今までの話に型付けとか
なにもないじゃん
TypedSignalR.Client シリーズの
1つなのです…!
Slide 83
Slide 83 text
TypedSignalR.Client シリーズ
82
https://github.com/nenoNaninu/TypedSignalR.Client#related-work
Slide 84
Slide 84 text
• C# の SignalR Client を
強く型付けするための
Source Generator
TypedSignalR.Client シリーズ
83
https://github.com/nenoNaninu/TypedSignalR.Client#related-work
TypedSignalR.Client
Slide 85
Slide 85 text
• C# の SignalR Client を
強く型付けするための
Source Generator
TypedSignalR.Client シリーズ
84
https://github.com/nenoNaninu/TypedSignalR.Client#related-work
TypedSignalR.Client
.TypeScript
TypedSignalR.Client
• TypeScript の SignalR
Client を強く型付け
するためのライブラリ
及び .NET Tool
Slide 86
Slide 86 text
• C# の SignalR Client を
強く型付けするための
Source Generator
TypedSignalR.Client シリーズ
85
https://github.com/nenoNaninu/TypedSignalR.Client#related-work
TypedSignalR.Client
.TypeScript
TypedSignalR.Client
• TypeScript の SignalR
Client を強く型付け
するためのライブラリ
及び .NET Tool
型で悩む必要は
もうありません！
型で悩む必要は
もうありません！
Slide 87
Slide 87 text
• C# の SignalR Client を
強く型付けするための
Source Generator
TypedSignalR.Client シリーズ
86
https://github.com/nenoNaninu/TypedSignalR.Client#related-work
TypedSignalR.Client
.TypeScript
TypedSignalR.Client
MessagePack Hub Protocol を
TypeScript でも簡単に利用可能！
• TypeScript の SignalR
Client を強く型付け
するためのライブラリ
及び .NET Tool
型で悩む必要は
もうありません！
型で悩む必要は
もうありません！
Slide 88
Slide 88 text
• C# の SignalR Client を
強く型付けするための
Source Generator
TypedSignalR.Client シリーズ
87
https://github.com/nenoNaninu/TypedSignalR.Client#related-work
TypedSignalR.Client
.TypeScript
TypedSignalR.Client
.DevTools
TypedSignalR.Client
MessagePack Hub Protocol を
TypeScript でも簡単に利用可能！
• TypeScript の SignalR
Client を強く型付け
するためのライブラリ
及び .NET Tool
型で悩む必要は
もうありません！
型で悩む必要は
もうありません！
• SignalR 版 SwaggerUI
• 今回の登壇のテーマ
Slide 89
Slide 89 text
• C# の SignalR Client を
強く型付けするための
Source Generator
TypedSignalR.Client シリーズ
88
https://github.com/nenoNaninu/TypedSignalR.Client#related-work
TypedSignalR.Client
.TypeScript
TypedSignalR.Client
.DevTools
TypedSignalR.Client
New!
• TypeScript の SignalR
Client を強く型付け
するためのライブラリ
及び .NET Tool
型で悩む必要は
もうありません！
型で悩む必要は
もうありません！
• SignalR 版 SwaggerUI
• 今回の登壇のテーマ
MessagePack Hub Protocol を
TypeScript でも簡単に利用可能！
Slide 90
Slide 90 text
TypedSignalR.Client シリーズ
89
SignalR 機能対応表
TypedSignalR.Client
TypedSignalR.Client
.TypeScript
TypedSignalR.Client
.DevTools
Client-to-server
Invocation
⭕️ ⭕️ ⭕️
Server-to-client
Invocation (broadcast)
⭕️ ⭕️ ⭕️
Client-to-server
streaming
⭕️ ⭕️ ⭕️
Server-to-client
streaming
⭕️ ⭕️ ⭕️
Client results
(.NET 7)
⭕️ ⭕️
https://github.com/nenoNaninu/TypedSignalR.Client#related-work
Slide 91
Slide 91 text
TypedSignalR.Client シリーズ
90
SignalR 機能対応表
TypedSignalR.Client
TypedSignalR.Client
.TypeScript
TypedSignalR.Client
.DevTools
Client-to-server
Invocation
⭕️ ⭕️ ⭕️
Server-to-client
Invocation (broadcast)
⭕️ ⭕️ ⭕️
Client-to-server
streaming
⭕️ ⭕️ ⭕️
Server-to-client
streaming
⭕️ ⭕️ ⭕️
Client results
(.NET 7)
⭕️ ⭕️
https://github.com/nenoNaninu/TypedSignalR.Client#related-work
.NET 7 で新規追加された
機能もしっかりサポート！
Slide 92
Slide 92 text
TypedSignalR.Client シリーズ
91
SignalR 機能対応表
TypedSignalR.Client
TypedSignalR.Client
.TypeScript
TypedSignalR.Client
.DevTools
Client-to-server
Invocation
⭕️ ⭕️ ⭕️
Server-to-client
Invocation (broadcast)
⭕️ ⭕️ ⭕️
Client-to-server
streaming
⭕️ ⭕️ ⭕️
Server-to-client
streaming
⭕️ ⭕️ ⭕️
Client results
(.NET 7)
⭕️ ⭕️
もう暫くお待ちください…!
https://github.com/nenoNaninu/TypedSignalR.Client#related-work
.NET 7 で新規追加された
機能もしっかりサポート！
Slide 93
Slide 93 text
まとめ
92
• 導入方法
• ミドルウェア追加
• Hub と Receiver の interface に 属性をアノテーションするだけ！
• 他の TypedSignalR.Client シリーズも使って
強く型付けされた快適なコーディングライフを送ろう！
TypedSignalR.Client.DevTools を使って
快適にSignalR を活用したアプリケーションを開発しよう！
あとは SwaggerUI みたいに
GUI ぽちぽちして実行！快適デバッグ！