HyperAI超神経
Back to Headlines

「XMLUI:Reactの力とVisual Basicの簡便さを融合させた新時代のUI開発ツール」

2日前

XMLUI: 次世代ウェブ開発プラットフォーム 最近、ウェブ開発はますます複雑化しています。ReactやCSSの深い理解が必要となり、初心者にとっては高嶺の花となっています。しかし、XMLUIという新しいプロジェクトが、この状況を変える可能性を示しています。XMLUIは、1990年代のVisual Basic時代の概念を取り入れ、現代のリアクトベースのコンポーネント エコシステムをXMLマークアップでラップすることで、開発を簡素化します。 1990年代のVisual Basic時代 当時、Visual Basicは低レベルのコーディングの知識がなくても、豊富なコンポーネントを使ってアプリを作成することが可能でした。プロの開発者が作成したコンポーネントが BUSINESS BASIC のような言語で利用され、チャート作成、ネットワーク通信、データアクセス、オーディオ/ビデオ再生、画像スキャン/エディティングなど、多様な機能が提供されていました。これらのコンポーネントは、POSシステム、スケジューリングツール、医療・法務管理システムなど、多くの実用的なアプリケーションで使用されていました。 ウェブにおけるコンポーネント化の挑戦 しかし、ウェブへの移行とともに、この生態系は失われました。現在最も使われているReactコンポーネントは、低レベルの開発者だけではなく、使いこなすためには高度なスキルが必要です。XMLUIは、Reactコンポーネントをラップし、低レベルの開発者がVisual Basicの時代のように利用できるようにすることを目標としています。 TubeStops コンポーネントの例 XMLUIの特徴を示す簡単なアプリである「TubeStops」では、London Undergroundの駅情報とWi-Fi、トイレの有無を表示します。以下はマークアップの例: ```xml {$props.line} ``` 再アクティブなデータバインディング XMLUIのもう一つの重要な特徴は、再活性のデータバインドです。コンポーネントがユーザーの選択やキーストロークに反応し、APIから新しいデータを取得する仕組みがあります。以下は具体的な例: ```xml ``` テーマの柔軟性 XMLUIのテーマシステムは、CSSやスタイル・レイアウトディレクティブを書かずに、アプリが美しく動作するようデザインされています。テーマの切り替えも容易で、各コンポーネントには広範なテーマ変数が用意されており、テキスト色、背景色、マージン、ボーダーなどを調節できます。 スクリプティングと拡張性 XMLUIでは、基本的にはXMLマークアップでアプリを作成しますが、JavaScriptを使用し一部の Imperative 部分を処理することも可能です。これは高度な操作のために必要ですが、LMM助手が代わりに処理できるため、開発者は最小限の知識で対応できます。例えば、以下のようなJavaScriptスニペット: javascript function transformStops(stops) { return stops.map(stop => { const getProp = (key) => { const prop = stop.additionalProperties && stop.additionalProperties.find(p => p.key === key); return prop ? prop.value : ''; }; return { name: stop.commonName, zone: getProp('Zone'), wifi: getProp('WiFi'), toilets: getProp('Toilets'), lines: stop.lines ? stop.lines.map(line => line.name).join(', ') : '' }; }); } MCP(Model Context Protocol) MCPサーバーは、開発者が XMLUI と LMM 助手との効果的な協働を容易にするために提供されています。これにより、開発者は LMM 助手から適切な指示を得て、効率的にコードをリファクタリングしたり、新たなコンポーネントを定義したりできます。 配備の簡素化 XMLUIアプリの最小配備フットプリントは次のように非常にシンプルです: TableEditor ├── Main.xmlui ├── index.html └── xmlui └── 0.9.67.js index.htmlでは、XMLUIの最新スタンドアロンビルドをソースとして読み込みます: ```html ``` 静的なウェブサーバーまたはAWSバケットで簡単に HOST できるようになっています。 業界との共鳴 /n softwareの創業者Gent Hito氏は、「私たちはバックエンドの人間です。シンプルなビジネスUIを作成しようとした時に、それが多么しく且つストレスフルなのを見て驚きました」と述べています。XMLUIは、開発者がReactやCSSについて特別な知識を持たなくても使えるように設計されたもので、この問題を解決することを目指しています。XMLUIの導入により、より多くの開発者がユーザーアイテルフィースの作成にチャレンジでき、開発の democraticization が進むことが期待されます。

Related Links