プログラミング C# - 翔ソフトウェア (Sho's)

C#/.NET/ソフトウェア開発など

【ライブコーディング】連結リスト LinkedList<T> ‐自作で学ぶコレクションの基礎‐

YouTubexin9le さんとコーディング ライブをやりました。

お題は、C#連結リスト LinkedList<T>

テストを書きながら少しずつ実装していくというものになっています。

Visual StudioLive ShareLive Unit Testing を使い、2人で快適にコーディングすることができました。

「.NET で機械学習/ディープラーニングをやってみよう!」 | MVP パーソナルスポンサー | de:code 2020

デジタル イベントとして開催された de:code 2020 (6月17日 – 7月17日) にMVP パーソナルスポンサーとしてサンプル コードとチュートリアルを提供しました。

【de:code 2020】 Azure Machine Learning Studio と Python と C#/.NET によるディープ ラーニングのサンプル/チュートリアル | GitHub

概要

Azure Machine Learning などで機械学習/ディープラーニングのモデルを作成し、それを .NET の中の ML.NET を利用して使ってみましょう。

チュートリアル形式で説明します。

  1. 話題の TensorFlow を使って機械に学習させよう
  2. Azure Machine Learning を使ってクラウド上で機械学習してみよう
  3. .NET の中の ML.NET を使って学習済みのモデルを使ったアプリケーションを作ってみよう

サンプルコード/ツールの狙い (利用される方にとっての価値)

機械学習/ディープラーニングのモデルを作成するところから、.NET アプリケーションで使うまでの手順を、実際に手を動かしながら学ぶことができます。

Microsoft Build 2020 (2020/05/19-20)

マイクロソフトの最新の技術について、以下のようなオンラインイベントで情報が提供されました。

これらのイベントで公開された/公開予定の技術についてご紹介いたします。

.NET 関連

● One .NET (ひとつの .NET)
○ 現在の .NET

○ 次の .NET

以前から発表されている通り、次の .NET では次のようになります。

"One .NET" ということで、.NET が現在の .NET Core に統合され、.NET 5 となります。

.NET 5 に含まれないもの

ちなみに .NET Framework は 4.8 が最終バージョンです。今後は保守フェーズに入り、機能の新規追加はされなくなります。

.NET Framework のサポート自体は Windows 10 がサポートされている間は続くと思われます。

将来性から考えると、新規に .NET で開発する場合は、.NET Core を用いるべきだと考えられます。

.NET のロードマップ

上記のとおり、現在ある .NET Framework、.NET Core、Xamarin は一つの .NET に統合されます。

但し、2020 年 11 月の .NET 5 リリース時点では Xamarin の統合はプレビュー扱いです。

.NET 6 で完全に統合される見込みです。

.NET 6 は LTS (Long term support: 長期サポート) 版となる予定なので、新規開発に利用するのは、.NET 6 からが無難かも知れません。

● 新たなマルチプラットフォーム アプリケーション開発方法

Microsoft は既に Windows への囲い込みを行っていませんので、新たな開発方法としては Windows 以外の OS もサポートするマルチ プラットフォームなものを提供していくことになります。

注目すべきは、以下の二つです。

  • MAUI (Multi-platform App UI)
  • Blazor

将来的にはどちらもネイティブアプリケーションも開発できるものですが、MAUI は従来の Windows アプリケーション開発技術の延長にある技術、Blazor は Web アプリケーション開発技術の延長にあり、とりあえずは Web 開発用です。

ひとつずつ説明します。

○ MAUI (Multi-platform App UI)

MAUI というアプリケーション開発技術が発表されました。

MAUI の特徴は次の通りです :

XAML (Extensible Application Markup Language):

  • WPF や UWP、Xamarin Forms の UI 記述用言語
  • 今までは、XAMLWPF や UWP、Xamarin Forms で統一されていなかった
○ Blazor

現在すでに Blazor Server という、C# だけで Web アプリケーションが開発できるサーバーサイド技術が .NET で使用できますが、この技術が拡張され、Web アプリケーションだけでなくネイティブアプリケーションも作成できるようになることが予定されています。

Blazor の特徴は次のとおりです:

  • Web 技術の延長
  • 全体を C#/.NET で開発
  • UI は Razor (ASP.NET MVC の UI 言語) ベース

今回新たにリリースされたのは、Blazor WebAssembly 3.2.0 (GA) です。

近い将来この Blazor が拡張され、ネイティブ アプリケーション (Web アプリケーションでない Windows アプリケーション/Mac アプリ /iOS アプリ/Android アプリ) も作れるようになります。

  • Blazor Server (既存)
    • サーバーサイドを C# で記述。 ASP.NET WebForms に置き換わるものとされる。
    • クライアントサイドとは、SignalR で通信し、リアルタイムに同期をとる。
  • Blazor WebAssembly (今回リリース)
    • Blazor Server と違い、クライアントサイドで C# が動作する Web アプリケーションを作成できる
    • クライアント サイドのプログラムを JavaScript ではなく、C# で記述。
    • クライアント サイド (Web ブラウザー) 上で、WebAssembly の .NET が動作する
  • Blazor PWA (Progressive Web Application) (将来)
    • Web アプリケーションが単独のアプリケーションとして動作する
  • Blazor Hybrid (将来)
    • Electron や WebView を用いてデスクトップアプリケーションを開発
  • Blazor Native (将来)
    • ネイティブアプリケーションを開発
○ 参考
● 新たな Windows アプリケーション開発方法

新たな Windows アプリケーション ライブラリーとして WinUI 3 が発表になりました。

  • WinUI 3 Preview 1
    • UWP と Win32 アプリケーションをサポート
    • C/C++、.NET 5、WebView2、Fluent Design Controls に対応

■ 開発ツール関連

GitHub Codespaces/Visual Studio Codespaces

以下が発表されました:

  • GitHub Codespaces
  • Visual Studio Codespaces

Web 版 (クラウド版) の Visual Studio Code/Visual Studio です。

Visual Studio Codespaces は、以前 Visual Studio Online と呼ばれていたものです。

ネイティブアプリケーションだった Office が Web 版になり、Microsoft 365 になったように、様々なツールがクラウド版になっていきます。

Visual Studio
  • Visual Studio 2019 の 16.6 と 16.7 Preview 1 が公開されました。
  • Live Share でボイスチャットがサポートされます。
  • Windows Forms Designer for .NET Core がリリースされました。
  • Surface Duo (2 画面) の開発なども行えるようになってきました。
  • ML.NET 開発用の Model Builder が組み込まれました。
○ 参考
C# 9.0

C# 9.0 が発表されました。

○ 参考

■ Azure 関連

○ Azure

Serverless や AI/Data などを中心にアップデートされています。

  • Windows Server コンテナー
  • Private Link
  • Spot VM
○ Data 関連
  • Cosmos DB

Free Tier

AutoScale

Azure Synapse Link: データベース分析サービス

○ ML 関連
  • Cognitive Services
    • Personalizer
    • Speech Voice
  • Azure Machine Learning
    • AutoML 周り
    • Responsible ML
    • AI スーパー コンピューターの発表
○ 参考

■ Power Platform/Microsoft 365

○ Power Platform

Power Apps や Power Automate、Power BI、Dynamics 365、Microsoft 365 の新たな統合機能の発表

Microsoft 365 (旧名 : Office 365)

Microsoft Teams の多数のアップデートの予定が発表

Windows 関連

○ Terminal

Windows Terminal 1.0

次のような機能があります。

Microsoft Store からインストールできます。

  • タブ機能

タブごとに Windows Subsystem for LinuxコマンドプロンプトPowerShell など

タブの内部をペインに分割する機能

○ WSL2

WSL は、Windows に組み込まれた virtual な Linux 環境です。

Microsoft Store からインストールできます。

WSL2 で新たに GPU がサポートされます。 CUDA 利用できたり、GPU 版 Tensorfow が動作できたりします。

○ パッケージ マネージャー

winget という Windows Package Manager (Preview 版) がリリースされました。

Linux のようにコマンド ラインから簡単にアプリケーションなどがインストールできます。

参考:Windows Package Manager Preview | Windows Command Line

API

Project Reunion というプロジェクトが発表されました。

WindowsAPI は現在次のように 2 つ ありますが、これを統合しようというプロジェクトです。

■ 関連サイト

C#の新機能勉強会 ~C#7、8の新機能を活用して速く安全なプログラムを書こう~

C#の新機能勉強会 ~C#7、8の新機能を活用して速く安全なプログラムを書こう~」の資料をアップした。

C#7、8 では、struct (値型) 関連の便利な機能追加が多いので、その辺りに注力してみた。

資料

参考資料

BuriKaigi 2020 が開催されました

毎年冬に富山で開催されている BuriKaigi (*)。
今回も、90名もの方にご参加いただき、大いに盛り上がりました。

昨年までは2トラックでしたが、今回は3トラックになりました (ルームA, B, C)。
リンクなどをまとめておきます。

(*) BuriKaigi とは何かということは次に詳しく書かれています: Burikaigi という毎年冬のイベント | hikaruworld | Medium

開催概要

BuriKaigi 2020
日時 2020年2月1日(土) 13:00〜19:00 (終了後懇親会)
会場 富山県民会館 (懇親会会場: 割烹 扇)

イベントの様子

資料

ルームA
ルームB
ルームC
LT

写真・ビデオ

ブログ

新たな Web アプリケーションフレームワーク「Blazor」 &dash; ネイティブ アプリケーション開発も可能に

日本時間で昨日、「.NET Conf: Focus on Blazor」というオンライン カンファレンスが開催され、Blazor に関する新たな発表がなされた。
現在、セッション動画を観ることができる。

Blazor は、C#/.NET で Web アプリケーションを開発できるプラットフォームとして、.NET Core 3 で正式リリースされた。
従来の ASP.NET ではサーバーサイドを C#/.NET、クライアントサイドを JavaScript (や TypeScript) で記述していたが、Blazor ではサーバーサイドとクライアントサイドを統一した言語 (C#) で記述できるのが大きなメリットだ。これにより、単一のコードでモデルが記述できるようになる。

今回、Blazor に関して、以下のように多くの新技術が発表になった:

  • Blazor Server (以前発表済み)
    • .NET Core 3 で正式版
    •  Web アプリケーション (SPA: Single Page Application) 用
    • サーバーサイドでC#/.NETのコードが動作
    • クライアントサイドも JavaScript でなく C# で記述
  •  Blazor WebAssembly
    • 2020年5月に正式版の予定
    • Web アプリケーション (SPA: Single Page Application) 用
    • クライアントサイドでC#/.NETのコードが動作
    • クライアントサイドも JavaScript でなく C# で記述
  • Blazor PWA
    • 正式版は未定
    • PWA (Progressive Web Apps: デスクトップ アプリケーションのように動作するWeb アプリケーション) 用
  • Blazor Hybrid
    • 正式版は未定
    • Electron や WebView を使った HTML ベースのデスクトップ アプリケーション用
  • Blazor Native
    • 正式版は未定
    • HTML を使わないデスクトップ アプリケーション用
  • Mobile Blazor Bindings
    • 正式版は未定
    • Blazor のコードから iOSAndroid の機能を呼び出せるようにする仕組み
    • これにより Blazor で iOSAndroid のネイティブ アプリケーションを開発できる

参考資料

Boids (an artificial life program) —shoal simulator written in TypeScript—

Shos.Boids

Boids とは

Boids は、Craig Reynolds 氏によって作られた人工生命のシミュレーションだ。 Boid の名は、「Bird (鳥) oid (もどき)」から来ており、元は鳥の群れの動きを真似ている。それぞれの個体を次に上げる 3 つの規則にしたがって動かすというだけで、群れのような動きを実現している:

Boids の 3 つの規則
分離 (Separation): 近くの仲間にぶつからない方向に移動
分離 (Separation)
分離 (Separation)
整列 (Alignment): 近くの仲間が平均的に向かっている方に向かう
整列 (Alignment)
整列 (Alignment)
集結 (Cohesion): 近くの仲間の中心方向に移動する
集結 (Cohesion)
集結 (Cohesion)

参考ページ

デモ

TypeScript などで Boids のデモを 3 種類作成してみた。

鳥の群れではなく、魚の群れを意識した。

※ 各画像をクリックするとそれぞれのページへ飛ぶ

2D版: Boids (an artificial life program) —shoal simulator written in TypeScript
Boids (an artificial life program) —shoal simulator written in TypeScript
3D版: Boids (an artificial life program) 3D —shoal simulator written in TypeScript with Three.js—
Boids (an artificial life program) 3D —shoal simulator written in TypeScript with Three.js—
3D 裸眼立体視版: Boids (an artificial life program) 3D (Cross-eyed/Parallel Free-viewing Stereoscopy) —shoal simulator written in TypeScript with Three.js—
Boids (an artificial life program) 3D (Cross-eyed/Parallel Free-viewing Stereoscopy) —shoal simulator written in TypeScript with Three.js—

2D版では2次元ベクトル、3D版では3次元ベクトルで、個体の位置や速度を計算している。

2つの3D版は、Three.js というライブラリーを使って WebGL で動かしている。

参考:

3D 裸眼立体視版は、裸眼立体視 (交差法または平行法) ができる人向けだ。 立体視の方法については、次のページなどが参考になる。

参考:

なお、各版ともパラメーターを色々と変更できるので試してほしい。

これらのデモ ページの実装については、ソースコードを参照してほしい。

ソースコード

ソースコードは、GitHub に上げた:

開発環境/言語/ライブラリー

以下を使って作った:

Visual Studio Code

上記デモは、Visual Studio Code 上で作成した。

Visual Studio Code は、プログラミングに最適な Microsoft 製のテキスト エディターで、Windows 版、macOS 版、Linux 版がある。

HTML や CSS はもちろんのこと、JavaScript や TypeScript、C# などの多種多様なプログラミング言語にも対応している。

Git クライアント、ビルド、シンタックス ハイライト、リファクタリング、インテリセンスなどの機能を持ち、とても使いやすいのでお薦めだ。

どのような機能や言語が使えるかは、Extensions for Visual Studio family of products | Visual Studio Marketplace が参考になる。

参考:

TypeScript

TypeScript は、設定を変えることにより、"ES3"、"ES5"、"ES2015"、"ES2016"、"ES2017"、"ES2018"、"ES2019" にコンパイルすることができる。

デモでは、"ES5" を使っている。

TypeScript のコンパイル オプションは、"tsconfig.json"というファイルで行う。 今回は次のような内容とした。

tsconfig.json


{
  "compilerOptions": {
    /* Basic Options */
    "target": "ES5",        /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019' or 'ESNEXT'. */
    "module": "commonjs",   /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
    "sourceMap": true,      /* Generates corresponding '.map' file. */

    /* Strict Type-Checking Options */
    "strict": true,         /* Enable all strict type-checking options. */

    /* Module Resolution Options */
    "esModuleInterop": true /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
  }
}

TypeScript は、Visual Studio Code から簡単に JavaScriptコンパイルできる。

Visual Studio Code でのコンパイル
Visual Studio Code でのコンパイル

ちなみに、次のような TypeScript の場合:

class Vector3D {
    x: number;
    y: number;
    z: number;

    get absoluteValue(): number {
        return Math.sqrt(this.x * this.x + this.y * this.y + this.z * this.z);
    }

    constructor(x: number = 0, y: number = 0, z: number = 0) {
        this.x = x;
        this.y = y;
        this.z = z;
    }

    clone(): Vector3D {
        return new Vector3D(this.x, this.y, this.z);
    }

    plus(another: Vector3D): Vector3D {
        return new Vector3D(this.x + another.x, this.y + another.y, this.z + another.z);
    }

    plusEqual(another: Vector3D): void {
        this.x += another.x;
        this.y += another.y;
        this.z += another.z;
    }

    minus(another: Vector3D): Vector3D {
        return new Vector3D(this.x - another.x, this.y - another.y, this.z - another.z);
    }

    minusEqual(another: Vector3D): void {
        this.x -= another.x;
        this.y -= another.y;
        this.z -= another.z;
    }

    multiply(value: number): Vector3D {
        return new Vector3D(this.x * value, this.y * value, this.z * value);
    }

    innerProduct(another: Vector3D): Vector3D {
        return new Vector3D(this.x * another.x, this.y * another.y, this.z * another.z);
    }

    divideBy(value: number): Vector3D {
        return new Vector3D(this.x / value, this.y / value, this.z / value);
    }

    divideByEqual(value: number): void {
        this.x /= value;
        this.y /= value;
        this.z /= value;
    }

    getDistance(another: Vector3D): number {
        return this.minus(another).absoluteValue;
    }
}

"ES5" でコンパイルしてできた JavaScript はこんな感じ:

"use strict";
var Vector3D = /** @class */ (function () {
    function Vector3D(x, y, z) {
        if (x === void 0) { x = 0; }
        if (y === void 0) { y = 0; }
        if (z === void 0) { z = 0; }
        this.x = x;
        this.y = y;
        this.z = z;
    }
    Object.defineProperty(Vector3D.prototype, "absoluteValue", {
        get: function () {
            return Math.sqrt(this.x * this.x + this.y * this.y + this.z * this.z);
        },
        enumerable: true,
        configurable: true
    });
    Vector3D.prototype.clone = function () {
        return new Vector3D(this.x, this.y, this.z);
    };
    Vector3D.prototype.plus = function (another) {
        return new Vector3D(this.x + another.x, this.y + another.y, this.z + another.z);
    };
    Vector3D.prototype.plusEqual = function (another) {
        this.x += another.x;
        this.y += another.y;
        this.z += another.z;
    };
    Vector3D.prototype.minus = function (another) {
        return new Vector3D(this.x - another.x, this.y - another.y, this.z - another.z);
    };
    Vector3D.prototype.minusEqual = function (another) {
        this.x -= another.x;
        this.y -= another.y;
        this.z -= another.z;
    };
    Vector3D.prototype.multiply = function (value) {
        return new Vector3D(this.x * value, this.y * value, this.z * value);
    };
    Vector3D.prototype.innerProduct = function (another) {
        return new Vector3D(this.x * another.x, this.y * another.y, this.z * another.z);
    };
    Vector3D.prototype.divideBy = function (value) {
        return new Vector3D(this.x / value, this.y / value, this.z / value);
    };
    Vector3D.prototype.divideByEqual = function (value) {
        this.x /= value;
        this.y /= value;
        this.z /= value;
    };
    Vector3D.prototype.getDistance = function (another) {
        return this.minus(another).absoluteValue;
    };
    return Vector3D;
}());

class がないので、prototype と function での実装だ。

一方、"ES2019" でコンパイルしてできた JavaScript はこんな感じ:

"use strict";
class Vector3D {
    constructor(x = 0, y = 0, z = 0) {
        this.x = x;
        this.y = y;
        this.z = z;
    }
    get absoluteValue() {
        return Math.sqrt(this.x * this.x + this.y * this.y + this.z * this.z);
    }
    clone() {
        return new Vector3D(this.x, this.y, this.z);
    }
    plus(another) {
        return new Vector3D(this.x + another.x, this.y + another.y, this.z + another.z);
    }
    plusEqual(another) {
        this.x += another.x;
        this.y += another.y;
        this.z += another.z;
    }
    minus(another) {
        return new Vector3D(this.x - another.x, this.y - another.y, this.z - another.z);
    }
    minusEqual(another) {
        this.x -= another.x;
        this.y -= another.y;
        this.z -= another.z;
    }
    multiply(value) {
        return new Vector3D(this.x * value, this.y * value, this.z * value);
    }
    innerProduct(another) {
        return new Vector3D(this.x * another.x, this.y * another.y, this.z * another.z);
    }
    divideBy(value) {
        return new Vector3D(this.x / value, this.y / value, this.z / value);
    }
    divideByEqual(value) {
        this.x /= value;
        this.y /= value;
        this.z /= value;
    }
    getDistance(another) {
        return this.minus(another).absoluteValue;
    }
}

こちらは class があるので TypeScript のコードとあまり変わらない。"ES5" とは、まるで別の言語のように見えるのが面白い。