Blazor
BlazorでJavaScriptのライブラリをラップしたい場合なんかに有用なRazorのElementReferenceと@refの小話です。
自作Razor ComponentにHTML属性を割り当てたいケースは多々あるかと思います。 例えばid, classなんかはその最たるものではないでしょうか。
前回のHosted編はBlazor WebAssemblyとgRPCサーバーが一体となった構成でした。 今回はStandalone編ということで、Blazor WebAssemblyとgRPCサーバーを分けて作ります。 お互いを分離することでBlazor Assemblyは静的なWebサイトとして置いて、gRPCサーバはP…
先月の話ですが、Blazor WebAssemblyからgRPC-Webを使用する実験的サポートの発表がありました。 blog.stevensanderson.com devblogs.microsoft.com 本エントリはBlazor WebAssemblyプロジェクトのREST通信をgRPC-Webに置き換える手順を追ってみたいと思いま…
先日.NETを使用したgRPC-Webの実験的サポートが発表されたばかりですが、今日はBlazor WebAssembly Ver 3.2.0 Preview1がリリースされたようです。 それに伴いdevblogsが更新されてました。 devblogs.microsoft.com なお、GitHubのRepositoryとBranchはこち…
現在開催されている.NET Conf: Focus on BlazorのEilon Lipton氏のセッション Mobile Blazor Bindings – Using Blazor to build mobile appsでMobile Blazor Bindindsという名の実験的ライブラリが発表されました。 devblogs的には以下の記事です。 ※実はセ…
以前Azure Blob Storage上に静的サイトとしてClient side Blazorをデプロイする記事を書きました。 blog.piyosi.com Azure CLIに慣れる目的で、今回はServer side BlazorをAzure上にデプロイしたいと思います。 使うサービスはAzureのWeb Apps, Key Vault, S…
本エントリはBlazor Advent Calender 2019の25日目の記事です。 Blazorのことをつい最近知った方々を対象に、「Blazorは今後どのような方向へ進化していくのか」という点を簡単にまとめてみました。 ※12/22(日)の時点でAdvent Calenderの開いてる記事が残り…
本エントリはBlazor Advent Calender 2019の16日目の記事です Blazorの開発を行う上でチョット(だけ快適に開発)デキルようになる(かもしれない)小技を紹介します。
本エントリはBlazor Advent Calender 2019の15日目の記事です
Observer, EventAggregator, Fluxパターンとかそこら辺のメモです。
Redditに2019年11月のMicrosoft Docsの更新状況について投稿がありました。 対象期間は2019/11/01 ~ 2019/12/04の間です。 www.reddit.com なお、先月の更新状況は以下の通りです。 blog.piyosi.com 今月のテーマ 今月のテーマとしては以下の点が挙げられる…
ついに.NET Core 3.1 LTSがリリースされましたね! あわせてASP.NET Core 3.1もリリースされました。 devblogs.microsoft.com Microsoft Docsの特設ページはこちらです。 docs.microsoft.com 変更点は以下の通りです。 Here’s what’s new in this release fo…
本エントリはBlazor Advent Calender 2019の4日目の記事です はじめに .NET Core 3.0がリリースされてから3か月近く経過しました。 ※追記(12/04):本日.NET Core 3.1 LTSがリリースされました! 皆さんはお仕事でBlazor書いてますでしょうか?勿論私は書けて…
WPF(.NET Core)のWebView上に、publishしたClient side Blazorを表示するDesktop Appを実験的に作って挫折したのでその備忘録です。 ※挫折した、という点がポイントです。 Demo 最低限動くところまでは作ったので、その様子だけ載せておきます。 demo きっか…
.NET Core 3.1 Preview 3が公開されました。 devblogs.microsoft.com 記事内で12月上旬に.NET Core 3.1 LTSリリース予定って言ってますね! ※もともとは11月だったのにサラッと伸びてる Visual Studio 16.4 Preview 5およびVisual Studio for Mac 8.4 Previe…
Client side BlazorをPWA対応させてみました。 PWAのServiceWorkerの機能にはHTTPSが必要なので手っ取り早くAzure Blob Storageを使用します。 ちなみに環境は以下の通り .NET Core 3.1 Preview2 Microsoft.AspNetCore.Blazor.Templates 0.7.0 Blazor Templa…
個人アプリで折れ線グラフやドーナッツチャートを描画したくなったので、Blazoriseを使用して描画してみました。 本エントリはその記録です。 Library探しの旅 JavaScriptならいっぱいLibraryがありますが、歴史の短いBlazorではそうはいきません。 いい感じ…
Microsoft Igniteで盛り上がるIT界の裏では.NET Core 3.1 Preview2がリリースされました。 devblogs.microsoft.com それに合わせてASP.NET CoreとEntityFramework CoreもPreviewが公開されています。 devblogs.microsoft.com 本エントリではASP.NET Coreに追…
BlazorのComponentを別プロジェクト(RazorClassLibrary)へ切り分けた際、 Blazorから別プロジェクトの静的リソースへアクセスすることが出来ずにハマったので、それの件について記録します。 SolutionとProjectの作成 以下のコマンドでBlazorAppと、Componen…
こちらの記事の続きです。 blog.piyosi.com 本エントリでは 「GitHubに作ったClient Side BlazorのPrivate Repositoryのmaster branchへのコミットをトリガーにして、Azure DevOpsでBuild, UnitTest, Publishした後、Azure Storageの静的サイトへ自動デプロ…
Azure StorageにClient Side Blazorをデプロイします。 Client Side Blazorの作成 Blazorのプロジェクトを作成し、Publish(発行)しておきます。 dotnet new blazorwasm -o ClientSideBlazorSample cd ClientSideBlazorSample dotnet publish -c Release -o o…
Blazorで簡単なDrag and Dropを実装してみます。 デモ こんな感じです。 デモ コード 作ったコードはこちらにUpしてあります。 github.com
@bindした値を表示する際に format を整えるにはformatパラメータを追加すればよいそうです。 docs.microsoft.com <input @bind="DateRecorded" @bind:format="dd/MM/yyyy" /> @code { private DateTime DateRecorded = DateTime.Now; } Microsoft Docsによると、現在は通貨形式や数値形式など、その他の書式指定式は…
@bindによる双方向 DataBinding は以下の通りです。 <input @bind="CurrentValue" /> @code { private string CurrentValue { get; set; } } Microsoft Docsによると、@bind するタイミング(イベント)は変更できるようです。 docs.microsoft.com @bind 構文を使用して onchange イベントを…
Blazorで使用できるEventを列挙しました。 いずれもon{Event名}で使えるはずです。 Focus events Event 名 Args onfocus FocusEventArgs onblur FocusEventArgs onfocusin FocusEventArgs onfocusout FocusEventArgs Mouse events Event 名 Args onmouseover…
こちらの記事の続きです。 blog.piyosi.com Todoアプリに以下の機能の改造を加えます。 新しいTodoを追加したら画面に通知を表示する(NotifyServiceで別Componentの関数をKick) Todoの内容が空っぽの時は登録できないようValidationを追加する ※子コンポーネ…
BlazorのComponentへのParameter Bindingについて学ぶため簡単なTodoアプリを作りました。 今後暫くはこのアプリに手を加える形でBlazorのお勉強をしたいと思います。 github.com Microsoft Docsで言うとこのあたり docs.microsoft.com Demo こんな感じです…
先日こちらの一連のツイートを見かけました。 togetter.com なるほど~ 確かにネコちゃんとか文鳥の画像が表示されたら怒りも収まるに違いない。 というわけでBlazorのリコネクト画面をカスタマイズしてみます。 カスタマイズ結果 こんな感じになりました。 …
ASP.NET CoreやBlazorをローカル環境で動かすと この接続ではプライバシーが保護されません とか このサイトは安全ではありません とか表示されますよね?こんな感じに。 起動時に表示されるアレ 上記ページを表示されないようにする小話です。