Sencha Architect 3.1 の発表
こんにちは、ゼノフィnakamuraです。
Aaron Conran
Sencha社とArchitectのチーム全体を代表して、Sencha Architect 3.1 の公開を発表します。たくさんの新しい機能があり、その中でも最も注目すべきは Ext JS 5 のサポートです。Ext JS 5 の公開から短い期間で、Sencha Architect が
Ext JS 5 が提供する新機能
と同等の機能を追加しました。
貴重なフィードバックを頂いた、Sencha Architect 3.1 Early Access Program (EAP) の参加者に感謝します。
Sencha Architect での Ext JS 5 サポート
Sencha Architect 3.1 の最も大きいアップデートは、Ext JS 5 サポートの追加です。 Ext JS 5 はたくさんの 新しい、刺激的な機能 を提供しています。タッチ対応、アーキテクチャの改善 (MVVM)、レスポンシブコンフィグ、コンポーネントアップグレードなど。この幅広い機能は、全て Sencha Architect でサポートするようになりました。
MVVM アーキテクチャ対応
Ext JS 5 では MVVM アーキテクチャのサポートを導入し、ViewController が 直接 Views に連携されるようになりました。 この新しいアプローチに対応するために、Sencha Archtect 3.1 では、生成するそれぞれのビューに対して、自動的に ViewController を生成します。 また、新たな MVVM のアプローチで、「双方向データバインディング」という技術で、ViewModel はモデルのデータと、ビューの間の変更を管理します。 Sencha Architect 3.1 は、生成するビューに対して、自動的に ViewModel を生成します。 是非 ViewModels と ViewControllers を利用して下さい。 因に、もし既存の Ext JS 4.2.x のアプリケーションをアップグレードしているなら、Sencha Architect は既に慣れている MVC の構造の使用を続けつつ、同時に MVVM の機能性も活用できるようにします。
ルーティングの対応
Ext JS 5 に新しく導入されたルーティング機能のサポートを追加しました。このため、アプリケーションの URL をアクションとメソッドに変換し、アプリケーション内で 「ディープリンク」の実装が可能となります。Sencha Architect 3.1 は、どの URL で関数を発火するか宣言するための、非常にシンプルなインターフェースを提供します。
タッチに最適化されたチャートのサポート
Ext JS 5 では、新しいハイパフォーマンスなタッチ最適化されたチャートのパッケージ（Sencha Touch チャート上に構築された）を追加しました。これは（パン、ズームなど）の操作への対応、いくつかの新しいチャートの種類、既存のチャートの種類の改善などを提供しています。
この新しいチャートのパッケージと、過去の Ext JS 4 のレガシーチャートには大きい違いがあります。違いがあるため、Sencha Architect 3.1 はチャートを自動的にアップデートする事はできませんが、新しいチャートパッケージを利用して切り替えるように指示されます。Ext JS 5 のフレームワークで、独立したパッケージとして、レガシーチャートが提供されていますが、Sencha Architect 3.1 はレガシーチャートの利用はサポートしていません。しかし、新しいチャートのパッケージへの アップデートの移行情報 を提供しています。
Ext JS 4.2.x アプリケーションを Ext JS 5.0.x へ移行する
Sencha Architect 3.1 の大きな目的は、Ext JS 4.2.x のアプリケーション（以前の Sencha Architect のバージョンを利用して作成されたもの）の移行を出来るだけ簡単にする事でした。
アプリケーションをアップグレードするには、Sencha Architect 3.1 で Ext JS 4.2.x のプロジェクトを開いて、Resources の下の Library ノードを右クリックし、Upgrade to Ext JS 5.0.x をクリックして下さい。Ext JS は、新しい MVVM と以前の MVC アーキテクチャの両方に対応しますので、既存のアプリケーションでは、MVVM から MVC に切り替える必要はありません。 Sencha Architect 3.1 は、自動的にあなたの MVC コードを MVVM に変換しませんが、既存のMVC 構造と同時に新しい MVVM アーキテクチャの使用を始める事が可能となります。
Sencha Architect 3.1 での Sencha Cmd 5
最新の Sencha Architect 3.1 とインテグレーションしたSencha Cmd 5.0.x も、Sencha Architect と Cmd が互いに素早く、よりよく動作できるための最適化がいくつ含まれています。
Sencha Architect 3.1は Sencha Cmd の “sencha app watch” の機能を活用し、継続的に変更があるか確認しながら、自動的にアプリケーションの変更を取り込んだり、再コンパイルします。 Sencha Cmd 5.0.x と共に、Sencha Architect 3.1 は独自の軽量の Web サーバーにデプロイできます。概念実証（POC）のプロジェクトや、始めたばかりでサーバー環境がまだ設定されてない場合に役立ちます。Web サーバーの構成は、Preferences -> Web Server にありますので、有効にも無効にもできますし、ポート番号も指定できます。
Sencha Architect 3.1 のその他の改善
改善されたプロジェクトインスペクター
Sencha Architect 3.1 のプロジェクトインスペクターは大きく改善され、ナビゲーションや大規模なプロジェクトをより速くロードできるようになりました。新しいプロジェクトインスペクターは、名前空間をフォルダとして表示します（ユーザーが多く希望していた機能）。これはクラスを整理したい時にとても役に立ちます。インスペクターには、隣同士に配置されている二つのツリーパネルがあります。左のペインはトップレベルのクラスを全て表示し、右のペインは、選択されたクラスの詳細を全て表示します。
リンクされたインスタンスの視覚化
Sencha Architect は常に、既存のビューをビルディングブロックとして再利用し、他のビューを作成できるようになっていました。この機能をリンクされたインスタンスと呼んでいます。手動でコーディングする際に、サブクラスを作成してそのクラスを再利用するのと同じことです。シンプルで DRY ( http://ja.wikipedia.org/wiki/DRY ) です。
単一のペインのインスペクターを二つのペインに拡大した時、クラスの間の関係を視覚化する方法も変更する必要がある事が明らかになりました。詳細インスペクターでクラスの各インスタンスからクラスが定義される場所まで、ベジェ曲線を描きます。
メインパネルでリンクされているインスタンスをクリックすると、逆の接続が表示されます。このクラスが利用されているインスタンスを全て一覧します。
Helper Tool ヘルパーツール
あなたの開発をサポートするために、通常よくある使用事例を提供する “helper” ツールを追加しました。Helper の初期の実装は、データ UI ビルダーが含まれています。この機能は、Sencha Architect の今後のリリースで改善していきます。
テーマの改善
Sencha Architect 3.1 は、 “Quick Themes” という新しいテーマの機能を提供します。Quick Themes はカスタムテーマと同じように動作し、いくつかの変数を変更するだけで、Neptune と Neptune Touch (デフォルトのExt JS テーマ）に対する素早い変更が可能となります。各コンポーネントをカスタマイズする必要がないため、ユーザーは大きく時間を節約できます。もしより細かいカスタマイズが必要な場合には、Quick Theme は通常のカスタムテーマに変換できます。他にも、速さ、SCSS 変数のオートコンプリート、グラデーション セレクター、フォントセレクターなどが改善されました。
エディターの改善
Sencha Architect 3.1の編集方法が変更され、クラス内のインライン編集ができるようになりました。 ユーザーは、プロパティの編集、関数の生成、コメントの追加の際に、クラスのコンテキストを完全に見ることができます。
謝辞
Sencha Architect に Ext JS 5 のサポートを追加するのは、とても大きい課題でしたので、Early Access Program (EAP) の参加者からのフィードバックとコメントはとても助かりました。このリリースに関してとても嬉しく思います。是非皆様の体験を教えてください。さらに改善できるように、是非 Sencha Architect 3.x のフォーラムで感想を聞かせて下さい。
