サクサク読めて、アプリ限定の機能も多数！
トップへ戻る
ドラクエ3
www.extjs.co.jp
2011年最初の勉強会の資料です。アジェンダは以下の通り： NextJSでちっちゃいTwitter作ろう（@Mt_blue81 ） SenchaTouch+Scalaでモバイルアプリ開発（@nowelium） Sencha TouchでMVC（@naotori） … @Mt_blue81こと青山さんには、Node.jsをラップするフレームワークNextJSを使ったアプリケーション開発について話をしてもらいました： 資料はこちら：「NextJSでちっちゃいTwitter作ろう」 … @noweliumこと漢（ハタ）さんには、Mashup Award 6で優秀賞を受賞した「テリトリ」の開発を通じて得られたSencha Touchに関するノウハウとScalaについてのプレゼンを行ってもらいました：
この記事は1/19に掲載された「Countdown to Ext JS 4: Dynamic Loading and New Class System」を訳したものです（翻訳：@taka_2） みなさんお待ちかねのExt JSのベータリリースですが、今後数週間に渡り、パッケージ毎に逐次リリースをしていく予定です。今日がその最初のリリースとなります。当初の予定では、今頃までに完全なベータ版をリリースしているはずでしたが、いくつかのモジュールの開発が予定よりも遅くなってしまっているため、その完成を待つよりもモジュール毎にリリースをしていくことにしました。まず今日はExt JS 4の新しいクラスシステムをリリースします。 JavaScriptは、それ自身にはクラスという概念がありません。このことがJavaScriptを学び始めた人にとって、取っ付きにくい印象を与えてしまうことがあります。Ext
この記事は8/17に掲載された「Using the Data Package in Sencha Touch」を訳したものです DataパッケージはSencha Touchを構成する重要なパーツです。Sencha TouchのアプリケーションはModel、Store、ProxyといったDataパッケージの各クラスを利用することでデータを永続化させることができます。Sencha Touchで作られるアプリケーションの大半は、GUI部品に結び付けれたこれらのData関連クラスを直接・間接に利用します。Dataパッケージの基盤となるのがExt.data.Modelクラスです。Modelはアプリケーションで利用するデータを表すものです ー ユーザー、製品、売上、といった任意のデータを表すことができます。ここでは、例として、ECシステムにおいて製品管理をするためのアプリケーションを想定してみましょう
2010年最後の勉強会の資料です。今回の勉強会はテーマをJavaScript全般に拡げて、最近話題のNode.jsとTitanium Mobileについてもカバーしました。アジェンダは以下の通り： Sencha Touch + Node.js + WebSocket（小堤） Node.js Rocks!（Node.js 日本ユーザグループ @masahiroh ） Titanium Mobile Introduction（Appcelerator 増井さん a.k.a @masuidrive） … 小堤さんには、Sencha TouchとNode.jsとWebSocketを組み合わせたスマートフォン向けチャットプログラムのデモを行ってもらいました。クライアント側からサーバー側まで全てJavaScriptで実装されているチャットプログラムです： 資料はこちら：「Sencha Touch +
この記事は12/17に掲載された「An Introduction to Theming Sencha Touch」を訳したものです（翻訳：@taka_2） Sencha Touchは、SASSとCompassを使って構築された、革新的な新しいテーマシステムを導入しました。このシステムを利用すれば、Sencha Touchの基本テーマをアプリケーションやブランドに合わせて簡単にカスタマイズすることができます。Sencha TouchはWeb標準に基づいた設計になっていて、また、現在はWebKitブラウザ向けに作られているため、WebKitで既に利用可能なCSS3の様々なプロパティ、たとえば、角丸や背景グラデーションだけでなく、CSS3ボックスモデルのような高度なプロパティも、自由に利用することができます。そして、SASSとCompassを使えば、CSS3で構成されているSencha Touc
この記事は6/29に掲載された「Getting Sassy with CSS」を訳したものです（翻訳：@taka_2） Sencha Touchの開発を始めた頃、Sencha Touchのテーマは美しいだけではなく、柔軟で、記述が簡単で、そして解像度に依存しないようにするため、CSS3の上位レイヤーとしてSASSを使うことを決定しました。SASSは、Syntactically Awesome Stylesheetsの略で、これまでのCSSに、ネストルール、変数、Mixin（関数に似たもの）、セレクタの継承、といった機能を加えています。SASSスタイルシートは、サイトへ配置される前にコンパイルされるので、最適化の新たな余地が生まれます。SASSというのは、つまり、2099年頃のCSSを先取りしたようなものです。 この記事では、柔軟に変更可能なボタン用スタイルの作り方について示しながら、Sen
この記事は12/09に掲載された「Samsung Galaxy Android Tablet: The HTML5 Developer Scorecard」を訳したものです Androidを搭載したタブレット端末はすでにいくつかありますが、大々的にマーケティングされている端末としてはSamsungのGalaxy Tabが初めてとなります。そこで我々としてもこの機会に、この端末がHTML5アプリケーションのプラットフォームとしてどの程度のものなのか評価してみることにしました。Galaxy Tabの比較対象となるiPadについては、HTML5アプリケーションのプラットフォームとして十分に満足のいく結果が得られています（ただ、できればより多くのメモリとCPUパワーがあればと、iPad2に期待をしていることも事実です）。8月にBlackberry Torchについて評価を行ったように（未訳）、Ga
この記事は11/22に掲載された「Ext JS 4 Preview: Faster, Easier, More Stable」を訳したものです 先週サンフランシスコで開催された第二回目のSencha Conferenceには、世界中から500名を超える開発者が集まりました。参加した誰にとっても素晴らしいカンファレンスでしたが、私（訳注：このブログを書いたEd Spencer）にとってのハイライトは、皆さんの前で1時間にわたりExt JS 4を紹介したときでした。この模様を収録した動画はまだ編集中ですので、その前に、この次世代のJavaScriptフレームワーク、そして我々のフラッグシップ製品となるExt JSのバージョン4.0について、駆け足でご紹介したいと思います。 素晴らしい数々の新機能 まず最初にExt JS 4に追加される素晴らしい新機能を紹介してきましょう。ここで紹介するのものが
昨日開催した11月の勉強会の資料です。11月のアジェンダは以下の通り： SSASS/Compass入門（@ispernさん） SalesforceとTwitterのマッシュアップ（MashMatrix 西林様 @hagino3000） Sencha Conference 2010 報告（Ext Japan 直鳥 @naotori） … @ispernこと松岡さんには、Sencha Touch（そしてExt JS 4）のスタイリング（テーマ生成）に全面的に利用されているSASS/Compassについての解説を行ってもらいました。Sencha Touchに限らず、今後CSS3を使ってリッチなWebアプリを開発していく上でSASS/Compassは有力な技術になっていくと思いますので、要チェックです：
直鳥 裕樹 (Yuki Naotori) President 1973年佐賀県生まれ。Florida Institute of Technology、Stanford Universityを経てアンダーセンコンサルティング（現アクセンチュア）に入社。その後、Infinity Financial Technology、モニターカンパニー、ソフトバンクファイナンス（現SBI）を経て、2000年4月にオープンアソシエイツの創業メンバーとして参画。Ext JSを利用したONGMAPでMash up Award 3rd 最優秀賞を受賞。2007年に株式会社セブンズを設立、代表取締役に就任（現職）。 小山 文彦 (Fumihiko Koyama) Vice President, Marketing 1973年山口県生まれ。山口大学人文学部卒業。コンピュータ関連出版のインプレスにで、オンラインソ
本日よりSencha Touch 1.0が正式にリリースとなりました。 6月に最初のベータ版をリリースして以来、多数の機能追加と製品のほぼ全ての部分における改良作業を行ってきました。新しく追加された機能の中には、HTML5フォームのサポート、Webベースのピッカーコンポーネント、そして新しいMVCパッケージがあります。Android上でスムーズなリストスクロール機能を実装できたことも特筆するべき改善点だと考えています。 ベータ期間中におけるダウンロード数（16万回）、そしてSencha Touchを使って開発された多くの素晴らしいアプリケーションを見ていると、Sencha Touchが既にモバイル端末向けWebアプリ開発のためのデファクトになりつつあるような気がしています。我々としては、このSencha Touchのさらなる利用と普及のために必要なことであればどんなことでもやりたいと考えて
本日Sencha Animatorの開発者向けプレビュー版が公開されました。Sencha Animatorはデザイナー向けのアプリケーションで、これを使えば、HTML5をサポートする端末上で動作するアニメーションを簡単に制作できます。Apple社がiOSにFlashを搭載しないという決定を下して以来、多くのデザイナーがWebアニメーションをiOS上で実現するための方法、それも、できれば数千行のCSS3コードを書かずにできる方法を探してきました。Sencha Animatorがその探していた方法となります。デモをご覧ください、そしてSencha Animatorをダウンロードして実際に試してみてください。 アニメーション制作用パワーツール Sencha Animatorの操作はシンプルで、オブジェクト（文字列、形、画像）をステージングエリア（リサイズ可能）に配置し、各種プロパティを設定し、そ
Sencha Animatorを使えば、これまでのリッチメディア広告に匹敵するCSS３広告を作成することができます。文字や画像をスムーズに遷移させるアニメーションを作成したり、グラデーションがかかったボタンをデザインしたり、さらに分析用のトラッキングコードを埋め込んだりすることがSencha Animatorの中で行えます。また、これらは全てWeb標準技術を使ってできることです。 これらの標準技術を使えば、現在デスクトップ用のブラウザ向けのリッチメディア広告で使われているほぼ全ての機能は、Apple iOS、BlackBerry Torch、そしてGoogle Android向けに移植・再現することが可能です。 CSS３広告について企画・検討されている広告代理店、広告制作会社の皆様、Sencha Animatorの広告作成者向けオプションについてお問い合わせください。 広告作成者向けオプシ
この記事は8/27に掲載された「Tips and Tricks for Ext JS Component Developers」を訳したものです Ext JSには高度なアプリケーションを構築するために必要な全ての部品（コンポーネント）が予め組み込まれています。それでも時には、カスタマイズしたコンポーネントを自分自身で書く必要に迫られることもあり得ます。幸いなことに、Senchaコミュニティには、開発者がすぐ利用できる有償・無償の各種コンポーネントからなるエコシステムが存在しています。今回の記事では、このようなコンポーネントを開発するうえで、機能性や利用性を高めるためのコツを幾つか紹介していきます。 メソッド呼び出しのバッファリング Ext JSでは、一度に大量のイベントが発生した際にも処理が滞ることがないように、イベントハンドラー関数へのイベントの受け渡しをバッファーしておくことができます
この記事は7/20に掲載された「HTML5 Family: CSS3 Ads Versus Flash Ads」を訳したものです これまでHTML5関連技術について多くの解説ブログを掲載してきましたが、今回は、CSS3の機能を使っておもしろい実験をやってみたいと思います。例えば、、、よく見かけるようなFlashのバナー広告をHTML5で再現することはできるでしょうか？結論から言うと、HTML5そのものは必要ではなく、いくつかの画像ファイルとCSS3アニメーションだけで十分でした（現時点では、最新のChromeとSafariでのみ機能します）。次のリンク：3つのFlashバナー広告と、それらを我々がCSS3で再現したものとを比較してみてください。実際、気味悪いほどそっくりに仕上がっています。 この記事では、CSS3とHTMLだけで上記のようなバナー広告を作る方法について説明していきます。説明
よく見かけるようなFlashのバナー広告をHTML5で再現することはできるでしょうか？3つのFlashバナー広告と、それらを我々がCSS3で再現したものとを比較してみてください。実際、気味悪いほどそっくりに仕上がっています。 データは、それを活用するためには、一定のルールに従って処理、分類、構造化、あるいは表現される必要があります。そして、こういった一連のプロセスを経て単なるデータは強力な情報となり得ます。Mircrodataを利用することで、Webアプリの中により多くの情報を埋め込むことが可能となります。
この記事は6/9に掲載された「The HTML5 Family: Geolocation」を訳したものです HTML5ファミリーの中ですぐに利用可能な機能の一つがGeolocationです。これまでは、IPアドレスをもとに現在地を推測するようなテクニックが、あまり正確な結果が得られないにも関わらずWeb上では利用されてきました。しかし今日では、様々な技術で正確な現在地情報の取得が可能な機器が溢れています。HTML5 Geolocation APIは機器の現在地情報を、その具体的な取得技術を意識することなしに、取得する方法を提供します。 まず最初に、HTML5 Geolocationの仕様はまだ最終化されたものではないため、今後変更されることがあるということに注意してください。この機能をサポートしているブラウザは現在のところ、Firefox 3.5+、 Safari 5+、 Chrome 5
この記事は6/7に掲載された「The HTML5 Family: Web Workers」を訳したものです Web WorkersはHTML5ファミリーの新しい仲間で、CPUに負荷のかかる処理を実行するための新しい手段を与えてくれます。これまでブラウザ上でJavaScriptによる重たい計算処理を実行することは次の2つの理由から大変困難でした ー JavaScript言語そのものの低いパフォーマンスとシングルスレッドであるという制限です。最初のパフォーマンス問題についてはここ数年非常に注目されており、ブラウザ間の競争もありJavaScriptの実行速度・環境は劇的に改善しています。過去2年間でChromeのV8やSafariのNitroといったJavaScriptエンジンが、シングルスレッドでの速度を大幅に改善しています。 2つ目の問題は、計算や処理が長時間にわたるスクリプトはブラウザが中
この記事は6/1に掲載された「The HTML5 Family: CSS3」を訳したものです 概要 HTML5入門でも書いてあるとおり、多くの人がHTML5の利点として認識しているものの多くは、実際にはCSS3とJavaScriptで実現されています。極端に言ってしまうと、HTMLはコンテンツの構造を定義するだけで、JavaScriptが動作を定義し、CSS3が見た目を定義しています。CSS3は、既に広くサポートされているCSS2.1をベースとして作られていて、非常に素晴らしいユーザーインターフェースを実現してくれます。CSS3の中でも一押しの機能を提供するのがCSS Animationsで、CSS Transformと合わせて利用することで、Flashやデスクトップアプリケーションに匹敵するビジュアル体験を提供することが可能となります。 CSS3の仕様は非常に大量にあるため、下記の説明は
Extはソフトウェア開発ライブラリにデュアルライセンスモデルを採用しています。商用とオープンソース開発のそれぞれの目的にそった2種類のライセンスを用意しています。 共存共栄 (Quid Pro Quo) デュアルライセンスは共存共栄 (Quid Pro Quo)の原則に基づいています。Ext製品を使ってアプリケーションを作成して得た利益のお返しとして、私たちは下記のいずれかを要求します。 Extから商用ライセンスを購入して、製品の継続的な開発に貢献すること。このオプションは、あなたが選択したライセンス条件の下でアプリケーションを配布する権利を保障します。 開発したアプリケーションをGPL v3のようなオープンソースライセンスの下に公開することで、オープンソースコミュニティに貢献すること。このオプションはすべてのユーザーがアプリケーションの全ソースコードを入手し、改変し、再配布する権利を保障
この記事は8/23に掲載された「Resolution Independent Mobile UI」を訳したものです …または… ピクセルはピクセルじゃないんです。 「SASSとCSS3のメリット（the benefits of SASS and CSS3）」（英語、未訳）という記事の中で、解像度に依存しないユーザーインターフェースを実現するためにSencha Touch内で活用しているテクニックについて簡単に解説しました。今回の記事では、読者がUI開発を行う際に役に立つように、そのテクニックについてもう少し詳しく解説してみたいと思います。 概要 この記事はアダプティブなレイアウトや、レスポンスの良いWebデザインについてのものではありません。この記事は、デザイナーにとって比較的新しい関心事となった、「ピクセル密度」に注目したものです。モバイル環境において、画面の解像度は急速に進化しています
この記事は5/27に掲載された「The HTML5 Family: Web Storage」を訳したものです このシリーズでは次世代のWeb技術について解説すると同時に、それらがExt JSのようなAJAXフレームワークにどのようにフィットしていくのか説明していく予定です。最初の記事ではHTML5の概要（そしてHTML5という言葉の使われ方）について書きました。今回は、比較的簡単で小さな機能について深堀りしてみたいと思います：Web Storage。 HTML5で定義されている2つの新しいAPIはブラウザ側にデータを格納する機能を与えます。ブラウザ側でのデータ格納機能そのものは新しいものではありませんークッキーは1994年頃から存在しますし、クライアントとサーバー間でやり取りする小さなデータの保管先として長く使われてきました。ただ、クッキーにはいくつかの問題があります： サイズが4キロバイ
この記事は5/23に掲載された「A HTML5 Primer for the Overwhelmed」を訳したものです HTML5がグーグルやアップルにより、リッチインターネットアプリケーション（RIA）のためのソリューションとして強力にサポートされ始めた結果、HTML5という言葉がバスワード化しています（特にGoogle I/O以降）。そして、HTML5という言葉が広く流布するにしたがって、その言葉本来の意味とは違う意味で使われ始めていることも、驚きではなくなっています。「HTML5の経験があること」が採用条件となっているような採用情報も既に存在しますし、シンプルなJavaScriptアニメーションもCSS3によるアニメーションもひっくるめてHTML5のサンプルとして紹介されていたりします。 ちょうど00年代中頃に「次世代のWeb開発」を指すバズワードとして「AJAX」や「Web2.0」
Ext JS 3.3 beta 2がリリースされました。 今回のリリースでは前回のリリースで報告されたバグの修正、PivotGridとCalendarコンポーネントの改善が行われています。 7月の勉強会の資料です。アジェンダは： ・Senchaへのブランド変更について（直鳥） ・Sencha Touch入門（株式会社sus4 佐竹様） ・Sencha TouchとYubizoで作るネイティブアプリ（株式会社アイキューブドシステムズ 佐々木様） ・SpreadOfficeとSencha Touch（小堤） ・ホワイトクラウド シェアードHaaSのご紹介（ソフトバンクテレコム株式会社 加藤様）
Secha Touchリリース後初ということで、70名近くに参加していただき大盛況だった7月のExt JS勉強会（東京）の資料です。7月の勉強会のアジェンダは以下の通り： Senchaへのブランド変更について（直鳥） Sencha Touch入門（株式会社sus4 佐竹様） Sencha TouchとYubizoで作るネイティブアプリ（株式会社アイキューブドシステムズ 佐々木様） SpreadOfficeとSencha Touch（小堤） ホワイトクラウド シェアードHaaSのご紹介（ソフトバンクテレコム株式会社 加藤様） … なお、当日の模様はUstreamで中継・録画（http://ustream.tv/channel/extjapan）を行っていたのですが、今日現在、録画が観られない状況です。状況を確認中ですが、観られるようになったら、Twitter（@extjapan）等で連絡し
このドキュメントではSencha Touchの始め方について解説していきます。 最初にタッチ型端末向けのWebアプリケーションを開発するための基本的なステップについての説明、 次に、Sencha Touchパッケージにも同梱されているデモアプリGeoTweetsの作り方についての詳細な説明 をしていきます。 このドキュメントはSencha Touchを使ってタッチ型端末向けのWebアプリケーションの開発をしたい Web開発者に向けたものです。前提条件としては、Sencha Touchライブラリをダウンロードしていること、 Webサーバー環境が用意されていること、そしてJavaScript・HTML・CSSなどのWebアプリケーション開発 に必要な技術や考え方について理解していること、があげられます。 このドキュメントは以下のセクションで構成されています： Sencha Touch について
その他のデモ… 上のデモ以外にも、Sencha Touchをダウンロードすると基本的なデモが付属してきます。これらのデモでは基本的なタブバーの作り方からYQLからデータを取得するサンプルまで網羅しています。Kitchin Sinkデモでは全ての基本的なデモを一カ所にまとめて見られるようになっています。Sencha Touchをダウンロードしてサンプルを確認してみてください。
次のページ
このページを最初にブックマークしてみませんか？
『EExt Japan - Sencha Touch登場 - モバイル用HTML5フレームワーク』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
