albatrosary's blog

UI/UXとエンタープライズシステム

YEOMAN Advent Calendar 13日目:generator-jhipster を紹介します

ジェネレータ generator-jhipster を紹介します。このエントリーは「YEOMAN Advent Calendar 2014」12月13日の記事です。

YEOMAN Advent Calendar 2014 - Adventar

MEANスタックとして MongoDB / Express / AngularJS / NodeJS が話題となり generator-angular-fullstack の使い勝手とかがテーマとしてあげられることも多くなったと思います。

MEAN(MongoDB, Express, AngularJS, Node.js)スタックが優れている理由 - Mozilla Open Web Day in Tokyoを終えて - albatrosary's blog

組み合わせはそれだけではありません。JHipster というのがあります。もしかすると現状のエンタープライズでSPA開発するなら一番条件が良いのかもしれないです。つまり「JAM2エンタープライズフルスタック」です(私が勝手に名前を付けました)。これは Java (Spring) / AngularJS / Maven / MongoDB(or MySQL / PostgreSQL) から構成されています。JHipster とは Java Hipster のことで「Java通」とでもいうことでしょうか。

f:id:albatrosary:20141213160510p:plain

インストールから実行まで

インストール

$ npm install -g generator-jhipster
$ mkdir jhipster && cd $_
$ yo jhipster

オプションが多いです。

$ yo jhipster

 _     _   ___   __  _____  ____  ___       __  _____   __    __    _    
| |_| | | | |_) ( (`  | |  | |_  | |_)     ( (`  | |   / /\  / /`  | |_/ 
|_| | |_| |_|   _)_)  |_|  |_|__ |_| \     _)_)  |_|  /_/--\ \_\_, |_| \ 
                             ____  ___   ___                             
                            | |_  / / \ | |_)                            
                            |_|   \_\_/ |_| \                            
              _    __    _       __        ___   ____  _      __        
             | |  / /\  \ \  /  / /\      | | \ | |_  \ \  / ( (`       
           \_|_| /_/--\  \_\/  /_/--\     |_|_/ |_|__  \_\/  _)_)       


Welcome to the JHipster Generator

? (1/13) What is the base name of your application? jhipster
? (2/13) What is your default Java package name? com.mycompany.myapp
? (3/13) Do you want to use Java 8? (Use arrow keys)
❯ Yes (use Java 8) 
  No (use Java 7) 
? (4/13) Which *type* of authentication would you like to use? (Use arrow keys)
❯ Cookie-Based Authentication (Session) 
  Token-Based Authentication (Oauth2) 
? (5/13) Which *type* of database would you like to use? (Use arrow keys)
  SQL (H2, MySQL, PostgreSQL) 
❯ NoSQL (MongoDB) 
? (6/13) Which *production* database would you like to use? MongoDB
? (7/13) Which *development* database would you like to use? MongoDB
? (8/13) Do you want to use Hibernate 2nd level cache? No (this not possible with the NoSQL option)
? (9/13) Do you want to use clustered HTTP sessions? No
? (10/13) Do you want to use WebSockets? No
? (11/13) Would you like to use Maven or Gradle for building the backend? (Use arrow keys)
❯ Maven (recommended) 
  Gradle
? (12/13) Would you like to use Grunt or Gulp.js for building the frontend? (Use arrow keys)
❯ Grunt (recommended) 
  Gulp.js 
? (13/13) Would you like to use the Compass CSS Authoring Framework? (y/N) 

実行

gulp でも grunt でも良いのですが今回は grunt で設定してますので:

$ grunt server

f:id:albatrosary:20141213161720p:plain

f:id:albatrosary:20141213162107p:plain

f:id:albatrosary:20141213162127p:plain

最後に

当たり前ですが pom.xml もしっかりあり、Javaのソース・コードもきれいなコードが書かれています。フロントエンジニアがここからJavaを学ぶのもひとつの手段としてはいいかもしれません。