App Builderリリース:ロードオンデマンド階層グリッド、DevOps統合、入力検証など!

5月にリリースされたApp Builderの最新のアップデートでは、開発の簡素化、パフォーマンスの向上、開発者やデザイナーによるアプリの動作とユーザーエクスペリエンスの制御を強化するために設計された強力な新機能が提供されています。階層グリッドでのよりスマートなデータロードから、ネイティブのAzure DevOps統合、コンポーネント間の高度な検証ルールまで、このリリースには生産性を向上させる機能が満載です。

これらの新機能について詳しく説明する前に、初めてApp Builderについて学ぶ場合は、組織のアプリケーション開発プロセスの主要なツールと見なすべき理由を簡単に共有しましょう。

• ビジュアルアプリビルダー –経営幹部、エンタープライズアーキテクト、開発チームリーダー、デザイナー、開発者、ステークホルダーのための統合プラットフォームです。
• クラウドベースの WYSIWYG ドラッグ アンド ドロップ ツールにより、企業はこれまでより 80% 速く完全なビジネス アプリを設計および構築できます。
• ​ローコード ツールは、Angular、React、Web Components、Blazorの量産対応コードを生成し、Figmaデザインをコードに変換します。

このApp Builderリリースの新機能

Load-on-Demand の階層グリッド

RowIslandsを通じて階層グリッドでロード・オン・デマンドを構成できるようになり、必要な場合にのみ子データをロードできるようになりました。これにより、ネストされた大規模なデータセットでの作業が大幅に高速化され、効率が向上します。

主なハイライト:

• 階層データにバインドされたときに、ネストされたRowIslands(最大5レベル)を自動生成します。
• 各RowIslandは個別に設定可能で、フィルタリング、ソート、ページネーション、編集をサポートします。
• 子データは、親ローが展開されたときにのみロードされ、別々のデータ要求を使用します。
• アウトラインパネルに視覚的な階層が表示され、直感的なナビゲーションとデザインを支援します。

ユースケースの例:

Customers、Orders、および OrderDetails に個別のデータ ソースを定義します。グリッドは、行を展開するときに必要なものだけを読み込むため、UI エクスペリエンスが速く、よりクリーンになります。

子レベル間の -> コピー アンド ペーストが無効であること、親のやり直しがサポートされていないこと、並べ替えが同じ親内でのみ許可されること、CRUD、リモート データ バインディング、子グリッドでの操作が将来のリリースのロードマップの一部であることに注意する必要があります。

Azure DevOps の統合

App Builderを Azure DevOps に直接接続できるようになったため、数回クリックするだけでシームレスな CI/CD パイプラインとコードのハンドオフが可能になります。このテーマに関する完全なヘルプドキュメントをお読みください。

あなたができること:

• 既存の Azure DevOps プロジェクトに接続する
• ソース コード (Angular、React、Blazor、またはWeb Components) を作成して DevOps リポジトリに直接発行します
• 自動 CI ビルドをトリガーする
• プルリクエストによるフォローアップ変更の提出
• ライブデプロイの準備をする (近日公開予定)

Authentication Tip: Only Work or School Microsoft accounts (Azure AD) are supported for authentication. Personal Microsoft accounts (e.g., @outlook.com) are not compatible without converting to a work account or adding them as a guest to your Azure AD tenant.

フォーム、グリッド、および入力の入力検証

Validationが大幅にアップグレードされました! App Builderでは、フォーム、グリッドコンポーネント、およびスタンドアロン入力全体の入力検証ルールがサポートされるようになりました。

サポートされているルール:

• min, max (数値/日付入力)
• minLength, maxLength
• pattern (例:メール形式、電話マスク)
• required

次の検証が適用されます。

• Swagger スキーマからの読み取り時に自動的に
• カスタムルール定義を使用して手動で行う(スキーマルールを上書きする)
• さまざまな入力インタラクション中(ぼかし、送信、編集など)

​HTML5 Standardによる検証状態

入力タイプ	min / max	minLength / maxLength	pattern	筆記
Eメール	❌	✅	✅	カスタム形式にパターンを使用する
検索	❌	✅	✅	フリーテキストのように動作します
電話番号 (tel)	❌	✅	✅	カスタム数値形式に最適
テキスト	❌	✅	✅	最も柔軟な入力タイプ
パスワード	❌	✅	✅	強度ルールに使用
数	✅	❌	❌	HTML5 制限パターンのサポート
日付	✅	❌	❌	strict を使用しますYYYY-MM-DD

複数列ヘッダーと折りたたみ可能な列グループ

このApp Builderリリースでは、複数列ヘッダーと折りたたみ可能な列グループが導入され、より整理された応答性の高いグリッドレイアウトを作成できるようになりました。

機能のハイライト:

• 複数の列を 1 つの親ヘッダーの下にグループ化します。
• 折りたたみ可能なグループは、展開/折りたたみして、表示される列を制御できます。
• 表示設定、ピン留め、状態 (展開/折りたたみ) は、プロパティパネルまたはアウトラインパネルで設定します。
• ​igx-column-groupコンポーネントとcollapsible and visibleWhenCollapsedなどのプロパティによって支えられています。

技術的な制限:

• Angular と Ignite UI の再帰的レンダリングと動的構造の更新に関する制限により、現在サポートされているグループ化のレベルは 1 つだけです。
• ピン留め: 子列をピン留めする場合は、その親グループもピン留めする必要があります。

主な機能:

• マスタービューと子ビューの両方でコンテナを追加RouterOutlet。
• 2 レベルのディープ ナビゲーション (Customers → Orders → Order Detailsなど) を有効にします。
• 将来のリリースで導入される予定の最大 5 レベルのルーティングに備えます。
• マスター/ディテール シナリオ、ダッシュボード、またはプログレッシブ ディスクロージャー UI に最適です。

まとめ

5 月のリリースは、App Builderでスケーラブルで最新のアプリ エクスペリエンスを提供するという Microsoft の継続的な取り組みを反映しています。複雑なデータグリッドの設計、堅牢な検証ルールの適用、DevOpsワークフローの合理化など、このアップデートにより、より迅速に行動し、より優れた構築を行うためのツールが提供されます。

今すぐappbuilder.devの新機能をお試しください

結論として、App Builderはアプリ開発プロセスのゲームチェンジャーである。クラウドベースのビジュアル・ビルダー、ローコード機能、そして新機能を備えたこのツールは、あらゆる組織にとって必携のツールだ。今すぐお試しください！より詳細な情報が必要な場合は、こちらをご覧ください：

• Discordチャンネル。
• GitHub のディスカッション。
• ロードマップ。

最新のApp Builderアップデートのすべてを体験するには、カスタマーポータルにアクセスして最新バージョンを入手してください。いつものように、私たちはあなたのフィードバックを受け取り、あなたが追加したいものや推奨したいものを聞くことに常に興奮しています。ですから、zkolev@appbuilder.devにメールを送って、Infragisticsで顧客に価値を提供し続けるために私たちがどのように支援できるかを教えてください。