HOME > 開発者向けBLOG > Sencha Blog >  Ext JS カスタマースポットライト: TriNet

Technology Note 開発者向けBLOG

Sencha Blog

Ext JS カスタマースポットライト: TriNet

こんにちは、ゼノフィnakamuraです。

この記事は、US Sencha社ブログ Ext JS Customer Spotlight: TriNet を翻訳したものです。

TriNet は、中小企業が自社での製品の開発、サービス、従業員に集中できるように、人事ソリューションを提供しています。産業の形に合わせるために TriNet が人事に関する業務を行う製品をまとめたものは、賃金台帳、給付金、給与管理、リスクやコンプライアンス削減などを提供しています。そして、それらは優秀な人材が集められた人事部と、紙を使わないクラウドプラットフォームによって行われています。TriNet は、日々企業や雇い主が直面するであろう責任を代わりに担い、人事にかかるコストや従業員に関わるリスクを削減することで、そういった企業の手助けをしています。

Ext JS を選んだ理由

我々はいくつかのアプリケーション (TriNet Payrollを含む)を Ext JS で作りました。TriNet Payroll は強化された給与支払ソリューションであり、予想される支払いを実際に処理される前に、クライアントがプレビューで見られる様な仕組みのものです。

Ext JS は、エンドツーエンドのソリューションであり、「単一の真実である情報源」のデータがそのまま産業ベースのユーザーインターフェースコンポーネント (グリッド、チャート、ドローイング、アニメーションなど )に直結しています。我々は Ext JS のグリッドを給与支払い簿や休暇願アプリケーションにおいて広範囲で使用しています。Ext JS のグリッドは非常に強力かつ、速く、ビルトインでカラムのソートや表示/非表示の機能があります。TriNet ダッシュボードアプリケーションも複数の Ext JS チャートコンポーネントを使用し、リッチでインタラクティブなユーザー体験を提供しています。そういった幅も深さもある機能と標準化された APIにより、我々はビジュアルデザイナーやプロダクトマネージャーがイメージするどんなものでも素早くマーケットに届けることが可能となっています。

我々が Ext JS 5 を選んだ理由は、企業クラスのリッチなインターネットアプリケーションを作る上で、ドラマティックな利点が複数あるからです。

我々は AngularJS、jQuery UI と YUI、も検討しましたが、企業クラスでリッチなインターネットアプリケーションを作る上で、ドラマティックな利点が複数あるから、Ext JS を選びました。例えば素晴らしいユーザー体験をデスクトップとタブレットデバイスに同じコードを使って届けることができてしまいました。デスクトップとタブレットデバイスにビルトインで対応しているということは、どちらかの環境に対応させるためにアプリケーションをカスタムコーディングする量が非常に少ないということです。また、Sencha Cmd が Cordova と統合されているため、ハイブリッドなタブレットアプリケーションを作ることも可能です。API の一貫性、コンポーネントの奥の深さや、タイトなインテグレーションは、リッチで直感的なインターフェースを作るための強力なツールとなります。

また、Ext JS 5 は、たくさんの時間を削減してくれます。Ext JS フレームワークは、一般的なブラウザに全て対応していて、ブラウザ互換についてエンジニアの力を使う必要が全くありません。

Sencha Cmd は Sass / Compass とシームレスに統合されていて、それにより我々のチームが CSS を書く時間が削減され、テーマやスタイルをより整頓されたものにし、再利用できるメカニズムになりました。また、より深くアプリケーションスタイルをカスタマイズすることも可能になり、重要なお客様やマーケットセグメントの特定のニーズに応えやすくなりました。

Ext JS を使う上でのビジネス的価値

我々は Sencha Support やプロのサービスから多くの専門家の力を借りました。Sencha Support のエンジニアは常に夜や週末までもを犠牲にし、我々に時間を使ってくれました。彼は Ext JS 開発についての知識量に長けているだけではなく、素晴らしいメンターであり難解なテクニカル問題もクリエイティブに解決してくれました。

オブジェクト指向の JavaScript フレームワークとして、強力で完全に機能するクラスシステムを持つ Ext JS は、Java などその他の言語に親しみがあるソフトウェアエンジニアにはわかりやすい仕組みとなっています。

オブジェクト指向の JavaScript フレームワークとして、強力で完全に機能するクラスシステムを持つ Ext JS は、Java (アプリケーションのバックエンドで使用している言語 )などその他の言語に親しみがあるソフトウェアエンジニアにはわかりやすい仕組みとなっています。また、HTML と DOM 操作の詳細を JavaScript に抽象化していることで、継承を使ってカスタムで再利用できるコンポーネントを作成することもできます。これらにより、新しくウェブプログラミングを覚えている新人エンジニアにとってはラーニングカーブが緩やかになり、トレーニングコストを削減することもできました。

新しい Ext JS 5 のモデル-ビュー-ビューモデル (MVVM)アーキテクチャにより、更にカスタムコードを書く量が減りました。また、それによりアプリケーションのバグも減らすことができました。それに加え、Ext JS の Router / ブラウザヒストリー機能を使用すれば更にカスタムコードを減らすことができ、製品を届けるスピードが加速します。

Sencha は JavaScript 対し厳格なアプローチをしています。そして、それによりよく整頓され、テスト可能で、ロードが速く、ユーザーインプットに対してもすぐに反応するアプリケーションを作る基礎が用意されています。アプリケーションのフットプリントも Sencha Cmd をビルドツールとして使用すれば更に小さくなります。Cmd はコードを最小化するだけでなく、アプリケーションを調べ、実行する上で必要最低限のフレームワークやカスタムクラスしかビルドに含みません。

新しい開発者へのアドバイス

  • フレームワークを覚える: 拡張やパフォーマンスを意識してアプリケーションを開発してるのであれば、フレームワークについて知っておくことは大切です。また、Sencha のプロフェッショナルサービスチームと一緒にベストプラクティスを使用してアプリケーションを設計することも強くおすすめでします。これにより、プロジェクトの後半でのリファクタリングを減らすことができます。
  • 国際化とアクセシビリティを意識してデザインする: Ext JS はアプリケーションを国際化することと、リハビリテーション法508条に準拠することをサポートしています。これらの機能を頭にいれながらアプリケーションをデザインするとよいでしょう。
  • 共通コンポーネントをパッケージ化しよう: Ext JS は沢山のウィジェットが最初から付属しています。一般的によく使うコンポーネントはSencha comman pacakges を使用することで複数のアプリケーション間でコンポーネントを再利用することができます。
  • パフォーマンスに気をつけよう: Sencha のベストプラクティスに従えばアプリから最適化されたパフォーマンスを得られます。Sencha knowledge base の他に、プロフェッショナルサービスやサポートチームを使ってアプリケーションパッケージをパフォーマンスと拡張性を意識してデザインすることができます。アプリケーションコンポーネントが専有するメモリについては常に意識しましょう。

おわりに

Sencha Ext JS は、企業クラスのウェブアプリケーションを開発するための強力なフレームワークであり、幅広いツールは開発を簡単なものにします。一番大きな利点はクロスブラウザとタッチデバイスサポートであり、これによりシングルコードベースでアプリケーションを作ることが可能になりました。リハビリテーション法508条への対応も私たちにとって非常に良いものでした。全体的にまとめると、Ext JS フレームワークはデータ量の多い企業アプリケーションと非常に相性が良いと思います。

PAGETOP