7. とあるSPAの環境 • Mac OS上でコーディング • Mac OS上でローカルサーバをたてて動作確認 • coffee-script や SCSS などのメタ言語のコンパイル • APIをJSONファイルをレスポンスとして返すモックサー バで置き換え
前回の記事で環境構築と土台となるプロジェクとの作成ができたので、今回から実用的なアプリの制作に入ります。数回にわけてTwitterクライアントを作成しますので、ネットワーク周りや画像の取り扱いまでTitaniumの簡便さを体験していただければと思います。 どんなものを作るか まずは、実際に作るアプリのイメージを固めましょう。TwitterアプリはiPhoneアプリの中でも優れたアプリが多く激戦区となっているジャンルです。一方でTwitterを使い込んでいくと自分のよく使うWebサービスと連携させたくなり、自分の使い方にカスタマイズしたアプリも欲しくなるものです。ということで、Twitterのひと通りの機能を実装しつつ拡張しやすいシンプルなアプリを目指しましょう。 図1 画面イメージ 画面構成としてはこのようなアプリをイメージしておきましょう。 まずはTableView Twitterアプリ
PhoneGap Day US 2012にて、待望のPhoneGap 2.0.0がリリースされました。本連載では、PhoneGap 2.0.0の変更点をはじめとして、新機能の紹介やFile APIを使ったアプリケーションの開発方法について紹介していきます。どうぞお楽しみください。 PhoneGap/Cordovaとは PhoneGapはAdobeが開発、公開しているクロスプラットフォーム・モバイルアプリケーションの開発フレームワークです。詳細については、前回の連載の記事をご参照ください。 PhoneGap もともとPhoneGapはNitobi社が開発・公開していましたが、2011年10月2日(米国時間)にAdobe社がPhoneGapの開発元であるNitobi社を買収したと発表しました。PhoneGapは開発体制や配布方法が変更され、Apacheに寄贈され、現在にいたります。 Phone
社内のライトニングトーク用に Qiita:Team に書こうとしていたものですが、誰かの参考になればと思い、こちらにアップします。対象は 「エンタープライズ系ではない」「スクリプト言語系の」WEB系エンジニア/プログラマ です。 流行り廃り、好みがあると思いますが、これらは実際に、私が試してよかったものです。サービスであったりライブラリであったり粒度がバラバラではありますが、参考まで^^; 「最近の」というタイトルですが、私的に最近、活用しているという意味で、サービス自体は昔からあるものもあります。 ① Heroku Heroku を利用すると、Ruby(on Rails)、PHP、Node.js、Python 等のサーバ側アプリケーションをホスティングすることが出来ます。デプロイ方法は Git で push するだけ です。 商用でちゃんと使おうとすると、無料枠の構成では難しいですが、デ
はじめまして、株式会社キクミミの富田宏昭と申します。おもにWebアプリケーションを開発しています。この連載では、PhoneGapを使ったiOSおよびAndroidアプリケーションの開発方法について全4回に分けて紹介していきます。どうぞお楽しみください。 PhoneGapとは PhoneGapはNitobiが開発、公開しているクロスプラットフォーム・モバイルアプリケーションの開発フレームワークです。スマートフォン向けアプリケーションの開発では、各OSごとに特定の言語を使用をして開発をおこなうことになります。たとえばiOSの場合はObjective-C、AndroidやBlackBerryの場合はJava、Windows Phone 7の場合はC#・Vidual Basicなどです。複数のスマートフォンに対応するアプリケーションを開発する場合、デベロッパは複数の言語をもちいてそれぞれの開発環境
TOPICS Programming , Mobile , HTML/CSS , JavaScript 発行年月日 2010年08月 PRINT LENGTH 208 ISBN 978-4-87311-461-3 原書 Building iPhone Apps with HTML, CSS, and JavaScript FORMAT PDF Objective-Cを使わなくてもWebアプリケーション開発の標準技術でiPhoneアプリケーションを開発できます。本書ではパソコン向けWebアプリケーションをスタート地点に、CSSのカスタマイズ、jQueryの利用、jQTouchを利用した高度なアニメーション、PhoneGapを使ってネイティブアプリケーション化することでiPhone固有の機能を使う方法、そしてApp Storeへの登録に至るまで、HTML+CSS+JavaScriptによるiP
enchant.js is … カンタンにゲームやアプリを開発できる HTML5 + JavaScript フレームワークです。 2011年に公開され、すでに 1,000 本以上のゲーム/アプリが公開されています。 オープンソース (MITライセンス) で、無料で利用できます。 ドキュメント・書籍・チュートリアルサイトが充実しています。 たくさんのプラグインで機能を拡張できます。 UEI/ARC を中心としたメンバによって開発・メンテナンスされています。 プログラミング教育のためにも利用されています。 Features オブジェクト指向: 表示されているものはすべてオブジェクトです。 マルチプラットフォーム: iOS, Android, Mac, Windows のブラウザで動作します。 Windows 8: Windows 8 対応のHTML5アプリケーションを開発できます イベント駆動
昨日は gumiStudy#5 でした。何か Tech Talk を、ということだったので最近いじっていた Titanium Mobile について整理して、紹介してきました。 Titanium MobileView more presentations from Naoya Ito. (フォントがひどいですね・・・すみません。http://www.slideshare.net/naoya1977/titanium-mobile/download からダウンロードできます) 先日書いたエントリ (http://d.hatena.ne.jp/naoya/20101011/1286799669) のとおり、Titanium Mobile を使うと JavaScript でネイティブアプリを開発することができます。しかも iPhone/Android マルチプラットフォーム対応。最近は Blac
ページにほんの一行外部ファイルを加えるだけで、iPhone, iPadなどのiOSをはじめ、Android, Blackberry, Windows Phone, Window Tabletなどスマフォやタブレット、デスクトップなどのデバイスを判定し、簡単に条件付きのCSSやJavaScriptを利用できるにするスクリプトを紹介します。 Device.js -GitHub Device.jsの使い方 Device.jsのデモ Device.jsの使い方 Device.jsの実装は、簡単です。 外部ファイルとして、当スクリプトを記述するだけです。 <script src="device.js"></script> スクリプトを設置すると、表示デバイスに基づいて<html>に適切なclassを付与します。 iPhoneでアクセスすると、こんな感じに。 <html class="ios ipho
1ページで構成された複数のコンテンツをデスクトップのドラッグ、スマフォ・タブレットのスワイプ操作でスライドして表示する単体で動作するスクリプトを紹介します。 Minimit Gallery Minimit Gallery -GitHub Minimit Galleryのデモ Minimit Galleryの使い方 Minimit Galleryのデモ Minimit Galleryは一つのHTMLファイル内に配置した複数のコンテンツをスライドで次々に表示するスクリプトで、各コンテンツはハッシュリンクでの表示にも対応しています。 デモはIE7+, Firefox 3.5+, Safari 3+, Opera 9+, Chrome, iPhone, iPad, Android, Windows Phoneなどでご覧ください。 デスクトップでデモを表示してみます。 次コンテンツへスライド中 上部
2024年4月1日より、Supership株式会社は親会社であるSupershipホールディングス株式会社に吸収合併されました。 合併に伴い、存続会社であるSupershipホールディングスは社名をSupershipに変更し、新たな経営体制を発足しました。本件に関する詳細は、プレスリリースをご確認ください。 2024年4月1日より、Supership株式会社は親会社であるSupershipホールディングス株式会社に吸収合併されました。 合併に伴い、存続会社であるSupershipホールディングスは社名をSupershipに変更し、新たな経営体制を発足しました。 本件に関する詳細は、プレスリリースをご確認ください。
HTML5で2次元のインタラクティブコンテンツを制作するには、さまざまなJavaScriptライブラリがあります。どれを選択するべきか迷いどころではないでしょうか? そこで今回はHTML5の各種JavaScriptライブラリについて、パフォーマンスを比較検証してみました。 今回検証したフレームワーク メジャーなJavaScirptライブラリとして次の5種類でテストしました。バージョンは2013年4月10日現在の最新版を使っています。詳しい検証方法は記事の後半にまとめています。 CreateJS (EaselJS 0.6.0) Arctic.js (v0.1.11) enchant.js (v0.6.3-48) Pixi.js (v1.0.0) Processing.js (v1.4.1) 各種JavaScirptライブラリのベンチマーク結果 ※グラフの数値が高いほどパフォーマンスが高いこと
HTML、CSS、画像だけで、マウスオーバーした地域ごとに色が変わる日本地図を作る方法です。 文字だけではちょっと意味がわかりにくいかもしれませんので、とりあえず↓の日本地図の上にマウスカーソルを載せてみてください。クリックするとページ遷移しますが、このデモでは Not Found になりますのでご注意ください。 デモページを別のタブで開く このデモをダウンロード(ZIP) 2009年に仕事で「日本地図をクリックすると地域ごとに違うページに飛ぶ」ページを作らなければならなかった時に、当時 JavaScript も書けないし Flash は PC に入っていなかったので、HTML と CSS だけで作ってみました。 このデモはDOCTYPE宣言が HTML5 になっていますが、当時 HTML 4.01 で、IE6 でもきちんと動くように作りました。 ですので、特殊なタグやプロパティは使わず
iPhoneのSafariでWebブラウズしていると、誰かと共有したい記事や画像を見つける事がある。画像なら最近はPinterestに投稿しているが、その手順が面倒だった。リンクをコピーする → SafariでPinterestを開く → Add + をタップする → リンクをペーストする... もっと簡単な方法はないか。そう思って探したのが今回紹介するブックマークレット。iOSはTwitterとFacebookへの共有を標準でサポートしているが、記事のタイトルが投稿できないのでブックマークレットのほうがいい。 LINE こちらで紹介されていたブックーマークレットを使うと、記事のタイトルとURLが入力された状態でLINEのアプリが起動する。 javascript:location.href=('http://line.naver.jp/msg/text/'+encodeURICompone
というわけで、しばらくまとめていなかったまとめ記事を再開し、私は元気ですとアピールしたい。 7月にあつめたブックマークのまとめです。 7月度必須ブクマベスト HTML5 Canvas Cheat Sheet 悩んだけど一応ベストへ。 HTML5 Canvas tagのチートシート。日常的に使うものでもないし、開発者向けになってしまうけど念のため。 OSを選ばないウェブデザイナーのための使えるウェブアプリ15*ホームページを作る人のネタ帳 7月に書いたけどついこの間のようだと思ったら、あんまり記事かいてないからそう思うんだきっと。 ついでにこちらも7月でした。 今日から現場で使えるjQueryのフォーム関連プラグイン15選 iPhone等のWebアプリをHTML5で構築する為のフレームワーク・Sencha Touchを触ってみた スマホアプリ開発者ならブクマしておきたい一品です。 Googl
2012 年 9 月 26 日 追記しました。 要約エントリー。 元記事 : iPhone 5 website teardown: How Apple compresses video using JPEG, JSON, and <canvas> アップルのサイトの iPhone5 のページにある「スライドしてアンロック」のアニメーションが、信じられない実装になっている、という話。簡単に要約してみた。(ミスなどの指摘は @lowply までお願いします) もともと h.264 と WebM の動画フォーマット戦争でブラウザ互換性の問題がまだ残っている上、iPhone などは「再生ボタン」を押さないと再生できなかったりするので、こうした短いアニメーションに video タグを使うことは最適解ではなかったらしい。 そこで発想の転換をして、Retina MBP のページでは、蓋が開くたった 2
jQuery iPhone UIはHTML/JavaScript製のオープンソース・ソフトウェア。iPhone用のWebサイトを構築するニーズが増えてきている。既に幾つかテンプレートもリリースされており、それらを使えば最適化されたインタフェースのサイトが作りやすくなる。 アイコンリスト そうしたライブラリを使う時に重要なのが、どれくらいの機能に対応しているかだ。単純なリストはもちろん、プロフィールページ、画像付きリスト、フォームなど多数のニーズがある。その一つ、JavaScriptを使ったパターンに適合できそうなのがjQuery iPhone UIだ。 jQuery iPhone UIの特徴は名前の通りjQueryを使っていることだろう。同種のライブラリとしてjQTouchがあるが、あちらはがちがちに固まっている雰囲気があるがjQuery iPhone UIは切り離して使えそうだ。HTML
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く