gist

2012年3月29日木曜日

MVCフレームワーク「Coke」をインストールしてみた。

Coke はNode用のMVCフレームワークです。

一気にインストール&アプリの雛形生成です。

$ npm install -g coke
$ coke new coke_sample
$ !$
$ npm install -l


ファイル構成はこんな感じです。

$ tree .
.
├── README.md
├── app
│   ├── controllers
│   │   ├── application.js
│   │   └── welcome.js
│   ├── helpers
│   │   └── application.js
│   ├── libs
│   ├── locals
│   │   └── en
│   │       └── welcome.js
│   ├── middlewares
│   │   ├── csrf.js
│   │   ├── err404.js
│   │   ├── err500.js
│   │   └── session.js
│   ├── models
│   └── views
│       ├── common
│       │   └── _nav.html
│       ├── error
│       │   ├── 404.html
│       │   └── 500.html
│       ├── layouts
│       │   └── default.html
│       └── welcome
│           └── index.html
├── config
│   ├── assets.yml
│   ├── dev
│   │   ├── config.yml
│   │   └── express.js
│   ├── prod
│   │   ├── config.yml
│   │   └── express.js
│   ├── routes.js
│   └── test
│       ├── config.yml
│       └── express.js
├── db
│   └── schema.js
├── doc
│   └── README.md
├── log
│   ├── monit.log
│   ├── nginx.log
│   ├── static.log
│   └── upstart.log
├── package.json
├── public
│   ├── apple-touch-icon-114x114-precomposed.png
│   ├── apple-touch-icon-129x129-precomposed.png
│   ├── apple-touch-icon-57x57-precomposed.png
│   ├── apple-touch-icon-72x72-precomposed.png
│   ├── apple-touch-icon-precomposed.png
│   ├── apple-touch-icon.png
│   ├── assets
│   ├── css
│   │   └── common
│   │       ├── base.css
│   │       ├── flash.css
│   │       ├── footer.css
│   │       ├── header.css
│   │       ├── nav.css
│   │       ├── reset.css
│   │       └── util.css
│   ├── favicon.ico
│   ├── img
│   │   └── sprite.png
│   ├── js
│   │   └── common
│   │       └── ga.js
│   └── robots.txt
├── server.js
├── test
└── tmp

i18nやスマートフォン用のサイトにも対応していそうです。設定はymlですね。

サーバの起動は、coke コマンドで。mongodbを起動してから。

$ coke s

画面は http://localhost:4000 で。

scaffoldもありますが、上手く動作しないみたい。。。

$ coke g scaffold posts title content is_public:bool
exists  app/
exists  app/controllers/
exists  app/models/
exists  app/views/
create  app/views/posts/
update  db/schema.js
create  app/models/Post.js
create  app/views/posts/_form.html
create  app/views/posts/edit.html
create  app/views/posts/index.html
create  app/views/posts/new.html
create  app/views/posts/show.html
update  app/views/common/_nav.html
create  public/css/scaffold.css
create  app/controllers/posts.js
update  config/routes.js


$ coke s

最初の画面

編集

詳細

一覧

生成されたコントローラ app/controllers/posts.js を眺めてみます。

var mongoose = require( 'mongoose' );
var Post = mongoose.model( 'Post' );
var Application = require( CONTROLLER_DIR + 'application' );

module.exports = Application.extend({

  init : function ( before, after ){
    after( this.validation, {
      only : [ 'create', 'update' ]
    }); 

    after( this.unique, {
      only : [ 'create', 'update' ]
    }); 

    after( this.record_not_found, {
      except : [ 'new', 'create', 'index' ]
    }); 
  },  

  'new' : function ( req, res, next ){
    res.render( 'posts/new' );
  },  

  create : function ( req, res, next ){
    Post.create_or_update( new Post(), req.body.post,
      function ( err, post ){
        if( err ){
          next( err );
          return;
        }   

        req.flash( 'flash-info', 'Post created' );
        res.redirect( '/posts/' + post._id );
      }); 
  },  

  index : function ( req, res, next ){
    Post.find( function ( err, posts ){
      if( err ){
        next( err );
        return;
      }   

      res.render( 'posts/index', {
        posts : posts
      }); 
    }); 
 },

  show : function ( req, res, next ){
    Post.findById( req.params.id , function ( err, post ){
      if( post ){
        res.render( 'posts/show', {
          post : post
        });

        return;
      }

      req.msg = 'User';
      next( err );
    });
  },

  edit : function ( req, res, next ){
    Post.findById( req.params.id , function ( err, post ){
      if( post ){
        res.render( 'posts/edit', {
          post : post
        });

        return;
      }

      req.msg = 'User';
      next( err );
    });
  },

  update : function ( req, res, next ){
    Post.findById( req.params.id , function ( err, post ){
      if( post ){
        Post.create_or_update( post, req.body.post,
          function ( err, post ){
            if( err ){
              next( err );
              return;
            }

            req.flash( 'flash-info', 'Post updated' );
            res.redirect( '/posts/' + post._id );
          });

        return;
      }
      req.msg = 'User';
      next( err );
    });
  },

  destroy : function ( req, res, next ){
    Post.findById( req.params.id , function ( err, post ){
      if( post ){
        post.remove( function ( err, post ){
          if( err ){
            next( err );
            return;
          }

          req.flash( 'flash-info', 'Post deleted' );
          res.redirect( '/posts' );
        });

        return;
      }

      req.msg = 'User';
      next( err );
    });
  }
});

一覧、生成、編集、削除と一通りキレイに生成されています。

0 件のコメント: