SlideShare a Scribd company logo
フロントエンドと
バックエンドの
ビルド構成について
原 一浩 @kara_d
Play Framework 2 Meetup
自己紹介
2
原 一浩
ハラ カズヒロ
グレーティブ合同会社代表
Playはじめて&もくもく会主宰
Play JavaのCRUDプラグインを開発
Play Javaでアプリケーションを
開発運用中
http://greative.jp/
( @kara_d )
Playはじめて&もくもく会
3
playframeworkja.doorkeeper.jp
現在第21回まで開催
Scala版 8割、Java版 2割
Play Framework 2徹底入門
- JavaではじめるアジャイルWeb開発
4
実践編(4章∼7章)を担当
✦ サンプルアプリの企画から設計、構築、テ
スト、管理画面作成までを一通り
マニュアルにはない詰まりポイントとかもち
りばめられてます。
アジェンダ
➡ フロントエンド実装とバックエンド実装を分ける構成に
ついて
•ケース1) Play内で完結
•ケース2) 別々のリポジトリで作成 -> jsやimgをコピー
•ケース3) appとuiを分けて2つのビルドシステムを使う
•ケース4) sbt-web?
5
どんな構成
でビルド
してます?
ケース1
Play内で完結
Play内でビルド
ケース1
Play内で完結
➡ Play内でビルド
•フロントエンド世界のビルドシステムを使わない
7
project
assets/
public/
...etc
CoffeeScript
LESS
Plugin
etc...
ビルドが、ちょいおそい...
フロントエンドの人がどこをい
じればいいか...悩む
ケース2
別々のリポジトリで作成
jsやimgをコピー
ケース2)
別々のリポジトリで作成
➡ jsやimgをコピー
9
project
public/
Frontend
JavaScript
Images
CSS
別リポジトリ
こちら内でGruntを
使うなど
ケース3
リポジトリ内でapp用とui用を分ける
2つのビルドシステムを使う
ケース3)
Playリポジトリ内でapp用とui用を分ける
➡ 2つのビルドシステムを使う
11
project
ui/
public/
Frontend
JavaScript
Images
CSS
CoffeeScript
LESS etc...
Buildして、
/publicへ
出力
ビルドはやい...
フロントエンドの人がいじる
場所が固定
アプリ内にファイル出力
ケース3)
Playリポジトリ内でapp用とui用を分ける
➡ ディレクトリ構成
•app/
•conf/
•public/
•ui/ -> ここ以下Grunt
app/ -> Angularとか
components/
node_modules/
stylesheets/ -> LESSとか
ui-test-public/ -> フロントの人確認用publicエリア
12
書き出す
ケース4
sbt-web ?
sbt-web
➡ 興味深い技術群で成り立っている
•WebJars
•js-engine <- Trireme (tráiriːm) トゥラァィリィーム -> 三段櫂船
github.com/apigee/trireme
Embed Node.js inside a Java Virtual Machine
『
JVM上Rhinoは、V8よりもはるかに遅い。(いくつかのベンチマークでは、
50倍の時間がかかります。)
』
とのこと。 Nashornとかになるとどうなるんだろう?
... まだよくわかってません。
14
現場のニーズ
➡ 動作をすぐに確認したい
➡ コピーなどを行うのはうざいので、ビルドがやって
ほしい
➡ フロントエンド側ライブラリの管理は面倒
•WebJarで、バックエンド側で解決するか?
•bower等で、フロントエンド側で解決するか?
➡ こんな風にやってます話があれば #play_ja へ
15
ありがとうございました!
次のPlayはじめて&もくもく会は
6月半ば∼後半を考えてます
Play 2.1 はじめて&もくもく会
日本Playframeworkユーザー会
http://playframeworkja.doorkeeper.jp/

More Related Content

Play meet up 発表資料「フロントエンドとバックエンドのビルド構成について」