Ext JS の多言語化について

2016/02/11 に Sencha の公式ブログに Internationalization & Localization with Sencha Ext JS という記事が掲載されました。

僕自身 Ext JS での多言語化については、いろいろと苦労をしてきましたが、これはなかなかにエレガントな解決方法を提唱していると思ったので、記事の内容を日本語で紹介したいと思います。単に翻訳ではなく、僕の言葉で解説したいと思います。

multilingual Photo credit: quinn.anya via Visual hunt / CC BY-SA

続きを読む

Sencha Ext JS で美しい線画を描く Part 2

昨日、一つ前の記事を翻訳して公開したところ、タイミングの良いことにその Part 2 が今朝 Sencha 本家の方で公開されました。 連載ですので、一旦手をつけたら翻訳も続けないといけないと思うので、Part 2 も翻訳しました。(文章部分が少なかったので楽でしたw)

元記事は Creating Beautiful Drawings Using Sencha Ext JS – Part 2 | Sencha です。 続きを読む

Sencha Ext JS で美しい線画を描く Part 1

先日、急に熱が出まして、入院する羽目になってしまいました。 今もまだ病室の中なんですが、もうじき退院できそうです。 体調が良くなってきたので、Sencha ブログの翻訳をしてみました。

Sencha 公式ブログの Creating Beautiful Drawings Using Sencha Ext JS – Part 1 | Sencha の翻訳です。 Draw パッケージは、API ドキュメント以外になかなかいい資料がないので、この連載は楽しみです。 僕としては、この回にもうすでに目からウロコな話がありました。 続きを読む

Sencha JetBrains プラグインの話

これは、 Sencha Advent Calendar 2015 の 3日目の記事です。

僕は、もの午後頃着いたときから Vimmer でした。(嘘

一旦 Vimmer になってしまうと、指が覚えたあの世界から抜け出すことは本当に難しいものです。 しかし、今 JavaScript / Sencha Ext JS での開発には、PHPStorm を使うようになりました。 続きを読む

オシャレなユニバーサル アプリの作り方 – その2

連載記事の一回目を翻訳してしまったので、パート2も翻訳しました。

Sencha 公式ブログの How to Build a Great Looking Universal App with Ext JS – Part 2 | Sencha の翻訳になります。

ユニバーサル アプリを構築する際のキモとなる、2つのツールキット。そして双方にまたがるコードはどこに置くのか。2つのツールキットで作成したアプリは、実行時にどのように選択されるのか。

といった、「ユニバーサル アプリ」と聞いて、湧いてくる疑問に答えてくれています。

著者は Lee Boonstra です。彼女のブログは翻訳しやすくて、内容も整っているので大好きです。

ではご覧ください。

続きを読む

オシャレなユニバーサル アプリの作り方 – その1

Ext JS 6 の最大の「売り」は、デスクトップとモバイルのアプリを1つのコードベースで記述できるという点です。Sencha ではそうしたアプリのことをユニバーサル アプリと呼んでいます。 とはいえ、これまで Ext JS と Sencha Touch で、重複するコードを書かされてきた我々としては、実際にどうやれば1つのコードベースに統一できるのか、というところが見えてきません。

Sencha の公式ブログで、ユニバーサル アプリの作り方について書かれた記事が掲載されました。それを翻訳してみましたので、ご覧ください。

続きを読む

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 を翻訳しましたので参考にしてください。(翻訳ミスなどみつけたら教えてください) 続きを読む