JavaEE7徹底入門 プレゼンテーション層の開発 JSF
13 likes5,444 views
JavaEE7徹底入門 プレゼンテーション層の開発 JSF
JavaEE7徹底入門 プレゼンテーション層の開発 JSF
- 1. 『Java EE 7 徹底入門』 プレゼンテーション層の開発 JSF 2016/02/15 JJUG ナイトセミナー #JJUG 加藤田 益嗣 @den2sn
- 2. Safe Harbor Statement • 本資料は私個人の見解であり所属会社の見解を反映したものではありません。 • 本資料の作成にあたっては正確な記述につとめましたが、内容に対してなんら 保証をするものではなく、内容に基づくいかなる運用結果に関してもいっさいの 責任を負いません。 22016/02/15 JJUG Night Seminar #JJUG
- 3. 自己紹介 加藤田 益嗣（Katoda Masuji） • 日本オラクル株式会社 クラウド・テクノロジーコンサルティング統括本部 シニアコンサルタント • Java、Java EEの開発技術支援 • Java EE 7 徹底入門［第2~4 章担当］ 32016/02/15 JJUG Night Seminar #JJUG
- 4. 本日話す内容 • 本書の概要 • JSFの概要と構成要素 • 本書では触れられなかった話 42016/02/15 JJUG Night Seminar #JJUG
- 5. 本書の概要 2016/02/15 JJUG Night Seminar #JJUG 5
- 6. アンケート JSFを使用して開発したことがある方 62016/02/15 JJUG Night Seminar #JJUG (^_^)/
- 7. Java EE 7徹底入門の目次 • 第1章 Java EEの基礎知識 • 第2章 プレゼンテーション層の開発―JSFの基本 • 第3章 プレゼンテーション層の開発―JSFの応用 その１ • 第4章 プレゼンテーション層の開発―JSFの応用 その２ • 第5章 ビジネスロジック層の開発―CDIの利用 • 第6章 ビジネスロジック層の開発―EJBの利用 • 第7章 データアクセス層の開発―JPAの基本 • 第8章 データアクセス層の開発―JPAの応用 • 第9章 RESTful Webサービスの開発 • 第10章 バッチアプリケーションの開発 72016/02/15 JJUG Night Seminar #JJUG 約150 ページ
- 8. Java EE 7徹底入門の目次（第2~4章） • 第2章 JSFの基本 – JSF概要 – JSFの構成要素 – JSFの画面遷移 – JSF の内部処理 – JSF の基本設定 – フェースレットタグライブラリ – EL（Expression Language） • 第4章 JSFの応用 その２ – 認証/認可 – 国際化 – ブックマーカビリティ – フェーズリスナ – Java EE 7で導入されたJSF の機能 – まとめ 2016/02/15 JJUG Night Seminar #JJUG 8 • 第3章 JSFの応用 その１ – 入力チェック – コンバータ – コンポーネントのカスタマイズ – フェースレットテンプレート – HTML5フレンドリマークアップ – Ajax
- 9. 第2~4章で説明するJSFの主な機能 92016/02/15 JJUG Night Seminar #JJUG サーバ フェースレット マネージドビーン タグライブラリ EL 画面遷移 スコープ 入力チェック コンバータ コンポーネント テンプレート HTML5 Ajax 認証認可 国際化 ブックマーカビリティ フェーズリスナ ユーザ 第2章 第3章 第4章
- 10. サンプルアプリケーション • ナレッジバンク – ナレッジを収集するためのシステム – ナレッジの投稿、コメントの追加が可能 – 本書でより実用的な機能を説明するために作成 102016/02/15 JJUG Night Seminar #JJUG
- 11. サンプルアプリケーションのデモ 2016/02/15 JJUG Night Seminar #JJUG 11
- 12. サンプルアプリケーションの画面遷移 2016/02/15 JJUG Night Seminar #JJUG 12 アカウント登録ログイン ナレッジ変更 ナレッジ投稿 アカウント登録 登録 ログイン 検索 詳細 変更 投稿 削除 コメント投稿 ナレッジ投稿 ログアウト 変更 ナレッジ詳細 ナレッジ一覧
- 13. JSFの概要と構成要素 2016/02/15 JJUG Night Seminar #JJUG 13
- 14. JSFとは • Java EE 5から導入されたプレゼンテーション層を作成するための フレームワーク • Java EE 7でのバージョンはJSF2.2 142016/02/15 JJUG Night Seminar #JJUG データ ベース アプリケーションサーバ JPA jBatch EJB JAX-RS JSF CDI アプリケーション
- 15. プレゼンテーション層のフレームワーク • 主にブラウザの画面とサーバ間の処理を受け持つ • Java EE 5以前はサーブレット＋JSPを使用 – HTTPアクセスに対する低レイヤーの機能を提供 • サーブレットだけでは値のマッピングや入力チェックなどWebアプリ ケーションで必要な機能がなく、サードパーティ製フレームワークを 併用 – Struts、Spring MVC等 • Java EE 5以降はJSFをJava EEの標準仕様として導入 152016/02/15 JJUG Night Seminar #JJUG
- 16. プレゼンテーション層のフレームワークイメージ 2016/02/15 JJUG Night Seminar #JJUG 16 サーブレット Struts Spring MVC JSF Webアプリケーション Webアプリケーション Webアプリケーション ブラウザとHTTP通信を するための機能を提供 値のマッピングや 入力値のチェックやなど、 Webアプリケーションで必要な 機能を提供 開発するアプリケーション Java EEの仕様で提供
- 17. JSFの構成要素 • JSFを構成する要素にはフェースレットとマネージドビーンがある 2016/02/15 JJUG Night Seminar #JJUG 17 フェースレット マネージドビーン 画面の定義 処理の定義
- 18. フェースレットとは • 画面のレイアウトを記述するXHTMLベースのテン プレートエンジン • JSF2.0からJSPの代わりに使用 182016/02/15 JJUG Night Seminar #JJUG フェースレット マネージドビーン
- 19. フェースレットとJSPとの違い • XHTML（XML）なので記載が厳密 – 記載を統一しやすい • スクリプトレットが記載できない – 画面中にJavaのコードが使用できない – 画面と処理を明確に分離 • 文字列のサニタイジング – 表示文字列中のHTMLの特殊文字はサニタイジングする – セキュアに画面が作成 • nullの文字列表示処理 – nullは空文字として表示 • テンプレート機能 – テンプレート機能をタグライブラリで提供 192016/02/15 JJUG Night Seminar #JJUG フェースレット マネージドビーン
- 20. フェースレットの記載例 • アカウント登録画面 2016/02/15 JJUG Night Seminar #JJUG 20 <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://xmlns.jcp.org/jsf/html"> <h:head> <title>Knowledge Bank</title> </h:head> <h:body> <div id="top_content"> <h:form id="form"> <h1>アカウント登録</h1> <div class="entry"> <div> <label>ユーザID</label> <div> <h:inputText id="userId" value="#{accountBean.account.userId}" /> <h:message for="userId" errorClass="error"/> </div> ... HTMLとほぼ同様の記載 フェースレット マネージドビーン
- 21. フェースレットの構成要素 • フェースレットタグライブラリ • EL（Expression Language） 212016/02/15 JJUG Night Seminar #JJUG フェースレット マネージドビーン
- 22. 入力と登録ボタン部分のソースコード 222016/02/15 JJUG Night Seminar #JJUG <label>ユーザID</label> <div> <h:inputText id="userId" value="#{accountBean.account.userId}" /> <h:message for="userId" errorClass="error"/> </div> フェースレットが提供する タグライブラリ 入力項目とマネージドビーンとの紐 付け（バインド）にEL式を利用 <h:commandButton action="#{accountBean.register()}" value="登録" /> ボタンを押下するとregisterメ ソッドが呼ばれる フェースレット マネージドビーン
- 23. マネージドビーンとは • フェースレットとバインドするJavaのクラス • 入力値の保持やボタン押下時の処理などを行う 232016/02/15 JJUG Night Seminar #JJUG フェースレット マネージドビーン
- 24. マネージドビーンの構成要素 • スコープ • バインドする値の保持 • ビジネスロジックの呼び出し • 画面遷移 242016/02/15 JJUG Night Seminar #JJUG フェースレット マネージドビーン
- 25. マネージドビーンの記載例 • アカウント登録マネージドビーン 252016/02/15 JJUG Night Seminar #JJUG @Named @RequestScoped public class AccountBean { private Account account = new Account(); public Account getAccount() { return account; } public void setAccount(Account account) { this.account = account; } public String register() { account.setAccountGroup("userGroup"); account.setPassword(PasswordUtil.hash(password)); accountFacade.create(account); return "/login?faces-redirect=true"; } } スコープの定義 入力値を保有する フィールド ボタン押下時の処理 ログイン画面に遷移 フェースレット マネージドビーン
- 26. フェースレットとマネージドビーンの処理イメージ 262016/02/15 JJUG Night Seminar #JJUG アカウント登録画面 (account/register.xhtml) アカウント登録マネージドビーン (AccountBean.java) アカウント情報(account) ・ユーザID(userId) ・名前(name) ・メールアドレス(mail) ・パスワード(password) 登録処理(register) { } ユーザID アカウント登録 名前 メールアドレス パスワード 登録 EL式でバインド ビジネス ロジック の処理へ コンポーネントを主軸にコードを作成するためコンポーネント指向と言われる。
- 27. 本書では触れられなかった話 2016/02/15 JJUG Night Seminar #JJUG 27
- 28. 本書では触れられなかった話 • JSFのより詳細な機能 • Java EE 8（JSF2.3） • MVC1.0 282016/02/15 JJUG Night Seminar #JJUG
- 29. JSFのより詳細な機能 • カスタムコンポーネント • イベントハンドリング – Value Change Events – Action Events • ビーンバリデーション – グループ化機能 • EL – Lambda式 – 文字列連結オペレータ 292016/02/15 JJUG Night Seminar #JJUG 本資料でも詳細な説明は省略。
- 30. Java EE 8（JSF2.3） • JSF2.3で予定されている新機能 – WebSocket対応 • <f:socket>タグ – マルチフィールドバリデーション • <f:validateWholeBean> – Java Timeサポート • Date and Time APIのサポート – EL式で利用可能な暗黙オブジェクトの追加 • facesContext、session、viewScopeなど – マネージドビーン等への@Inject可能なオブジェクトの追加 • FacesContext、ExternalContextなど 302016/02/15 JJUG Night Seminar #JJUG
- 31. MVC1.0 • MVC1.0 – アクション指向フレームワーク – Java EE 8で導入（現在ドラフト） – JAX-RSを拡張 – ビューにはフェースレット,JSPをサポート • 画面のコンポーネントなどの提供は現状なし – 名前が直接的だけど紛らわしい．．． 312016/02/15 JJUG Night Seminar #JJUG
- 32. MVC1.0実装例 2016/02/15 JJUG Night Seminar #JJUG 32 @Path("hello") public class HelloController { @GET @Controller public String hello() { return "hello.jsp"; } } @Controllerアノテーションを付 加するとMVCの処理と認識 JAX-RSとほぼ同様の記載 hello.jspに遷移
- 33. 今後のプレゼンテーションの選択肢 332016/02/15 JJUG Night Seminar #JJUG どのアーキテクチャを選択しても今後はコンポーネント指向に収束。 Java EE 7 Java EE 8 JSF JAX-RS＋クライアントサイドフレームワーク （AngularJS、React、Backbone.jsなど） MVC1.0 + Web Components?
- 34. まとめ • プレゼンテーション層の開発について – Java EE 7環境でのプレゼンテーション層の選択肢 • サーバサイドでJavaで開発＝JSF • クライアントサイドでJavaScriptで開発＝クライアントサイドフレームワーク ＋JAX-RS – JSFはかなり成熟（1.0は2004年3月にリリース） • 本書について – Java EE 7のJSFを使用した機能を概ね網羅 – サンプルアプリケーションをベースとしたより実践的な説明 342016/02/15 JJUG Night Seminar #JJUG
- 35. 以上です。 ご清聴ありがとうございました。 2016/02/15 JJUG ナイトセミナー #JJUG 加藤田 益嗣 @den2sn