Powered by
Movable Type 3.35

« 2008年02月 | メイン

バックナンバー:2008年03月

ひとりサービスをリリースするまでやっておくこと10個はてなブックマークに追加 livedoorクリップに追加 Yahoo!ブックマークに追加 del.icio.usに追加 イザ!ブックマーク ニフティクリップに追加

Ruby(とRails)を担当している石原です。

ソーシャル「OSを入れた後にインストールする10のアプリケーション」(仮) を作る過程をレポートしています。

今回は、開発はひとやすみにして、サービスをリリースする前にやっておくべき細々としたことを紹介したいと思います。

これらは筆者がひとりサービスをリリースするときに、毎回なんとなく思い出しながらやってきたことで、サービスによっては忘れてしまっているものもあります。

ですから、次からはこれをチェックリスト代わりに使おうと思っています。

Rails に限った話とWebサービス一般の話が混ざっています。ほかの言語やフレームワークを使っている方にも、Rails に限った話を自分の使っている環境に読み替えれば、いくらか参考になるかもしれません。

参考までにこれまでのエントリーはこちらです ↓

  1. つくるぶガイドブログ: Ruby on Rails を使ってひとりでサービスを作ってみよう
  2. つくるぶガイドブログ: ひとりサービスの雛型をつくる(リキッドレイアウト、GetText、Acts as Authenticated)
  3. つくるぶガイドブログ: Rails で楽々ソーシャルブックマークの仕組みを作る
  4. つくるぶガイドブログ: Rails プラグイン acts_as_taggable_redux でタグクラウドを作ろう
  5. つくるぶガイドブログ: ドラッグアンドドロップで並べ替え(Rails + Ajax)
  6. つくるぶガイドブログ: Rails + rcov でテストカバレッジを調べる
  7. つくるぶガイドブログ: capistrano で本番環境にデプロイ
  8. つくるぶガイドブログ: Rails で Yahoo 検索 API + Widgets Tabnav でタブナビゲーション

続きを読む "ひとりサービスをリリースするまでやっておくこと10個" »

Adobe AIRでAjax!HTMLとJavaScriptでそのままAIRに移行できるサンプルはてなブックマークに追加 livedoorクリップに追加 Yahoo!ブックマークに追加 del.icio.usに追加 イザ!ブックマーク ニフティクリップに追加

こんにちは、JavaScript担当の(株)アークウェブの竹村です。

2008年2月25日にAdobe AIR 1.0 (英語版)がリリースされましたね。


AIRはHTMLやJavaScriptなどWebの技術をそのまま利用してクライアントサイドのデスクトップアプリケーションの開発ができるので、今までのWebデベロッパーには親しみやすいと思います。

今回は、このAIRでHTMLとJavaScriptを使ったWebアプリをAIRに変換してユーザに配布するまでについて、書いていきます。


レジュメは↓このようになっています。

  • AIRアプリケーションを制作できる環境構築
  • ユーザに配布するまでの流れ
  • アプリケーション記述ファイルの作成
  • AIRコンテンツの制作
  • AIRコンテンツの確認
  • 電子署名の作成
  • インストールパッケージの作成
  • Webにアップする (インストールバッジの作成)
  • おまけ:JavaScriptライブラリを利用したフォーム入力チェックのAIR化
  • フォーム入力チェックのWeb版を制作
  • AIRアプリをWebにアップするまで一気におさらい
  • まとめ

今回作る2つのサンプルは↓こんな感じです。

まずは、Windows環境にAIRアプリケーションを構築できる環境を作って、
パブリッシュした swf をサーバにおいて動作できるようにしてみましょう。

続きを読む "Adobe AIRでAjax!HTMLとJavaScriptでそのままAIRに移行できるサンプル" »

アプリケーションとサーバサイドマッシュアップの統合はてなブックマークに追加 livedoorクリップに追加 Yahoo!ブックマークに追加 del.icio.usに追加 イザ!ブックマーク ニフティクリップに追加

この連載の第2回第3回第4回でStrutsとAjaxを組み合わせてサーバへの通信と比較的リッチなUIを作成しました。また、第5回第6回第7回ではマッシュアップについて説明し、実際にサーバーサイドマッシュアップの実装を行いました。

今回は、題材のアプリケーションにサーバーサイドマッシュアップを統合します。

続きを読む "アプリケーションとサーバサイドマッシュアップの統合" »

JiftyでWebアプリをつくる - JiftyからMVCを考えるはてなブックマークに追加 livedoorクリップに追加 Yahoo!ブックマークに追加 del.icio.usに追加 イザ!ブックマーク ニフティクリップに追加

お久しぶりです、Perl担当の西山です。

前回に続きDRY(Don't Repeat Yourself)を追求するWebフレームワークJiftyを取り上げます。
手元の環境にPerlの実行環境やJiftyをインストールされていない方はこれまでの記事を参照してください。
今回はJiftyと一緒に配布されている"ShrinkURL"というサンプルアプリケーションを題材に、
Jiftyに従ってアプリケーションを開発する場合のモジュール構造や考え方を見ていきたいと思います。

これまでの記事:
  1. JiftyでWebアプリをつくる - Windowsにインストール
  2. JiftyでWebアプリをつくる - ログイン機能を作る

Jiftyの考え方

一般的にWebアプリケーションのフレームワークなどで使用されるアプリケーション構造はMVC(Model-View-Controller)と呼ばれる形に機能は分類されますが、 Jiftyでは本家サイトのBasic concepts of Jiftyで説明されているように「Dispatcher」「Action] 「Template」「Model」という4つの要素でアプリケーションを構成しています。 それぞれの要素は主に以下のような役割で開発するように設計されています。
  • Dispatcher: URLに対してActionやTemplateへのマッピングを定義。
  • Action: 画面内での操作やリクエストなどをトリガーに発生するビジネスロジックを定義。
  • Template: 表示系のデータ取得処理や、UIのレイアウト情報を定義。
  • Model: 操作対象となるデータモデルの構造や操作を定義。

通常のMVCではControllerでまとめて扱われることの多いDispatcherとActionの役割を、Jiftyではフレームワークレベルで明確に分けています。
また、表示系の処理もViewが使用するhtmlテンプレートやControllerに分散しやすいですが、JiftyではTemplateのPerlモジュール内で一括管理するように設計されているのが特徴だと思います。

サンプルアプリShrinkURLを見る

新しいモジュールやフレームワークの使い方を理解するには サンプルをてっとり早く動かしてみていろいろいじってみるのが早いと思います。 サンプルアプリケーションであるShrinkURLを見てみましょう。
セットアップ
先ほどサンプルはJiftyと一緒に配布されていると書きましたが、 Windows版のPPMには含まれていないようです。 TortoiseSVNなどのSubversionクライアントをインストールしている方は下記レポジトリから、 チェックアウトしてください。
http://svn.jifty.org/svn/jifty.org/jifty/trunk/examples/ShrinkURL

ブラウザ経由でもCPANのJiftyのページからダウンロードできます。
解凍後のフォルダのexamples\ShrinkURLが今回使用するアプリケーションフォルダです。
適当な作業フォルダにShrinkURLをコピーしてください。

また、ShrinkURLが依存するモジュールとしてNumber::RecordLocatorが必要になります。
別途Package Managerを使ってインストールしてください。

最後に、以下のようにコマンドプロンプトから ShrinkURLフォルダ配下でコマンドを実行するとセットアップ完了です。
C:\tmp\ShrinkURL>perl bin\jifty schema --setup
動作確認
まずは素の状態の動作を見てみます。 以下のようにjiftyコマンドにserverオプションを指定して実行するとアプリケーションサーバが起動し、 デフォルトではhttp://localhost:8888/のURLで アクセスできるようになります。
C:\tmp\ShrinkURL>perl bin\jifty server

ShrinkURLは、入力されたURLにユニークなキーを割り当て、短縮したURLでサイトにアクセスできるようにするアプリケーションです。
登録したURLはDBに登録され、短縮したURLはいつでも利用することができます。


1.URLを入力してShrink it!ボタンをクリック

sc0000.png

2.短縮したURLが生成される

sc0001.png

生成されたURLにブラウザからアクセスすると、元の入力したURLへリダイレクトされます。

続きを読む "JiftyでWebアプリをつくる - JiftyからMVCを考える" »

失敗しない Rails が動かせるホスティングサービス選びと環境構築はてなブックマークに追加 livedoorクリップに追加 Yahoo!ブックマークに追加 del.icio.usに追加 イザ!ブックマーク ニフティクリップに追加

Ruby(とRails)を担当している石原です。

ソーシャル「OSを入れた後にインストールする10のアプリケーション」(仮) を作る過程をレポートしてきましたが、10回目の今回をもって終わりとさせていただきます。

最後は、いよいよリリースしようという段階で必要な、ホスティングサービス選びと環境構築について書きたいと思います。

参考までにこれまでのエントリーはこちらです ↓

  1. つくるぶガイドブログ: Ruby on Rails を使ってひとりでサービスを作ってみよう
  2. つくるぶガイドブログ: ひとりサービスの雛型をつくる(リキッドレイアウト、GetText、Acts as Authenticated)
  3. つくるぶガイドブログ: Rails で楽々ソーシャルブックマークの仕組みを作る
  4. つくるぶガイドブログ: Rails プラグイン acts_as_taggable_redux でタグクラウドを作ろう
  5. つくるぶガイドブログ: ドラッグアンドドロップで並べ替え(Rails + Ajax)
  6. つくるぶガイドブログ: Rails + rcov でテストカバレッジを調べる
  7. つくるぶガイドブログ: capistrano で本番環境にデプロイ
  8. つくるぶガイドブログ: Rails で Yahoo 検索 API + Widgets Tabnav でタブナビゲーション
  9. つくるぶガイドブログ: ひとりサービスをリリースするまでやっておくこと10個

続きを読む "失敗しない Rails が動かせるホスティングサービス選びと環境構築" »

Adobe AIRでAjax!(その2) AIR APIを利用してWebとLocalを繋ぐマッシュアップ サンプルはてなブックマークに追加 livedoorクリップに追加 Yahoo!ブックマークに追加 del.icio.usに追加 イザ!ブックマーク ニフティクリップに追加

こんにちは、JavaScript担当の(株)アークウェブの竹村です。

前回はAdobe AIRの制作環境構築と、ユーザに配布するまでの流れを説明しました。

今回もマッシュアップサービスを利用しつつ、AIR APIをいくつか使ったサンプルを用意しました。

ホットペッパーのマッシュアップサンプル『オヒルダ!』

ホットペッパーのAPIに「ランチ」というフラグがあるのに着目し、ランチを提供しているショップリストを表示するサンプルです。ショップ検索をする際に、予め自分の住所や
指定した緯度経度などを設定できるようにしています。

オヒルダ!の構成は↓このようになります。

01organize.jpg

最初にWeb版を作ります。Web版には下記の機能を盛り込みます。

w-1. ホットペッパーAPIを通して検索結果一覧を表示する
w-2. 検索で使用する地域/ジャンルを設定できるようにする
w-3. 設定をAIRアプリ用にエクスポートできるようにする

AIR版には下記の機能を盛り込みます。

a-1. ホットペッパーAPIを通して検索結果一覧を表示する
a-2. Web版の設定をインポートできるようにする

今回利用するAIR APIは『ローカルファイル選択ダイアログの表示』と『ファイルの内容の読み取り』と『SQLiteへのアクセス』の 3点です。

完成版は↓こちらからアクセスできます。
オヒルダ! (Web版)
02image.jpg
オヒルダ! AIR版 インストーラー


今回のレジュメは↓このようになっています。

  • w-1. ホットペッパーAPIを通して検索結果一覧を表示する
  • w-2. 検索で使用する地域/ジャンルを設定できるようにする
  • w-2-1. GoogleMapsで住所から緯度/経度を取得する
  • w-2-2. GoogleMapsで円を描く
  • w-2-3. 設定内容を保存する
  • w-3. 設定をAIRアプリ用にエクスポートできるようにする
  • a-1. ホットペッパーAPIを通して検索結果一覧を表示する
  • a-2. Web版の設定をインポートできるようにする
  • a-2-1. ローカルファイル選択ダイアログを表示して選ばせる
  • a-2-2. ファイルを開いて内容を読み込む
  • a-2-3. SQLiteに設定を保存する
  • a. SQLiteから設定を読み込むには
  • オヒルダ!AIR版のソース一式ダウンロード
  • まとめ

続きを読む "Adobe AIRでAjax!(その2) AIR APIを利用してWebとLocalを繋ぐマッシュアップ サンプル" »