#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