#author("2021-11-11T07:24:19+00:00","default:admin","admin")
#author("2021-11-11T07:58:17+00:00","default:admin","admin")
-[[ASP.NET Core Blazor の概要:https://docs.microsoft.com/ja-jp/aspnet/core/blazor/?view=aspnetcore-3.1]]

-[[Blazor University:https://blazor-university.com/]]

-[[Blazor を使用して Web アプリをビルドする:https://docs.microsoft.com/ja-jp/learn/modules/build-blazor-webassembly-visual-studio-code/]]
-[[Blazor WebAssembly アプリケーションプログラミング自習書:https://github.com/jsakamoto/self-learning-materials-for-blazor-jp]]
-[[【無料】オンライン書籍「猫でもわかるBlazor入門」:https://blazor-master.com/blazor-beginner-book/]]

-[[【2021年版】Blazor vs React 比較 - どちらを選ぶべきか?:https://blogs.jp.infragistics.com/entry/blazor-vs-react]]
-[[Blazorについて:https://qiita.com/tfukumori/items/f2465a14854734f405a0]]
-[[WebAssemblyの開発環境が整う、.NET 6でクロスプラットフォーム開発が加速へ:https://xtech.nikkei.com/atcl/nxt/column/18/01818/101800004/]]

-[[What is Blazor vs (Angular, React, and Vue).:https://devathon.com/blog/blazor-vs-angular-vs-react-vs-vue/]]

-[[Blazor をお勧めできる人は誰か?:https://qiita.com/jsakamoto/items/52c5ef52fc5ccebaae1f]]
-[[Blazor WebAssembly に入門してみた:https://dev.classmethod.jp/articles/hello-blazor-webassembly/]]

-[[マイクロソフト、「Blazor WebAssembly」正式版を5月にリリース。BlazorでPWAやデスクトップアプリも開発へ:https://www.publickey1.jp/blog/20/blazor_webassembly5blazorpwa.html]]
-[[[速報」Blazor WebAssemblyが正式リリース。C#/.NETでWebアプリケーションを開発可能に。Microsoft Build 2020:https://www.publickey1.jp/blog/20/blazor_webassemblycnetwebmicrosoft_build_2020.html]]
-[[JavaScript天下に挑戦?Blazor WebAssemblyの登場:https://www.sun-m.co.jp/blog/tips/152.html]]
-[[[Event] Microsoft Build 2020 (2020/05/19-20):http://blog.shos.info/archives/2020/07/build2020.html]]

-[[C#でSPAが実現できる、Blazor WebAssemblyのはじめかた:https://codezine.jp/article/detail/13036]]
-[[C#でSPAを実現する、Blazorコンポーネントの開発:https://codezine.jp/article/detail/13321]]

-[[【エバンジェリスト・ボイス】Webの 未来? WebAssemblyとBlazor:https://www.idnet.co.jp/column/page_131.html]]
-[[デスクトップから Web への移行。WPFからWebに移行するなら Blazor がおすすめ:https://zenn.dev/furugen/articles/7feed42e05fa7a]]
-[[Blazor WebAssembly をさわってみた:https://www.matatabi-ux.com/entry/2019/11/07/100000]]

-[[ぶらぶらBlazor:https://blablablazor.hatenablog.com/]]
-[[Blazor Desktop Apps 面白そうじゃない?:https://zenn.dev/okazuki/articles/mobile-blazor-bindings]]
-[[Blazor WebAssemblyとSignalRでチャットアプリを作ってみた:https://recruit.cct-inc.co.jp/tecblog/csharp/chatapp-blazorwebassembly-signalr/]]
-[[.NET 6 の Blazor のコンポーネントでクエリ パラメーターを使うのが簡単になりました:https://zenn.dev/okazuki/articles/blazor-wasm-rc1-queryparam]]

*特徴 [#jc0903ab]
-[[Blazor とは:https://docs.microsoft.com/ja-jp/learn/modules/build-blazor-webassembly-visual-studio-code/2-understand-blazor-webassembly]]

-バックエンドもフロントエンドもC#で開発できる
-コードはC#で書き、コンパイルはWeb Assemblyを利用、必要なJSのAPIやライブラリーはJavaScript Interopで呼び出せる
-Blazorを利用すれば、クライアントロジックをサーバーで処理することもできる
-つまり、クライアントサイドとサーバーサイドのインタラクティブさのみならず、SSRレベルのセキュリティも持てるようになる

-Blazor アプリは、C#、HTML、および CSS を使用して構築された再利用可能な Web UI コンポーネントで構成されている
-Blazor の場合、開発者は C# を使用してクライアント コードとサーバー コードを構築できる
-フロントエンド クライアント コードとバックエンド ロジックとでコードとライブラリを共有することもできる
-すべてのコードに C# を使用すると、フロント エンドとバック エンド間のデータ共有、コードの再利用による開発の高速化、メンテナンスが容易になる

-Blazor を使用して以下を生成できる
--WebSocket 接続を介して UI の相互作用を処理するサーバー側コード
--WebAssembly を介してブラウザーで直接実行されるクライアント側の Web アプリ


*シリーズ [#wa3ec771]
-[[ASP.NET Core Blazor - Blazor WebAssembly と Blazor Server の違いは? 5つのポイント:https://blogs.jp.infragistics.com/entry/2020/10/30/152834]]

**Blazor Server [#e3784d33]
-サーバーサイドを C# で記述。 ASP.NET WebForms に置き換わるものとされる
-クライアントサイドとは、SignalR で通信し、リアルタイムに同期をとる

**Blazor WebAssembly [#j8eeb761]
-[[ASP.NET Core Blazor WebAssembly のホストと展開:https://docs.microsoft.com/ja-jp/aspnet/core/blazor/host-and-deploy/webassembly?view=aspnetcore-5.0]]

-Blazor Server と違い、クライアントサイドで C# が動作する Web アプリケーションを作成できる
-クライアント サイドのプログラムを JavaScript ではなく、C# で記述
-クライアント サイド (Web ブラウザー) 上で、WebAssembly の .NET が動作する

-[[Blazor WebAssembly を使ってみた:https://www.qes.co.jp/media/Microservices/a58]]
-[[ASP.NET Core Blazor WebAssembly を使用してプログレッシブ Web アプリケーションをビルドする:https://docs.microsoft.com/ja-jp/aspnet/core/blazor/progressive-web-app?view=aspnetcore-5.0&tabs=visual-studio]]
-[[ASP.NET Core Blazor WebAssembly で PWA プロジェクトを作成しよう:https://qiita.com/MNakae_IG/items/e91b87e501895fbe0792]]
-[[Blazorで、電卓アプリをつくってみる:https://qiita.com/kimuradesu/items/1f96d3833f096eed4b3a]]
-[[BlazorのPWAを使ってみた / Tried using PWA - Speaker Deck:https://speakerdeck.com/takahiro901/tried-using-pwa]]
-[[Blazor WebAssemblyで高機能なデータグリッドコントロールを使用する:https://devlog.grapecity.co.jp/blazor-webassembly-datagrid/]]

**Blazor PWA (Progressive Web Application) (将来) [#rf0cbbfd]
-Web アプリケーションが単独のアプリケーションとして動作する

**Blazor Hybrid (将来) [#d0e66ca2]
-Electron や WebView を用いてデスクトップアプリケーションを開発

**Blazor Native (将来) [#p58a5b86]
-ネイティブアプリケーションを開発

*コンポーネントライブラリ [#m67a52f6]
-[[【無料】Blazor 対応の「使える」UI フレームワーク5選:https://blazor-master.com/blazor-ui-framework/]]
-[[Top 10 nice free Blazor components:https://medium.com/@alexandre.malavasi/top-10-nice-free-blazor-components-b42875e56b28]]

-[[Ant Design Blazor:https://github.com/ant-design-blazor/ant-design-blazor]]
-[[MudBlazor:https://mudblazor.com/]]
-[[MatBlazor:https://www.matblazor.com/]]
-[[Radzen:https://blazor.radzen.com/]]
-[[Skclusive.Material.Component:https://skclusive.github.io/Skclusive.Material.Docs/]]

-[[Microsoft.Fast:https://github.com/microsoft/fast-blazor]]
-[[BlazorFluentUI:https://www.blazorfluentui.net/]]
-[[Blazorise:https://blazorise.com/]]
-[[BlazorStrap:https://blazorstrap.io/]]
-[[PanoramicData.Blazor:https://github.com/panoramicdata/PanoramicData.Blazor]]
-[[Element Blazor:https://github.com/Element-Blazor/Element-Blazor]]
-[[Blazored:https://github.com/Blazored]]

-[[Syncfusion:https://www.syncfusion.com/blazor-components]]
--有料だが、以下の条件を満たせば無料で使用可
---年間の収入が100万ドル以下
---開発者が5人以下

-[[Blazor UI Components by DevExpress:https://www.devexpress.com/blazor/]]
-[[Smart.Blazor UI Component Library:https://www.htmlelements.com/blazor/]]

-[[Ignite UI for Blazor:https://jp.infragistics.com/products/ignite-ui-blazor]]
-[[Blazor開発コンポーネントセット:https://www.grapecity.co.jp/developer/componentone/blazor]]

*開発 [#qad624f2]
**NuGet [#va4e4d1b]
-[[PowerShellでGoogleCalendarAPIを叩こうとして躓いた話。:https://note.com/daharas/n/ne37a13eac69f]]

**[[Microsoft.AspNetCore.Components.WebAssembly:https://www.nuget.org/packages/Microsoft.AspNetCore.Components.WebAssembly/]] [#x7a633af]


**Visual Studio Code [#wb67d3fa]
***dotnetコマンド [#jd97f081]
-Blazor Server プロジェクトの初期化
 dotnet new blazorserver -f net6.0
-Blazor WebAssembly プロジェクトの初期化
 dotnet new blazorwasm -f net6.0

トップ   編集 差分 バックアップ 添付 複製 名前変更 リロード   新規 一覧 単語検索 最終更新   ヘルプ   最終更新のRSS