Blazor
個人アプリで折れ線グラフやドーナッツチャートを描画したくなったので、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をローカル環境で動かすと この接続ではプライバシーが保護されません とか このサイトは安全ではありません とか表示されますよね？こんな感じに。 起動時に表示されるアレ 上記ページを表示されないようにする小話です。
こちらのサイトによるとBlazorには以下のLifecycleがあるそうです。 OnInitialized OnInitializedAsync OnParametersSet OnParametersSetAsync OnAfterRender OnAfterRenderAsync ShouldRender ShouldRenderは画面更新前に呼ばれ、画面更新するかどうかの判…
※本エントリは先日投稿したエントリのコードを修正して投稿したものです。 .NET Core 3.0のBlazorコトハジメとしてリアルタイムプレビューに対応したMarkdownエディタを作ってみました。 Blazorのことよく分かってないので雰囲気で作った感が満載です。 デモ…
.NET Conf 2019が終わり、興奮冷めやらぬ.NETエンジニアの多いことかと思います。 .NET Confで"The Future of Blazor on the Client"というタイトルでBlazorの未来に関する発表がされました。 The Future of Blazor on the Client こちらの発表内容で気にな…
Electron.NETを使って.NET Core 3.0のBlazorをElectron上で動かしてみました
.NET Core CLIのdotnet watchでチョットだけ快適なTDD開発 `dotnet watch`コマンドを使ってLive Unit TestっぽくTDDする話です。
