PerlでWebアプリのモデルなしサンプル - m_shige1979のときどきITブログ

なんか色々と迷走している感じ、調べているけどどんなものを作成するのがいいかで結構悩み中

Mojoliciousで作成する

生成

$ mojo generate app Sample::Web

↓

[vagrant@localhost mojo1]$ mojo generate app Sample::Web
  [mkdir] /vagrant/perl/mojo1/sample_web/script
  [write] /vagrant/perl/mojo1/sample_web/script/sample_web
  [chmod] sample_web/script/sample_web 744
  [mkdir] /vagrant/perl/mojo1/sample_web/lib/Sample
  [write] /vagrant/perl/mojo1/sample_web/lib/Sample/Web.pm
  [mkdir] /vagrant/perl/mojo1/sample_web/lib/Sample/Web
  [write] /vagrant/perl/mojo1/sample_web/lib/Sample/Web/Example.pm
  [mkdir] /vagrant/perl/mojo1/sample_web/t
  [write] /vagrant/perl/mojo1/sample_web/t/basic.t
  [mkdir] /vagrant/perl/mojo1/sample_web/log
  [mkdir] /vagrant/perl/mojo1/sample_web/public
  [write] /vagrant/perl/mojo1/sample_web/public/index.html
  [mkdir] /vagrant/perl/mojo1/sample_web/templates/layouts
  [write] /vagrant/perl/mojo1/sample_web/templates/layouts/default.html.ep
  [mkdir] /vagrant/perl/mojo1/sample_web/templates/example
  [write] /vagrant/perl/mojo1/sample_web/templates/example/welcome.html.ep
[vagrant@localhost mojo1]$
$

ディレクトリ構成

[vagrant@localhost mojo1]$ tree
.
└── sample_web
    ├── lib
    │   └── Sample
    │       ├── Web
    │       │   └── Example.pm
    │       └── Web.pm
    ├── log
    ├── public
    │   └── index.html
    ├── script
    │   └── sample_web
    ├── t
    │   └── basic.t
    └── templates
        ├── example
        │   └── welcome.html.ep
        └── layouts
            └── default.html.ep

11 directories, 7 files
[vagrant@localhost mojo1]$

起動

[vagrant@localhost mojo1]$ morbo sample_web/script/sample_web            
Server available at http://127.0.0.1:3000.

f:id:m_shige1979:20140803082243p:plain

Web.pm

sample_web/lib/Sample/Web.pm

package Sample::Web;
use Mojo::Base 'Mojolicious';

# This method will run once at server start
sub startup {
  my $self = shift;

  # Documentation browser under "/perldoc"
  $self->plugin('PODRenderer');

  # Router
  my $r = $self->routes;

  # Normal route to controller
  $r->get('/')->to('example#welcome');
  $r->get('/test1')->to('test1#index');
  $r->get('/test1/new')->to('test1#post');
  $r->post('/test1/create')->to('test1#create');

}

1;

※なんか適当に追加

新しくTest1.pm追加

package Sample::Web::Test1;
use Mojo::Base 'Mojolicious::Controller';

# This action will render a template
sub index {
  my $self = shift;

  # template変数を設定
  #$self->stash->{msg} = "index";

  $self->app->log->debug("index");

  # template配下のtest1.aaa.html.ep
  $self->render();

}

sub post {
  my $self = shift;

  # template変数を設定
  #$self->stash->{msg} = "index";

  $self->app->log->debug("new");

  # template配下のtest1.aaa.html.ep
  $self->render('test1/post');

}

sub create {
  my $self = shift;

  $self->redirect_to('/test1');

}

1;

template

layouts/default.html.ep

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <link rel="stylesheet" href="/css/bootstrap-theme.min.css">
    <title><%= title %></title>
  </head>
  <body>
    <div class="header">

    </div>
    <div class="container">
        <%= content %>
    </div>
    <div class="footer">

    </div>
    <script src="/js/jquery-2.1.1.min.js"></script>
    <script src="/js/bootstrap.min.js"></script>

  </body>
</html>

test1/index.html.ep

% layout 'default';
% title 'Welcome';

<h1>一覧を表示する画面</h1>

<a href="/test1/new" class="btn btn-default">新規</a>
<br />
<div class="row">
    <br />
    <table class="table">
        <tr>
            <td>1</td>
            <td>タイトル１</td>
            <td>本文１</td>
        </tr>
        <tr>
            <td>2</td>
            <td>タイトル２</td>
            <td>本文２</td>
        </tr>
        <tr>
            <td>3</td>
            <td>タイトル２</td>
            <td>本文３</td>
        </tr>
    </table>
</div>

post.html.cp

% layout 'default';
% title 'Welcome';

<h1>入力してpostする画面</h1>

<form action="./create" method="post">
    <form role="form">
      <div class="form-group">
        <label for="title">タイトル</label>
        <input type="text" class="form-control" id="title" placeholder="タイトル">
      </div>
      <div class="form-group">
        <label for="body">Password</label>
        <input type="text" class="form-control" id="body" placeholder="本文">
      </div>
      <button type="submit" class="btn btn-default">登録する</button>
    </form>
</form>