題名

Jifty::Manual::Tutorial_ja - あっという間にゼロからJifty

説明

このチュートリアルを読めば、Jiftyではじめてのアプリケーションを構築するにあたって知っておくべきことはすべてわかるはずです。

使い方

必要なもの

ここでは――少なくともこのチュートリアルの執筆時点で――インストールしておくべきものを紹介します。

そんなに構えなくても大丈夫。私たちはDRY (Don't Repeat Yourself) の原則をとても大事に思っていますし、だからこそPerlやCPANを愛しているのですから。JiftyはCPANのすばらしいコードをたくさん利用しています。直接依存しているCPANパッケージは全部あわせて100にもなりましたが、そのほとんどはクロス・プラットフォームなピュアPerlパッケージですから、Perlを利用できるプラットフォームならインストールするだけでばっちり動くはずです。

それだけではありません。次から次へとライブラリをダウンロードするだけで一日が終わってしまわないよう、バンドルできるライブラリはすべてJiftyパッケージのなかにまとめるようにしています。Jiftyのインストーラはシステムに必要なモジュールを調べて一気にダウンロード、インストールできるようになっています。でも、ご心配なく。システムの構成を変更する前にはまずみなさんの確認を取るようになっていますから。

ほとんどのシステムでは、PerlにバンドルされているCPANモジュールを使えばJiftyをダウンロードしてインストールできます。

  # perl -MCPAN -e'install Jifty'

Jiftyの".tar.gz"をダウンロードしてきた場合は手動でインストールすることもできます。

  # tar xzvf jifty-<version>.tgz
  # cd jifty-<version>
  # perl Makefile.PL
  # make
  # make test
  # make install

テストが通らないようでしたら、お話を聞きたいので、"jifty-devel@lists.jifty.org"に参加して失敗したことを報告してください（メーリング・リストへの参加方法については以下の「"困ったときは"」をご覧ください）。

足場をつくる（スキャフォールディング）

Jiftyをうまくインストールできたら、準備完了。はじめてのアプリケーションをつくってみましょう。

アプリケーションを走らせるにあたって、「本当に」必要なのはjiftyというコマンドラインツールのみです（新しくつくったアプリケーションのbin/ディレクトリに入っています）。

もちろんふつうはもう少しディレクトリやファイルを用意しておいた方が作業が楽になります。Jiftyにはそのような構造を構築するツールもついてきます。

どこか、新しいJiftyアプリケーションをつくってもかまわないディレクトリに移動してください（Jiftyはサブディレクトリをつくります）。

  # jifty app --name MyWeblog
  Creating new application MyWeblog
  Creating directory MyWeblog/lib
  Creating directory MyWeblog/lib/MyWeblog
  Creating directory MyWeblog/bin
  Creating directory MyWeblog/etc
  Creating directory MyWeblog/doc
  Creating directory MyWeblog/log
  Creating directory MyWeblog/var
  Creating directory MyWeblog/var/mason
  Creating directory MyWeblog/share
  Creating directory MyWeblog/share/po
  Creating directory MyWeblog/share/web
  Creating directory MyWeblog/share/web/templates
  Creating directory MyWeblog/share/web/static
  Creating directory MyWeblog/lib/MyWeblog/Model
  Creating directory MyWeblog/lib/MyWeblog/Action
  Creating directory MyWeblog/t
  Creating configuration file MyWeblog/etc/config.yml

では、ひとつひとつ見ていきましょう。

lib

lib/はみなさんのアプリケーションのコードを入れるところです。アプリケーションはふつういくつかのクラスで構成されます。

bin

bin/のなかにはjiftyというコマンド・ディスパッチャが入っています。特に重要なコマンドとしては、データベースのスキーマを設定したり更新したりする"schema"と、スタンドアロンのウェブサーバを起動する"server"があります。jiftyにどのようなコマンドがあるか知りたい場合は次のようにタイプしてください。

    jifty help

etc

etc/には設定ファイルが入ります。設定ファイルがない場合はJiftyが適切なデフォルト値を用意します。

doc

いかにJiftyの魔法でもドキュメントまでは書いてはくれませんが、「みなさんが」ドキュメントを書くときはdoc/に入れてください。

log

JiftyはLog::Log4perlを使ってログの設定を行います。デフォルトではlogディレクトリにserver.logとerror.logというログを吐き出します。

var

Jiftyはサーバが走っている間はここにキャッシュファイルを保管します。このディレクトリにはいっさい手を触れる必要はありません。

share/web/po

Jiftyは国際化にも対応しています。翻訳("portable object templates")はshare/web/po/に入れてください。

share/web/templates

モダンなJiftyアプリケーションのテンプレートとしてはTemplate::Declareをおすすめしていますが、HTML::Masonのテンプレートもサポートしています。Masonのテンプレートはshare/web/templates/に入れてください。Jiftyに最初からついてくるアプリケーションの「ひな形」もshare/web/templates/にインストールされます。このデフォルトアプリケーションは、基本的なアプリケーションを手っ取り早くつくるときには便利ですが、アプリケーションが進化していくにつれてカスタマイズが必要になっていくことでしょう。

PerlがどこにJiftyのデフォルト・テンプレートをインストールしたか知りたい場合は次のようにします。

  perl -MJifty::Util -e 'print Jifty::Util->share_root'

share/web/static

ウェブ・アプリケーションが提供するコンテンツのなかには、テンプレート・エンジンを通す必要のない（あるいは「通すべきでない」）ものも少なからずあります。

そのような静的ファイルについては、share/web/static/に入れておいてください。適切な名前のテンプレートがない場合は静的ファイルがサーブされます。

また、Jiftyには最初からCSSのスタイルシート、Javascriptライブラリ、Ponyがついてきます。Jiftyディストリビューションのshare/web/staticのなか、あるいはJiftyがデフォルトテンプレートをインストールした場所をご覧ください。

lib/MyWebLog/Model

アプリケーションの本当の基礎となるものは"lib/MyWeblog/Model"に入っています。ここに入っているクラスはアプリケーションのデータ構造とそれらの相関関係を定義するものです。Jiftyはこのモデル・クラスを利用して必要なときにデータベースのスキーマを設定・更新します。

Jiftyのオブジェクトモデルの詳細についてはJifty::Manual::ObjectModelをご覧ください。

lib/MyWebLog/Action

アクションはモデル・クラスに対するAPIです。ある意味アクションはHTMLフォームだと思われるかもしれませんが、それをもっと一般化したものです。Jiftyはみなさんのモデルに対して基本的なデータベース操作("CREATE", "READ", "UPDATE", "DELETE")を行うアクションを動的に生成します。

t

Jiftyはアプリケーションの土台を一式用意しますが、まだあらゆるテストを用意することまではできません（もっとも、生成したモデル・クラスに対する簡単なテストは用意します）。

データ・モデルを構築する

このチュートリアル・アプリケーションの名前がMyWebLogであることからも想像がつくかと思いますが、ここでは例題として簡単なウェブログ・アプリケーションをとりあげます。今後のチュートリアルでは、認証やコメント、RSSやAtomフィードの機能を追加する予定です。

記事

ウェブログの中心はふつう記事です。だから、当然最初につくるモデルは"post"になります。

  # cd MyWeblog
  # jifty model --name Post
  Writing file /tmp/MyWeblog/lib/MyWeblog/Model/Post.pm
  Writing file /tmp/MyWeblog/t/00-model-Post.t

すごいですね！　これでPostというモデルができたのです（もっとも、いまのところモデルらしいことはしませんけれどね）。

お好きなエディタでlib/MyWeblog/Model/Post.pmを開いてください。

このような画面になるはずです。

  use strict;
  use warnings;
  
  package MyWeblog::Model::Post;
  use Jifty::DBI::Schema;
  
  use MyWeblog::Record schema {
  
  };
  
  # Your model-specific methods go here.
  
  1;

では、このモデル・クラスに記事の構造を教えましょう。まずは記事に"body"と"title"を用意します（将来的には"category"を追加したり、"category"を"tags"テーブルにアップグレードして、完全なフォークソノミー対応にする予定です）。

カーソルを以下の行のすぐ下に移動してください。

  use MyWeblog::Record schema {

以下の行を加えます。

  column title =>
        type is 'text',
        label is 'Title',
        default is 'Untitled post';

  column body => 
        type is 'text',
        label is 'Content',
        render_as 'Textarea';

モデル・クラスを保存しましょう。

Jiftyのアプリケーション・サーバを起動する

これで簡単ながら動作するアプリケーションができました。"jifty server"とタイプしてウェブサーバを起動して見てみましょう。

最初に目にするのは、Jiftyはデータベースがないことに気がついたので用意します、というメッセージでしょう。Jiftyは、デフォルトではSQLiteデータベースを使ってアプリケーションをセットアップします。PostgreSQLやMySQLを使いたい場合はetc/config.ymlに多少設定を追加する必要があります(Jifty::Configにもう少し詳しい説明があります)。

    # jifty server
    WARN - Application schema has no version in the database.
    WARN - Automatically creating your database.
    INFO - Generating SQL for application MyWeblog...
    INFO - Using MyWeblog::Model::Post, as it appears to be new.
    INFO - Using Jifty::Model::Session, as it appears to be new.
    INFO - Using Jifty::Model::Metadata, as it appears to be new.
    INFO - Set up version 0.0.1, jifty version 0.81208
    INFO - You can connect to your server at http://localhost:8888/

最後の行以外はデータベースの設定についての情報です。これはJiftyがデータベースを変更したときにしか表示されません。

最後の行には、ブラウザで表示するときのURLが書いてあります。試しに見てみてください。AJAXのきいた管理UIやオンラインドキュメントブラウザ、Ponyをお見逃しなく。

プラットフォームによっては"./bin/jifty server"とタイプする必要があるかもしれません。

ユーザ・インタフェースの構築

管理画面を使えばアプリケーションのデータを管理するのに必要なものはすべて手に入ります。エントリを追加したり更新したり削除したりもできるのですが、それではあまりウェブログらしくはありません。

記事を投稿する

まずは新しいエントリを投稿するページをつくりましょう。

エディタで新しくlib/MyWeblog/View.pmというファイルを開いて、このようにしてください。

  package MyWeblog::View;
  use strict;
  use warnings;
  use Jifty::View::Declare -base;
  
  template post => page { title => 'Post Entry' } content {
      my $action = new_action(class => 'CreatePost');
  
      form {
          render_action $action;
          form_submit(label => 'Post');
      }
  };
  
  1;

閲覧する

「基本的な」エントリ一覧をつくるのは本当に簡単です。AJAXでページングするきれいな一覧の方はもう少し複雑ですが、ここでは両方のやり方を紹介します。お好みの方を選んでください。

手っ取り早いやり方

lib/MyWeblog/View.pmを開いて、"post"テンプレートとファイル末尾の"1;"の間にこのようなコードを追加してください。

  template '/' => page {
      # Get all posts.
      my $posts = MyWeblog::Model::PostCollection->new;
      $posts->unlimit;
  
      # Display each post in a <dl>.
      dl {
          while (my $post = $posts->next) {
              dt { $post->title }
              dd { $post->body  }
          }
      }
  };

これで"http://localhost:8888"に行くと、すべてのエントリが迎えてくれるようになります。

複雑だけどクールなツールをふんだんに使う方法

「複雑な方法」ではJiftyの上級機能のひとつである「ページ領域（Page regions）」というものを使います。領域を指定しておくと、最近の高性能なブラウザならAJAXで、"lynx"や"w3m"のように機能が限定されたブラウザでも通常のGETリクエストを使って、ページの一部だけを独立してリロードすることができます。

このアプローチの欠点は、指定する領域ごとに固有のテンプレートを用意しなければならないことです。でも、うれしいことに、これは領域の問題を抜きにしてもよいデザインの仕方といえます。

複雑な方法も、最初は簡単な方法と同じです。lib/MyWeblog/View.pmの'/'テンプレートをこのようなコードで置き換えてください（シンプルにしてしまうのが怖ければ追加しても結構です）。

  template '/' => page {
      render_region(
          name => 'myweblog-posts',
          path => '/fragments/page_of_posts',
      );
  };

勘のいい方ならたぶんもうおわかりでしょうが、今度はlib/MyWeblog/View.pmの中に"/fragments/page_of_posts"というテンプレートをつくる必要があります。このようにしてください。

  template '/fragments/page_of_posts' => sub {
      # Retrieve the current page argument, defaulting to 1.
      my $page = get('page') || 1;
      
      # Get all posts.
      my $posts = MyWeblog::Model::PostCollection->new;
      $posts->unlimit;
      
      # Display up to three posts on the current page.
      $posts->set_page_info(
          current_page => $page,
          per_page     => 3,
      );
  
      # Notify the user what page they're on if there are multiple.
      if ($posts->pager->last_page > 1) {
          p { "Page $page of " . $posts->pager->last_page }
      }
  
      # Display the current page of posts.
      dl {
          attr { class => 'list' };
  
          while (my $post = $posts->next) {
              dt { $post->title }
              dd { $post->body  }
          }
      };
  
      # Previous page link, the 'page' argument here will set a new value when
      # this region is invoked again.
      if ($posts->pager->previous_page) {
          hyperlink(
              label => 'Previous Page',
              onclick => {
                  args => {
                      page => $posts->pager->previous_page,
                  },
              },
          );
      }
  
      # Next page link.
      if ($posts->pager->next_page) {
          hyperlink(
              label => 'Next Page',
              onclick => {
                  args => {
                      page => $posts->pager->next_page,
                  },
              },
          );
      }
  };

さて、もう一度Jiftyのウェブサーバを起動してみましょう。ブラウザで"/post"を表示して、3つ以上記事を作成してみてください。トップページに戻って、AJAXの利いた"Next Page"と"Previous Page"というリンクがあることもチェックしましょう。Javascriptを切るか、"lynx"で見てみれば、AJAXが自動的にふつうのページの読み込みに変わる様子が確認できます。これだけできて無料なのですから、ありがたいことですね!

ところで、そのクラスはどこから来たの?

"MyWeblog::Model::PostCollection"というクラスを見て、あれっと思われた方もいるかもしれません。PostCollection.pmというファイルは存在しないからです。Jiftyは"Jifty::ClassLoader"を使ってさまざまなクラスを自動的に生成しています。もちろんお好みとあればこれらの定義をオーバーライドすることもできます。詳しくはJifty::ClassLoaderをご覧ください。

ここではウェブログにディスパッチャを設定しましょう。ディスパッチャは、リクエストされたURLに応じて「なにをするか」を決めるものです。「テンプレートをレンダリングする前」という規則を追加すれば追加のメニューを設定できます。

lib/MyWeblog/Dispatcher.pmというファイルを新たに開いて、この内容を貼り付けてください。

  package MyWeblog::Dispatcher;
  use strict;
  use warnings;
  use Jifty::Dispatcher -base;
  
  before '*' => run {
      my $top = Jifty->web->navigation;
      $top->child(Home => url => '/');
      $top->child(Post => url => '/post', label => 'Post Article');
  };
  
  1;

メニューシステムの詳細はJifty::Web::Menuをご覧ください。