C#/.NETでSPA開発を可能にする「Blazor」の進化、ビジネスUIコンポーネントの組み合わせで高速なWeb開発を実現[PR]

今回は「C#/.NETでSPA開発を可能にする「Blazor」の進化、ビジネスUIコンポーネントの組み合わせで高速なWeb開発を実現[PR]」についてご紹介します。

関連ワード (実装、膨大、開発環境等) についても参考にしながら、ぜひ本記事について議論していってくださいね。

本記事は、Publickey様で掲載されている内容を参考にしておりますので、より詳しく内容を知りたい方は、ページ下の元記事リンクより参照ください。


「Blazor」は、いわゆるSPA(Single Page Application)と呼ばれる動的なWebアプリケーションを、C#を始めとする.NETのテクノロジーで開発できる、マイクロソフトが開発しているWebアプリケーションフレームワークです。

SPAのような比較的高度なWebアプリケーションの開発には、ReactやAngularなどJavaScriptのフレームワークを用いることが一般的です。

しかし.NETテクノロジーを利用してきた開発者にとってJavaScripを中心とした開発への参入は、プログラミング言語やフレームワーク、ライブラリ、開発環境に至るまで新しく学び直すことになるという、非常に高いハードルを越えなくてはなりません。

それがBlazorを用いることで、サーバサイドからユーザーインターフェイスに至るまで、C#やVisual Studioなどの.NETテクノロジーを用いたこれまでの知識と経験を活用して、高度なWebアプリケーションの開発を進めることができるようになります。

特にこれからのビジネスアプリケーションは、デスクトップアプリケーションとして実現されてきた機能の多くをWebアプリケーションへと移植することが求められるはずです。

そのとき、SPAのような動的なWebアプリケーションの開発は欠かせないものとなるでしょう。

その点でBlazorは間違いなく、.NETプログラマにとって注目すべきWebアプリケーションフレームワークだと言えます。

複数の実装があるBlazor

Blazorは複数の実装が用意されていて、用途に応じて使い分けることができます。

1つ目の実装は「Blazor Server」です。サーバ側の.NET環境でビジネスロジックの実行とユーザーインターフェイスの生成が行われ、WebブラウザとWebSocketで接続してユーザーインターフェイスの表示を行います。

2つ目の実装は「Blazor WebAssembly」です。これはWebブラウザ上でWebAssemblyによって.NET環境を実現することで、サーバサイドに.NET環境がなくともWebブラウザの上でC#/.NETアプリケーションを実行可能にします。

fig

そして最新の.NET 8では、サーバサイドレンダリング機能により静的なWebページをサーバサイドで生成し高速なWebサイトを実現する機能がBlazorに統合されました。

これによりBlazorはフルスタックなUIを実現するフレームワークに進化したと発表されました。すなわち、最新のBlazorを用いることで、.NETプログラマはフルスタックのWebアプリケーション開発力を得ることになるということです。

ビジネスアプリケーション開発を支援する「Ignite UI for Blazors」

Blazorでは「Razorコンポーネント」が、コーディングにおける高い開発生産性と柔軟なユーザーインターフェイス実現のカギとなっています。

Razorコンポーネントがあることで、手軽に高度なユーザーインターフェイスを開発できるのです。

そしてBlazorにあらかじめ用意されているネイティブなRazorコンポーネントに加えて、スプレッドシートライクなUIの高度なデータグリッドやチャート機能など60種類以上を提供するUIコンポーネント群など、ビジネスアプリケーション開発を支援するコンポーネント製品が提供されています。「Ignite UI for Blazor」です。

fig

「Ignite UI for Blazor」には、ドラッグ&ドロップで簡単にユーザーインターフェイスが開発できる「App Builder」が連携製品として存在しており、開発者に一段高い開発生産性をもたらしてくれます。

開発元であるインフラジスティックスは1989年に米国で創業し、長年にわたってWindowsやWebに対応したコンポーネント製品の提供で知られる企業です。日本法人であるインフラジスティックス・ジャパンも2000年に設立され、20年以上の実績を持ちます。

fig

同社が提供するIgnite UI for Blazorに関するプライオリティサポートは、製品だけではなくBlazorのプログラミングに関する質問にも対応しています。

製品の特徴を紹介していきましょう。

業務システムでの利用に耐えうる高速データグリッド

「Ignite UI for Blazor」には35以上のネイティブ Blazor UIコントロールが含まれています。

最も代表的なコンポーネントは、Webブラウザ上で大量のデータを扱える「データグリッド」です。

行列ともにDOM仮想化による大量のデータ表示に最適化されており、多数の行もしくは列を用いて業務システムで取り扱うような膨大なデータを高速に処理できます。

データグリッドと次に紹介するチャート、そして画面レイアウトを自由に構成可能なドックマネージャを用いることで、コーディングをほとんど行わなくとも情報ダッシュボードとして大量のデータを柔軟に表示して分析可能にし、同時にグラフで表示するWebアプリケーションが可能になります。

fig

データグリッドは表示方法によって、以下の4種類の選択が可能です。

  • 表形式の「データグリッド」
  • テーブルを入れ子にできる階層形式の「階層グリッド」
  • データをツリー構造で表示する「ツリーグリッド」
  • ピボット可能な「ピボットグリッド」
fig左が階層グリッド、右がツリーグリッドの例

どのデータグリッドにおいても、ソートやデータのフィルタリング、行の選択と移動、固定、グループ化を始めとするさまざまな操作が可能です。

データのスタイリングに関しても、テンプレートでの設定、ダークモードへの対応、セルごとの色やフォントの設定など柔軟に行えます。

65種類以上のグラフやチャートが表示可能

Ignite UI for Blazorの「チャート」は、折れ線グラフや棒グラフ、円グラフ、散布図バブルチャートなどを始めとする、65種類以上のグラフやチャートが表示可能です。

fig

株価チャートでは、棒グラフや折れ線グラフに加えてローソク足チャートにも対応。リアルタイムにデータが流れ込んでくるストリーミングデータに対する動的なグラフ表現も可能です。

チャートもグリッド同様に大量のデータポイントを設定しても高速な表示が可能で、その性能は金融機関での利用などにより裏付けられています。

そして、こうしたさまざまなコンポーネントをWebブラウザ上で柔軟にレイアウトできるだけでなく、ユーザー自身が使いやすいようにカスタマイズできるのが「ドックマネージャー」です。

fig

WYSIWYGで高速にアプリ開発が可能

そして「Ignite UI for Blazor」を用いて高速なビジネスアプリケーションの開発を実現するのが、Webブラウザベースの開発ツール「App Builder」です。

下記の画面で分かるとおり、豊富なサンプルレイアウトを基に、左側に並んでいるUIコンポーネントを画面上にドラッグ&ドロップし、画面右側のプロパティで詳細を設定していくことで、HTMLやCSSを記述することなく、アプリケーションの画面構成を開発できます。

デザインはSketchやFigmaからもインポートできるため、デザイナーとも連係が可能です。

fig

開発中はインスタントプレビューで確認できます。UIコンポーネントにREST API経由でデータ ソースに接続すると、データの表示も可能。

開発したアプリケーションはコードをダウンロードもしくはGitHubへ送って、好みのエディタで完成させることになります。

日本仕様への対応と問題解決に役立つプライオリティサポート

インフラジスティックス・ジャパンはこうした製品の日本語化だけでなく、日本仕様への対応も進めることで、日本のビジネスニーズに答えた製品を提供しています。

fig

製品のサポートについてもビジネスアプリケーション開発者を支援するため、サンプルコードなどの具体的で問題解決にすぐに役立つ情報提供を行うだけでなく、製品のベースとなっている技術。例えばIgnite UI for BlazorであればBlazorや.NETに関する質問についても対応する「プラオリティサポート」を提供。

fig

同社製品を用いることで、Blazorに代表される新しいプラットフォームを採用する場合でも不安なく取り組めるのではないでしょうか。

サブスクリプションのみのシンプルな価格体系

本記事で紹介した「Ignite UI for Blazor」は、1開発者あたりの年間サブスクリプションのみのシンプルな価格体系で、配布用のライセンスや本番環境用ライセンスといった料金は不要。

1開発者当たりの価格は1年で15万円(税別)、3年契約で12万7000円(税別)。プライオリティサポートを含めるとプラス6万円。App Builderは1開発者あたり1年で18万円(税別)、3年契約で15万3000円(税別)などです。

fig

また、デスクトップアプリケーション向けの製品ライセンスなどを含んだ「Infragistics Professional」や、App Builderなどの開発ツールまで含んだ「Infragistics Ultimate」なども提供していますので、詳しくは同社の価格表をご覧ください。

≫Ignite UI for Blazor

(本記事はインフラジスティックス・ジャパン提供のタイアップ記事です)

COMMENTS


Recommended

TITLE
CATEGORY
DATE
大成建設、年60万件を処理する経費精算システムをクラウドに移行
IT関連
2023-10-04 01:36
Valveの携帯ゲームPC「Steam Deck」の分解動画をiFixitが公開、SSDやアナログスティックは交換しやすい設計
IT関連
2022-02-17 12:35
メルペイ、ニトリホールディングスにコード決済サービスを提供
IT関連
2024-02-21 06:41
大同ゴム、現場業務支援とデータ活用でエッジコンピューティン基盤を運用
IT関連
2023-04-05 16:26
GitHub、Wikiページにも画像をドラッグ&ドロップで追加可能に
GitHub
2022-02-28 22:34
期限の制約なく無料で提供される「Free Tier」クラウドサービスまとめ、DBaaS/BaaS/その他編(2024年版)
BaaS
2024-06-10 23:45
ゲームインフラのスタートアップPragmaはGreylockやZyngaの創設者などから約13億円調達
ゲーム / eSports
2021-04-22 09:29
Cloudflare、エッジアプリにAIをもたらす「Constellation」発表。画像認識、アノマリ検出、テキスト処理、音声認識など可能
Cloudflare
2023-05-17 01:23
規制順守で止まらない、積極的なセキュリティアプローチへの転換–タレス・兼子氏
IT関連
2025-01-11 19:27
グーグル、最新AIモデルで危機にある人々の検索を改善–「MUM」活用
IT関連
2022-04-02 18:51
バイデン大統領の多様性への取り組みが、ビジネスリーダーの方向性を導く
パブリック / ダイバーシティ
2021-03-07 11:09
脆弱性矯正修復プラットフォームのVulcan Cyberが22.9億円調達、脆弱性スキャナーを無料で提供
セキュリティ
2021-03-19 04:19
オラクルとRed Hatが戦略的提携。Red Hat Enterprise LinuxをOracle Cloudが正式にサポート。ハイブリッドクラウド構築など容易に
Linux
2023-02-02 23:06
ソニー「ZV-E10」はレンズ交換できる民生用ビデオカメラ 新しい市場を作るか :荻窪圭のデジカメレビュープラス(1/2 ページ)
くらテク
2021-07-29 14:00