Nephia入門講座, 第2回目です. 第2回と第3回で, Nephiaを使って簡単な占いアプリを作ってみましょう.
まずは, nephia-setupでひな形を作ります.
占いサービスなので, 名前はUranaiでいきましょう.
$ nephia-setup Uranai
create path Uranai
create path Uranai/lib
create path Uranai/etc
create path Uranai/etc/conf
create path Uranai/view
create path Uranai/root
create path Uranai/root/static
create path Uranai/t
spew into file Uranai/app.psgi
spew into file Uranai/lib/Uranai.pm
spew into file Uranai/view/index.html
spew into file Uranai/root/static/style.css
spew into file Uranai/cpanfile
spew into file Uranai/t/001_basic.t
spew into file Uranai/etc/conf/common.pl
spew into file Uranai/etc/conf/development.pl
spew into file Uranai/etc/conf/staging.pl
spew into file Uranai/etc/conf/production.pl
spew into file Uranai/.gitignore
まず最初に, nephia-setupが生成するひな形のディレクトリ構成を見てみましょう.
どこにどのようなファイルがあって, どのような役割をするのかを確認します.
.
├── app.psgi
├── cpanfile
├── etc
│ └── conf
│ ├── common.pl
│ ├── development.pl
│ ├── production.pl
│ └── staging.pl
├── lib
│ └── Uranai.pm
├── root
│ └── static
│ └── style.css
├── t
│ └── 001_basic.t
└── view
└── index.html
nephia-setupコマンドが生成したUranaiディレクトリに移動して, treeコマンドでディレクトリとファイルの構成を表示してみると, このようになっています.
上から順に見ていきます.
この｢Nephia入門｣の中ではapp.psgiに手を加える事はありません.
とりあえず現時点では, ｢plackupコマンドの引数にこのファイルを与えると, Nephiaで書かれたWebサービスが起動する｣とだけ覚えておいて下さい.
この占いアプリが必要とするCPANモジュールの一覧です.
例えば, 処理の一部にAcme::SuddenlyDeathモジュールを使うのであれば,
requires 'Nephia' => '0';
requires 'Config::Micro' => '0.02';
requires 'Acme::SuddenlyDeath' => '0';
on test => sub {
requires 'Test::More', '0.98';
};このように追加する必要があります.
cpanfileを適切に用意することで, プロダクション環境(本番環境. VPSのサーバ上とか...)で動かす際に, 必要なモジュールをcpanm installdeps .やcarton install --deploymentだけで準備できるようになります.
設定ファイルが置かれるディレクトリです. 初期状態では, 設定ファイルはcommon.pl, development.pl, production.pl, staging.plの4つが用意されています. これらのファイルの使い分けは, 以下の通りです.
- development.pl ... 開発環境の設定
- staging.pl ... ステージング環境(最終動作確認を行う環境)の設定
- production.pl ... プロダクション環境の設定
- common.pl ... 上記3つで共通の設定
例えば, common.plはこのようになっています.
### common config
1.{
appname => 'Uranai',
};appnameというキーに結び付けられた文字列が, 開発するウェブサービスの名前になります.
Uranaiという名前はシンプルすぎるので, 占いアプリに書き換えてみましょう.
### common config
use utf8;
1.{
appname => '占いアプリ',
};use utf8の挿入を忘れないでください.
この1行を入れ忘れると, ウェブサービスの名前が全て文字化けしてしまいます.
plackupコマンドでウェブサービスを起動してアクセスすると, 確かにトップページのタイトルが変わっているのが確認できるはずです.
このように, ウェブサービスにおいて, どのような環境でも共通する情報は, このcommon.plにハッシュとして格納しておくことをおすすめします.
さて, 一方のdevelopment.plやproduction.plには, それぞれの環境固有の情報を格納していきます. 例えば, (占いアプリの開発では使いませんが)MySQLやSQLiteにアクセスする為の情報などですね.
development.plやproduction.plの切り替えは, plackupコマンドへのオプションで指定することができます.
例えば, plackup -E production app.psgiのように起動すると, 設定ファイルとしてproduction.plが使用されるので, トップページのウェブサービス名の右側が｢production｣に変化します.
ちなみに, -Eオプションの指定がない場合は, 自動的にdevelopment.plが利用されます.
ここに, 占いアプリに必要な処理を書いていきます. フォームなどに記入されたデータを読み込み, データベースへのアクセス, データの変換･生成などの処理を行なってから, 出力するテンプレート(HTMLのひな形)と, それに渡すデータを指定するまでを担います. また, 接続されたURLによって実行する処理を切り替える, ディスパッチャーとしての記述も, このファイルに行います.
ここにCSSやjs, 画像などを置くと, 静的なファイルとして利用できるようになります.
例えば, 初期状態で生成されているroot/static/style.cssは, /static/style.cssとしてアクセスできるようになります.
テストを書くディレクトリです. 先ほどのapp.psgiと同じく, ｢Nephia入門｣の中で触れる予定はありません.
ウェブサービスの見た目を司るテンプレートを置くディレクトリです.
lib/Uranai.pmなどのコードが処理･生成したデータをテンプレートに埋め込むことで, ウェブサービスを構築することができます.
それでは, 実際に占いアプリを開発していきましょう!
今回は, /にアクセスがあった場合, index.htmlというテンプレートを表示して, ここで占いの結果と一緒に表示する｢名前｣をテキストフォームから入力してもらうことにします.
また, テキストフォームに入力された名前を送信すると, GETメソッドで/uranaiにアクセスして, uranai.htmlというテンプレートを使って, 占い結果を表示する形にしましょう.
まずはlib/Uranai.pmの実装から開始して, その後にテンプレートを用意する, という順番で作って行きたいと思います.
というわけで, lib/Uranai.pmに対して占いアプリが必要とする機能を実装していきます.
...結果, このようになりました.
package Uranai;
use strict;
use warnings;
use utf8;
use Nephia;
path '/' => sub { # ... (1)
my $req = shift;
return {
template => 'index.html',
title => config->{appname}, # ... (2)
envname => config->{envname},
apppath => 'lib/' . __PACKAGE__ .'.pm',
};
};
path '/uranai' => sub { # ... (3)
my $req = shift;
my @results = qw/ 大凶 凶 吉 小吉 中吉 大吉 /; # ... (4)
my $result = $results[int rand(@results)];
my $name = $req->param('name'); # ... (5)
return {
template => 'uranai.html',
name => $req->param('name'),
result => $result, # ... (6)
title => config->{appname},
envname => config->{envname},
};
};よく見ると, path 'URL' => sub { コード };という構成が2つありますね.
これは, ｢'URL'にアクセスがあった場合, 'コード'の処理を行う｣ということを意味します.
というわけで, そえrぞれの
/にアクセスがあった場合の処理は, (1)の行から書かれています.
ここでは特に処理を行わず, 結果を表示する上で必要なデータをreturnで返しているだけです.
まず, templateは結果を出力する際に使用するテンプレートを指定しています.
その為, この場合は/にアクセスがあった時に, index.htmlというテンプレートにデータを埋め込んで描画する... という流れになるはずです.
次のtitleとenvnameは, それぞれcommon.plに記述されているappnameとenvnameを, テンプレートに埋め込む為のデータとして用意しています. common.plと, 使用されている設定ファイル(development.plとか, production.plとか...)のデータは, (2)のようにconfigというメソッドから読み込むことができます.
一方, /uranaiにアクセスがあった場合の処理が(3)の行から書かれています.
(4)の行で, 占いの結果を生成しています. 今回はあまり凝ったものを作るつもりはないので, rand関数を使って, アクセスするごとにランダムに結果を生成するようにしました.
(5)では, index.htmlのテキストフォームから, nameというパラメータ名に紐付けて送られてくる名前を受け取っています.
このように, GETメソッドやPOSTメソッドで送られたデータは, $req->param('パラメータ名')で受け取ることができます.
必要なデータを生成した後は, /と同じく結果を表示する上で必要なデータをreturnで返しています.
テンプレートは, 占いの結果を表示する部分を用意した, uranai.htmlを使用します.
同時に, 名前はname, 占い結果はresultというキーに紐付けています.
これで, lib/Uranai.pmの準備は完了です.
後はテンプレートを用意すれば動くのですが, ちょっと長くなってしまったので, 今日はここまでにしたいと思います.
次回の｢Nephia入門 (3)｣では, index.htmlとuranai.htmlという2つのテンプレートを作って, 占いアプリの完成を目指します.