😊

.NET Night Party@品川　ライブコーディング対決 IF Blazor Appsテンプレだったら？

2023/12/23に公開

.NET

tech

.NET Night Party@品川イベントとは

2023年を締めくくる.NET開発者による.NET開発者のための忘年会！

当然、ライブコーディング対決はまっさらなコンソールで行われたのですが、Blazor Appsのテンプレートでやったらどうなったかを検証してみました。

Blazor Appsのテンプレートといってもオプションがいっぱいあります。
今回は、Intaractive rander modeをWebAssemblyにしてInteractivity locationをGlobalに設定して挑戦してみました。

サイコロを3回転がしてそれぞれの目と合計を表示

<h1>サイコロの目の合計は @total です。</h1>
<p>サイコロの目は @number1、@number2、@number3 です。</p>

@code {
    private int number1 = 0;
    private int number2 = 0;
    private int number3 = 0;
    private int total => number1 + number2 + number3;

    protected override void OnInitialized()
    {
        number1 = Random.Shared.Next(1, 7);
        number2 = Random.Shared.Next(1, 7);
        number3 = Random.Shared.Next(1, 7);
    }
}

普通の書き方過ぎて面白くない。。。。

じんぐるさんの模範解答をカンニングして。。。。。

サイコロの目は、
@foreach (var item in items)
{
    @item@:、
}
合計：@items.Sum()
@code {
    private int[] items = new int[3];
    protected override void OnInitialized()
    {
        items = Random.Shared.GetItems([1, 2, 3, 4, 5, 6], 3);
    }
}

まあ、GetItemsちゃんと調べたぞってことで！
Random.GetItems メソッド

シアトル時間を1秒間隔で表示する

@time

@code {
    private string? time;
    protected override async Task OnInitializedAsync()
    {
        while (true)
        {
            await Task.Delay(1000);
            time = DateTime.UtcNow.AddHours(-8).ToString();
            StateHasChanged();
        }
    }
}

これが、InteractivityがServerだともう一行書かなきゃなんだけどもWASMなのでこれでOK。
まあ、お作法としては邪道ですが。。。。。

3問目は相変わらず見なかったことにしておきます。。。。

.NET Night Party@品川 イベントとは

サイコロを3回転がしてそれぞれの目と合計を表示

シアトル時間を1秒間隔で表示する

Discussion

.NET Night Party@品川イベントとは