.NET 7 対応した「Blazor WebAssembly アプリケーションプログラミング自習書」の紹介とその歴史

:::note info
2023年12月時点で、「Blazor WebAssembly アプリケーションプログラミング自習書」は .NET 8 に対応しています。
参照: [「Blazor WebAssembly アプリケーションプログラミング自習書」が .NET 8 対応しました](https://qiita.com/jsakamoto/items/ff378186c57d11918e81)
:::

## その前に - そもそも "Blazor" って何?

"Blazor" (ブレイザー) とは、JavaScript の代わりに C# でクライアント Web アプリケーションを実装できてしまうフレームワーク、ツール、実行環境です。
サーバー側で動作する "Blazor Server" と、Web ブラウザの WebAssembly 上で動作する "Blazor WebAssembly" という二形態があります。

公式サイトは下記リンク先になります。

https://blazor.net/

JavaScript 以外の言語でクライアント Web アプリケーションを実装する選択肢としては、昨今は WebAssembly + Rust の組み合わせが注目を集めているように見えますが (※自分調べ)、Blazor も既に実用レベルで使える選択肢ではないかと思われます。ただし Blazor は、JavaScript でクライアント Web アプリケーションを実装することと比べていろいろトレードオフもあり、万人にお勧めできる選択肢ではないとは考えています。とはいえ、C# のスキルやパッケージエコシステム、開発環境をそのまま転用できるため、刺さる人又は案件には刺さる技術であることには間違いないと思います。(参考: Qiita 記事[「Blazor をお勧めできる人は誰か?」](https://qiita.com/jsakamoto/items/52c5ef52fc5ccebaae1f))

## Blazor 習得の入門となる、無償で日本語の「自習書」があります

さてそのようなクライアント Web アプリケーション開発技術である Blazor について、私、日本語による入門レベルの自習書 **「Blazor WebAssembly アプリケーションプログラミング自習書」** を作成し、GitHub リポジトリ上で公開しています (下記リンク先)。

https://github.com/jsakamoto/self-learning-materials-for-blazor-jp

上記 GitHub リポジトリでは PDF (あるいはその原本となる Microsoft Word 文書) の形で自習書テキストを無償配付しております。その自習書テキストに記載の手順を踏んで実際に下図のような "世界時計" の Blazor WebAssembly プログラム作成を進めることで、Blazor を使ったクライアント Web アプリケーション開発の入門レベルを習得できます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/58450/4eb86e8a-a118-a2ad-d55b-f2c387b928d7.png)
(上図 Blazor WebAssembly 製 "世界時計" アプリの、完成版ライブデモは[**こちら**](https://jsakamoto.github.io/self-learning-materials-for-blazor-jp/))

この自習書、先日 11/9 の .NET 7 のリリースにあわせ、**.NET 7 に対応した内容に改訂・リリース**しました。

この自習書の対象層としては、既に C# によるプログラム開発経験をお持ちの方、さらには ASP.NET Core による MPA なサーバー側 Web アプリケーション開発経験をお持ちの方を想定した内容となっています。そのため、C# の構文であるとか HTML や CSS、Web API を C# で実装する方法については自習書テキスト内では説明はなく、それらの事項はすべて読者は承知済みであることを前提とした解説内容となっています。

C# で Windows Forms アプリや WPF アプリをバリバリ開発しているけど、HTML はサッパリ、という方ですと、上記自習書を使って自習を進めるのはちょっとつらいかもしれません。しかしそれに加えて HTML や Web アプリケーション開発の基礎をお持ちでしたら難なく、クライアント Web アプリケーションを C#/.NET を使って実装する技術を学んで頂けるのではないか、ということを考えながら作りました。Angular や React、Vue などといった JavaScript によるクライアント Web 開発技術について事前に知っている必要はありません。

## 「Blazor WebAssembly アプリケーションプログラミング自習書」が産まれた経緯

さて、この「Blazor WebAssembly アプリケーションプログラミング自習書」の**初版は 2018 年 5 月**になります。もう4年以上前になるんですね。で、その当時はどういった状況だったかと言いますと、**Blazor はまだ実験的プロジェクト**として公式発表があって間もないような時期で、そもそも Blazor が ASP.NET Core 製品ラインナップの一員になるのかどうかまったく定かではない、という扱いの頃でした。.NET のバージョンも、.NET Core 3.0 はまだリリースされていない時代 (.NET Core 2.x の時代) です。

ですがこの時期に、たまたまの巡り合わせで Blazor を知ることになった自分は、これこそが自分にフィットするクライアント Web アプリケーション開発技術だ! とがっちりハートを掴まれたのです。そして、同じような境遇・同じようなフィーリングを持っている他の人々に、広く Blazor の存在を知ってもらうべきではないかと思い至りました。それで **Blazor とはどんな書き心地なのか**を知ってもらい、**Blazor の是非を評価**してもらえるよう、そんな自習書テキストを作成しようとの目標から、まだ Blazor との出会いの興奮さめやらぬままに「Blazor WebAssembly アプリケーションプログラミング自習書」を作成し、リリースするに至った次第です。

それ以降、.NET Core 3.0 と一緒に Blazor Server が公式リリース、その後 .NET Core 3.1 がリリース、.NET 5.0 と一緒に Blazor WebAssembly が公式リリース、そして .NET 6.0 がリリース、と Blazor が版を重ねるのに歩調を合わせて、「Blazor WebAssembly アプリケーションプログラミング自習書」もその都度最新のバージョンに改訂を重ねて今日に至っています。

## この自習書の今、そしてこれから

Blazor を学習するリソースは、今となっては公式のラーニングサイトが充実しているのはもちろん、YouTube 上の動画や Udemy での学習コースなどなど選択肢もたくさん増えました。内容も、認証やオンライン決済連携なども含む実際的な Blazor アプリケーション開発を題材とした、本格的なトレーニングコースもあります。

そういった昨今、この「Blazor WebAssembly アプリケーションプログラミング自習書」は今となっては少々見劣りするかもしれません。実は今年 2022 年 11 月の .NET 7 リリースの際は、Blazor は今や必要とする人たちにはじゅうぶん知られたのではないか、その意味でもうこの自習書の役割は終わったのではないか、.NET 7 対応は見送って現在の .NET 6 対応版でおしまいにしようか、と考えたりしていました。ですが、ひょっとしてひょっとすると、もう少しまだこのようなタイプの自習書にもまだ一定の需要があるかもしれない、と考えなおし、.NET 7 対応を実施してリリースした次第です。振り返るにかれこれ**4年以上保守継続**しているわけですね。来年 .NET 8 のリリース時はどうしようかなぁ、と特に今は何も決めてはいませんが、需要がありそうなら、もう少し頑張って保守継続しようか、と思う 2022 年の 12 月です。

以上、.NET 7 対応した「Blazor WebAssembly アプリケーションプログラミング自習書」の紹介とその歴史でした。

## 補足 - なぜ Word で執筆なのか?

本文的にはじゅうぶん Markdown で記述できると思いますし、おそらくはそのほうが利用者・読者としては便利なんだろうなとは想像されるのですけれども、いかんせん、挿入図の編集が、自分の持っている技術ですと、Markdown では保守難しいなぁ、というのが最大の理由です。

下図のように、スクリーンショット上に赤枠とかを書いて注目箇所を示したりするのですが、そうすると、.NET や Visual Studio のバージョンアップに合せてスクリーンショットを撮り直し・図を差し替えることがあります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/58450/730a6025-a480-8ccc-f349-38a84dba9a1a.png)

そうしたときに、MS-Word 文書で編集していると、スクリーンショット部分だけ差し替えて、赤枠はそのまま再利用できますよね。

同じようなことが、他のツールで簡易にできれば、Markdown やそこからの HTML 出力に、執筆方式を変えられるのになぁ、とは常々考えておりました。もしもどなたかお詳しい方からアドバイス頂ければ幸いです!