Your browser doesn't support the features required by impress.js, so you are presented with a simplified version of this presentation.

For the best experience please use the latest Chrome, Safari or Firefox browser.

Perl入学式

Perl入学式 #8

http://www.perl-entrance.org

Perl入学式について

会場について

  • 今回のPerl入学式は「Joe'sオープンソースJelly」の一環ということで、株式会社Joe'sクラウドコンピューティング(http://www.joeswebhosting.net)様より特別に会場をお借りしています
  • この場をお借りしてお礼申し上げます

ロゴについて

Perl入学式

  • 横山陽平さん(http://yokoyamayohei.com/)にデザインしていただきました
  • この場をお借りしてお礼申し上げます

IT勉強会スタンプラリー

IT勉強会スタンプラリー

  • Perl入学式は, IT勉強会スタンプラリー(http://it-stamp.jp/)に参加しています
  • 今回のPerl入学式は, スタンプラリーの対象となる勉強会です
  • 台紙は勉強会終了後にお渡しします

喋ってる人

  • 名前 : papix (ぱぴっくす)
  • Twitter : @papix
  • 仕事 : 大学院生
  • ブログ : Masteries

YAPC::Asiaに行こう!

  • Yet Another Perl Conference
    • 日本最大級のPerlの祭典!
    • 2012年9月27日から29日!!
    • 会場:東京大学!!!

Perl入学式も出ます!

本日の内容

  • Perlでのテスト - Test::More
  • 復習問題
  • Mojoliciousを使ってみよう
  • Mojoliciousでhello, world!
  • スタイルを整えてみよう
  • 複数のページを作ってみよう

Perlでのテスト - Test::More

  • プログラミング言語を使ってプロダクトを作る上で, テストは非常に重要です.
    • まずテストから書き始める, というTDD(test-driven development)という開発手法があったりもします.
  • もちろんPerlには, テストを助けるモジュールがいくつかあります.
  • 今回は, その中の1つ, Test::Moreをご紹介します.

sample.pl

  1. use strict;
  2. use warnings;
  3. # &pow($x, $y) = $x ** $y を計算する関数
  4. sub pow {
  5. my ($left, $right) = @_;
  6. return $left ** $right;
  7. }
  8. 1;
  • このスクリプトをテストします.

sample.t

  1. use Test::More;
  2. require_ok( 'sample.pl' ); # テストするスクリプト
  3. # &pow(2, 3) = 2 ** 3 = 8になるか確かめるテスト
  4. is( &pow(2, 3), 8, '&pow(2, 3) is 8');
  5. # テストの終わりを示すお約束
  6. done_testing;
  • is関数は, 1つ目の引数と2つ目の引数の値を比較して真ならok, 偽ならngとなります.
  • 3つ目の引数はコメント(テストの説明)です.
  • テスト用スクリプトは拡張子を.tにして, tディレクトリに格納することが習慣となっています.

テスト実行

  1. $ perl t/sample.t
  2. ok 1 - require 'sample.pl';
  3. ok 2 - &pow(2, 3) is 8
  4. 1..2
  • 問題がないなら, このように'ok'が出力されます.

失敗した場合

  1. $ perl t/sample.t
  2. ok 1 - require 'sample.pl';
  3. not ok 2 - &pow(2, 3) is 8
  4. # Failed test '&pow(2, 3) is 8'
  5. # at t/sample.t line 5.
  6. # got: '9'
  7. # expected: '8'
  8. 1..2
  9. # Looks like you failed 1 test of 2.
  • 実装した関数に問題があり, 条件式が偽になる場合, このようなエラーが出力されます.

テスト用関数(1)

  1. # 引数の$gotと$expectedをeqで比較して真かどうかテスト.
  2. is( $got, $expected, $test_name );
  3. # 引数の1つ目が真かどうかテスト.
  4. ok( $got eq $expected, $test_name);
  5. # 引数の$gotが正規表現のqr/expected/にマッチするかテスト.
  6. like( $got, qr/expected/, $test_name );
  7. # リファレンスである$gotと$expectedが同じ構造(内容)かテスト.
  8. is_deeply( $got, $expected, $test_name );
  • $test_nameはテストの説明です.

テスト用関数(2)

  1. # 引数の$gotと$expectedをneで比較して真かどうかテスト.
  2. isnt( $got, $expected, $test_name );
  3. # 引数の$gotが正規表現のqr/expected/にマッチしないかテスト.
  4. unlike( $got, qr/expected/, $test_name );
  5. # 引数の$gotと$expectedを演算子$opで比較して真かどうかテスト.
  6. cmp_ok( $got, $op, $expected, $test_name );
  7. # 例: $gotと$expectedを'&&'演算子で比較
  8. cmp_ok( $got, '&&', $expected, $test_name );

Test::Moreの詳細

Let's challenge!

  • Test::Moreを使いつつ, ここまで学んできたことを復習してみましょう.
    • Perl入学式のgithubアカウントに, 第8回用の復習問題リポジトリがあります.
    • まず最初に, $ git clone git://github.com/perl-entrance-org/perl-entrance-2012-08.gitでclone(ダウンロード)しましょう.
  • gitがインストールされていない場合インストールしましょう.
    • Ubuntuの場合, $ sudo apt-get install git-coreでOKです.

お約束

  1. #!/usr/bin/env perl
  2. use utf8;
  3. use strict;
  4. use warnings;
  5. binmode STDIN, ":encoding(UTF-8)";
  6. binmode STDOUT, ":utf8";
  7. binmode STDERR, ":utf8";
  • スクリプトを書く前に, このお約束のコードを書くようにしましょう.
  • 以下, お約束は省略します.

復習問題(時間: 30分)

  • t/perl-entrance-08.tがテストスクリプト, perl-entrance-08.plが回答用スクリプトです.
  • 回答用スクリプトに問題が書いてありますので, 問題に従ってスクリプトを記述すれば, perl-entrance-08.tが全てOKになるはずです.
  • わからない点, こまった所は遠慮せず聞いて下さいね.
    • ちなみに, t/sample.t, sample.plは, 先程Test::Moreの説明で使ったスクリプトです.

Mojoliciousを使ってみよう

  • Perl入学式 #8以降は, Mojoliciousを利用した簡単なウェブアプリケーション開発を経験しつつ, ここまでに学んだ知識や, ここまで紹介できなかったテクニックを披露していきたいと考えています.
  • #8から#12までの全4回で構成する... 予定です.

What's is Mojolicious?

  • Mojolicious(もじょりしゃす)は, PerlのWebアプリケーションフレームワークです.
  • cpanでMojoliciousをインストールすれば, 試験用サーバ'morbo'などの環境も用意できます.
  • 日本語マニュアルもあります.

Mojoliciousの環境構築

  • #8に向けた宿題でも解説しましたが, 念の為もう一度...
  • Perlbrewなどでcpanmがインストールされている場合, $ cpanm MojoliciousでOKです.
  • cpanmがインストールされていない場合, $ sudo cpan Mojoliciousでインストールできます.

Mojoliciousの動作を確認

  • ワンライナーでMojoliciousがインストールできたか確認します.
    • mojo versionを実行してPerlのバージョンやMojoliciousのバージョンが表示されればOKです.
    • $ perl -Mojo -E 'a( { "text" => "Neko" } )->start;' daemonを実行した後, ブラウザで127.0.0.1:3000を開いて, Necoと表示されればOKです.

Mojoliciousでhello, world!

  1. use Mojolicious::Lite;
  2. use utf8;
  3. get '/' => sub {
  4. my $self = shift;
  5. $self->render(text => 'Hello, world!');
  6. };
  7. app->start;
  • 早速, Mojoliciousでhello, world!を動かしてみましょう.
  • このスクリプトをhello.plという名前で保存して, $ morbo hello.plで実行してみましょう.
  • ブラウザで127.0.0.1:3000を開けば, Hello, world!と表示されるはずです.

コードの解説(1)

  1. use Mojolicious::Lite;
  2. use utf8;
  • Mojolicious::LiteMojoliciousのLite版... って, そのまんまですね.
  • Mojolicious::Liteは1つのスクリプトで複数のページを作成できます. 一方Mojoliciousは, 1ページ=1スクリプトで構成されます.
  • もちろん, Mojolicious::Liteで作成した複数のページを, Mojoliciousの為に分割することも可能です.
  • 「まずはMojolicious::Liteで作って, 大規模になったらMojoliciousに」という事も可能です.

コードの説明(1)

  1. use Mojolicious::Lite;
  2. use utf8;
  • Mojolicious::LiteMojoliciousをインストールすれば同時にインストールされますので, 別にインストールする必要はありません.
  • use Mojolicious::Lite;をすれば, 自動的にuse warnings;use strict;が有効になります. わざわざ書く必要はありません.
  • 以下, この2行は省略します.

コードの説明(2)

  1. get '/' => sub {
  2. my $self = shift;
  3. $self->render(text => 'Hello, world!');
  4. };
  • get '/' => sub { ... };は, getメソッドで'/'にアクセスした場合, subの中の...の処理を行う, という意味です.
  • my $self = shift;は「お約束」と思っておいて下さい.

コードの説明(2)

  1. get '/' => sub {
  2. my $self = shift;
  3. $self->render(text => 'Hello, world!');
  4. };
  • $self->render(text => 'Hello, world!');で, 「textの形式で, 'hello, world!'と出力せよ!」という命令をしています.
  • renderの引数がjson => { x => 3 }なら, json形式で{"x":3}が出力されますし, text => 'Oops!', status => '410'とすれば, ステータスコードを指定することもできます.

コードの説明(3)

  1. app->start;
  • アプリケーションとして実行します, というような意味があります.
  • これも「お約束」と思っておいて下さい.

練習問題A(10分)

  • Mojolicious::Liteを使って, hello, mojolicious! my name is (あなたの名前)と出力するスクリプトを書いて, 実行してみましょう.

スタイルを整えてみよう

  • とりあえずテキストは出力されましたが, シンプルです.
  • もう少し, 「スタイリッシュに」キメたいところです.
  • HTMLを使って整形してみましょう.

テンプレート

  1. __DATA__
  2. @@ index.html.ep
  3. <html>
  4. <head><title><%= $title %></title></head>
  5. <body style='padding: 30px;'>
  6. <%= $string %>
  7. </body>
  8. </html>
  • hello.plの末尾に(app->start;の後に), このようなテンプレートを用意します.
  • テンプレートを用意することで, 複数のページで同じようなHTMLを使うことができます.
  • テンプレートを別ファイルとして保存する場合はtemplate/index.html.epとして保存することで適用されます.

テンプレートとデータ

  1. get '/' => sub {
  2. my $self = shift;
  3. $self->stash(string => 'Hello, world!', title => 'hello');
  4. $self->render();
  5. } => 'index';
  • /にアクセスした際の動作を記載する関数を, このように書き換えましょう.
  • $self->stashで, 先程記述したテンプレートにデータを渡すことができます.
  • 最後に=> 'index';と記載することで, 使用するテンプレートを指定できます.

テンプレートと変数

  1. __DATA__
  2. @@ index.html.ep
  3. <html>
  4. <head><title><%= $title %></title></head>
  5. <body style='padding: 30px;'>
  6. <%= $string %>
  7. </body>
  8. </html>
  • stashでデータが渡されているので, テンプレートの中の<%= $title %>helloに, <%= $string %>は, Hello, world!に置き換わります.
  • <%= $xxx %>は, テンプレートの中で使える変数だと思って下さい.

練習問題B(10分)

  1. @@ profile.html.ep
  2. <html>
  3. <head><title><%= $name %>のプロフィール</title></head>
  4. <body style='padding: 30px;'>
  5. 私の名前は<%= $name %>です.<br>
  6. 趣味は<%= $hobby %>で, 好きなプログラミング言語は<%= $language %>です.
  7. </body>
  8. </html>
  • このようなテンプレートに対し, stashでname, hobby, languageを与え, あなたの自己紹介(プロフィール)ページを作ってみよう.

複数のページを作ってみよう

  • さきほどのプロフィールを独立したページにして, トップページからリンクを踏めば, プロフィールページを閲覧できるようにしてみましょう.

インデックスページの用意

  • 先程練習問題の為にcloneしたgitリポジトリの中にある, app.plを編集していきます.
  • 必要なテンプレートはapp.plの中に用意してあります.
  • stashで渡すデータであるnameが空になっているので, あなたの名前を入力してください.
  • morboで実行し, ブラウザでアクセスするとリンクが出てきます. しかし, リンクをクリックするとエラーが出力されます.

プロフィールページの用意

  1. get '/profile' => sub {
  2. ...
  3. };
  • リンク先の, プロフィールページを作りましょう.
  • テンプレートは既に用意してあるので, $app->start;よりも上に, 次のようなコードを書きましょう.
  • 関数の中身は, 練習問題Bで関数の中に書いたコードと同じです.

動作確認

  • morboで実行し, ブラウザでアクセスしてみましょう.
  • リンクを踏めば, 練習問題Bで作ったプロフィールページが表示されるはずです.

最終問題C(30分)

  • インデックスページ, プロフィールページの他, もう1つページを作ってみてください.

質問タイム

お疲れさまでした

Use a spacebar or arrow keys to navigate