カテゴリー別アーカイブ: Ext JS

Modern ツールキットでのデータバインディング – Sencha ブログより

近頃、Sencha 本家のブログでは技術資料的な記事が少し少なくなっていましたが、先日久々に技術的な記事が掲載されました。

ご存じのように、Ext JS 6 では、以前の Ext JS (Version 5まで) と、Sencha Touch という2つのフレームワークがマージされました。 これまで、Ext JS のユーザーが Ext JS 6 へ移行する記事は、いくつか見られたのですが、Sencha Touch ユーザーに向けた、Ext JS 6 の解説記事はありませんでした。

この記事では、Ext JS 6 の ViewModel を modern ツールキットで使う方法が書かれています。ツールキットとは、Ext JS 6 のビジュアルな部分を受け持つところで、現在は、classic と modern の2つのツールキットが存在します。 modern ツールキットは、Sencha Touch の流れをくむツールキットです。

ViewModel は、Ext JS 5 で導入された、MVVM あるいは M-V-VM-VC という新しいアーキテクチャで採用された、ビューに関連してデータを保持するクラスです。 Sencha Touch だけをやってきた方には馴染みのない概念だと思いますが、これを利用することで、非常にアプリケーションを作成しやすくなります。

ではご覧ください。 Data Binding in the Ext JS Modern Toolkit | Sencha の翻訳です。 続きを読む

Ext JS 6 で複数環境に対応する方法

こんにちは、療養中の @martini3oz です。

Sencha から Ext JS 6 の GA が発表になってから、しばらく経ちますが、 このブログでは、まだ Ext JS 6 の話題を扱えていませんでした。

Ext JS 6 の目玉はいくつかあるのですが、最も大きな点は、Ext JS と Sencha Touch が「マージされた」ということでしょう。 以前から Sencha フレームワークをお使いの方は、「マージ」ってどういう風に?と思われることでしょう。 大まかに言うと次のようになります。

  • Ext JS と Touch のクラスシステムの微妙な違いを統一した
  • core パッケージという、共通部分を担うパッケージができた
  • classic と modern という二つの「ツールキット」を用意した
  • Sencha Cmd で、それぞれのツールキットを切り替えられるようにした
  • microloader で実行するビルドを切り替えられるようにした

クラスシステムの微妙な違いはこまりものでした。UI に関係のない Model の定義ですら違いがあったので、Ext JS と Touch の両方で使うクラスを書くことはほぼ不可能でした。クラスシステムの統一と core パッケージによって、これが解消されたのは非常に大きな事です。

そして、Ext JS 5 は classic というツールキットに、Touch は modern というツールキットになりました。 ツールキットは、ビジュアルクラス部分で、それぞれデスクトップ用、モバイル用と分類されますが、別な視点で言うと、レガシー用、HTML5用とも言えます。 Ext JS 6 の現在のバージョンでは、modern の方は Touch をそのまま移植した程度のコンポーネントになっていて、classic にはあるけど modern にはないコンポーネントが多数ありますが、これも徐々に増えていくそうです。

この「マージ」によって、一つのソースコードでデスクトップからスマートフォンまですべてに対応したアプリケーションを作ることが可能になったのでしょうか。 現状で言うと、「限りなくそれに近い」という答えになります。 classic と modern は別個のツールキットなので、一つの製品のなかに両者を混在することはできません。 しかし、両者の共通部分は一つのソースコードで記述できます。 また、classic と modern という二つのビルドはできるのですが、microloader の働きで、アクセスしてきたデバイスに応じて、読み込むビルドを自動的に選択してくれます。

レガシーブラウザからスマートフォンまで、すべてのデバイスで動作する、ユニバーサルアプリケーションを作る方法について、以下、Sencha のガイド Developing for Multiple Environments and Screens を翻訳しましたので参考にしてください。(翻訳ミスなどみつけたら教えてください) 続きを読む

Ext JS 5 データパッケージ

Sencha Advent Calendar 2014 も残すところ、2つとなりました。

もちろん、大トリは、@kotsutsumi さんですので、私が前座を取らせてもらいます。

この前の記事でご紹介した THE KIDDIE ですが、あのあとも色々と聴いているんですが、いいんですよ。楽曲もいいし、歌うまいし。皆さんも聴いてみて下さい。 最新曲 OMELAS の PV がこちらです。明日は、渋谷公会堂でライブです。行きたかったなぁ〜。

続きを読む

DYSTOPIA

この記事は、 Sencha Advent Carendar 2014 の16日目の記事です。 @martini3oz がお届けします。

新しいことを覚えるというのは、大変ですが楽しいものです。

僕も先日、新しい体験をしました。THE KIDDIE というロックバンドのライブを観に行ったのです。 それはもう、これまで全然知らなかった世界でした。 とても新鮮でしたし楽しかった。KIDDIE サイコー。揺紗くんサイコー、ユウダイくんサイコー!

あ、Sencha の話でした…

続きを読む

Sencha UG 勉強会@大阪に登壇します

来る 10月24日に、Sencha UG の第20回勉強会@大阪が開催されます。 大阪でやりますので、僕も登壇します。

参加申し込みはこちら

  • 日時 :2014/10/24 19:00 to 21:00
  • 定員 :15 人
  • 参加費 :無料
  • 会場 :株式会社ゼノフィ関西事業所 (大阪府大阪市北区東天満1-14-10 MF南森町2ビル 2階)

Sencha Ext JS 5 が公開されてしばらく経ちましたが、もうお使いの方、様子見の方、これから Ext JS を始められる方、といろいろではないでしょうか。Sencha UG 大阪では、全国に先立って Ext JS 5 をテーマにした勉強会を開催します。

続きを読む

Ext JS 5 のViewModel を使ってみる

Ext JS 5 から導入された ViewModel を使ってみます。 ViewModel はデータをビューにバインドする新しい方法です。 いろいろと機能が高く、API ドキュメントやチュートリアルを読んでも、まだすべてが解説されているというわけではないようです。

今回は、2way binding と呼ばれる、View と ViewModel 間での双方向のデータバインディングについて実験してみます。 続きを読む

Ext JS 5 パブリックベータ発表

Ext JS 5 のパブリックベータが発表になりました。

楽しみです。今回は Ext JS 4 からの後方互換性がかなり意識してリリースされているので、 Ext JS 3 から 4 へのドラスティックな変化のようなことはなさそうです。

しかし、エンジニアとして注目したい機能が沢山詰まっています。 これは楽しみです。

今日は、その中でもイベントのことについて触れましょう。 続きを読む

Ext.Next – もうすぐそこに

この記事は Sencha Advent Calendar 2013 – Adventar の23日目です。 年も押し迫ってきましたね。 前回のyasunagaさんのExt.Menuに関する興味深い話 に続いて、今日はExt JSの未来について語ります。

この記事は、 SenchaUG 誕生祭 のLTで話したことを元ネタにしています。 あの時は、マクラの話が長すぎて肝心の内容を端折ってしまいましたw ので、ブログ化しました。 続きを読む

約束の地 – Promised land

この記事は、 Sencha Advent Calendar 2013 の12日目の記事です。

都市再開発で、オフィスを市のやや北寄りの区域に移さなければならなくなった。 新しいオフィスは、マサチュセッツ大通りとボイルストン通りの角に突っ立っている二階建ての丸い塔のような建物の二階にあって、一階は煙草屋である。 前の住人は女占い師で、彼女が看板がわりに窓に貼りつけたつぎはぎの金文字をかみそりの刃で削りとっている時、その男の姿に気がついた。

ロバート・B・パーカー著「約束の地」より。

パーカーも亡くなっちゃったんですね。

今回はPromiseについてお話しします。 続きを読む