WebLogic Server 勉強会JavaServer Faces 2.0入門2012年11月22日日本オラクル株式会社Fusion Middleware事業統括本部 松林晶1   Copyright © 2012, Oracle and/...
Program Agenda                  JSFとは                    – JSFとは                    – JSFのメリット                  JSFの技術概要...
JSFとは3   Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
JSFとは        JSF概要         JavaServer Facesの略         JSFは、Java EE標準のWebアプリケーションフレームワーク                        バージョン    ...
JSFとは        JSFのメリット                                                                                 アノテーションベースのかん       ...
JSFとは        JSFのメリット①           安心のJava EE 標準仕様                    – 全てのAPサーバが実装及びサポートしているため安心して使用可能           アノテーションベ...
JSFとは        JSFのメリット②           コンポネント駆動                    – シンプルなプログラミング                            ステートレスなHTTPのやり取りを意...
JSFとは        JSF2.0新機能概要           アノテーションによるかんたん開発化           JSPに代わりFaceletsを使用可能(XHTMLの利用/テンプレート)                    ...
JSF技術概要9   Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
JSF技術概要         JSFの構成要素                                      HTTPのリクエストから適切                                              ...
JSF技術概要          シンプルなJSFの作成simple.xhtml                                                                    SimplePageBean...
JSF技術概要         JSFのライフサイクル概要                                                                                             ...
JSF技術概要         JSFのライフサイクル概要                                                                                             ...
JSF技術概要            コンポネント               HTMLで使用可能な画面コンポネントはほぼ使用可能                        – 従来のHTMLで記述することも可能 ⇒ デザイナとプログラマ...
JSF技術概要         Facelets のテンプレート            画面の共通部品化                                                                     ...
RIAなJSFの作成         (Ajaxサポート)16   Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
Ajaxサポート         サンプル例            JavaScriptの知識がなくても、<f:ajax>タグで            リッチなアプリケーションを作成可能           例            <h:...
Ajaxサポート         サンプル例            タグの属性            <f:ajax event="keyup" render="keystr"/>                       属性      ...
まとめ            JSFは標準のWebアプリケーションフレームワーク            アノテーションベースのかんたん開発            Ajaxをサポートし簡単にRIA作成19   Copyright © 201...
20   Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
21   Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
Upcoming SlideShare
Loading in …5
×

JavaServer Faces 2.0入門

3,869 views

Published on

JSF2.0は、Webアプリケーションのフレームワークで、Java EE 6に含まれる標準技術です。本セッションでは、初めにJSF2.0を利用するメリットをご紹介し、JSF2.0の基礎の基礎からRIA(リッチインターネットアプリケーション)の開発までを具体的に解説します。

日本オラクル株式会社 Fusion Middleware事業統括本部 ソリューション本部 松林 晶

0 Comments
6 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,869
On SlideShare
0
From Embeds
0
Number of Embeds
171
Actions
Shares
0
Downloads
85
Comments
0
Likes
6
Embeds 0
No embeds

No notes for slide

JavaServer Faces 2.0入門

  1. 1. WebLogic Server 勉強会JavaServer Faces 2.0入門2012年11月22日日本オラクル株式会社Fusion Middleware事業統括本部 松林晶1 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  2. 2. Program Agenda  JSFとは – JSFとは – JSFのメリット  JSFの技術概要  RIAなJSFの作成(Ajaxサポート)2 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  3. 3. JSFとは3 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  4. 4. JSFとは JSF概要  JavaServer Facesの略  JSFは、Java EE標準のWebアプリケーションフレームワーク バージョン リリース コメント 1.2 2006年5月 Java EEに正式に採用(Java EE 5) 2.0 2009年6月 Java EE6 2.1 2010年10月 2011年9月現在の最新バージョン  特徴 – リクエスト駆動ではなく、コンポネントベース – JSP、XHTML、XULを画面コンポネントとして使用可能  Oracle WebLogic Server 12c(12.1.1) – JSF 2.1, 2.0, 1.2, 1.1をサポート (http://docs.oracle.com/cd/E28613_01/web.1211/b65935/toc.htm#BGGBIJBI)4 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  5. 5. JSFとは JSFのメリット アノテーションベースのかん 安心のJava EE標準仕様 たん開発(EoD) JSF Ajaxタグによる コンポネント駆動の RIA開発 プログラミング5 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  6. 6. JSFとは JSFのメリット①  安心のJava EE 標準仕様 – 全てのAPサーバが実装及びサポートしているため安心して使用可能  アノテーションベースのかんたん開発 – XMLの記述がオプション化(XML地獄からの脱却) – @Managed をPOJOに付与するだけでマネージドBean作成 等  AjaxタグによるRIA開発 – <f:ajax>タグによって、RIAを従来よりも簡単に開発可能6 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  7. 7. JSFとは JSFのメリット②  コンポネント駆動 – シンプルなプログラミング ステートレスなHTTPのやり取りを意識することなく スタンドアロンのアプリケーションのように作成可能7 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  8. 8. JSFとは JSF2.0新機能概要  アノテーションによるかんたん開発化  JSPに代わりFaceletsを使用可能(XHTMLの利用/テンプレート) – 画面の部品の共通化  GETリクエストの使用(POSTだけでなく) – ページをお気に入りに登録可能  Ajaxサポート8 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  9. 9. JSF技術概要9 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  10. 10. JSF技術概要 JSFの構成要素 HTTPのリクエストから適切 オブジェクトを表示用の文 なページへ遷移させる 字列に変換する XUL HTTPリクエスト JSP コンバータ XHTML FacesServlet レンダラ コンポネント HTTPレスポンス コンポネント バリデータ faces-config.xml (オプション) 各コンポネントは、レンダ ラを呼び出してレスポンス マネージドBean コンポネントツリーに展開 を生成する。デフォルトの された値のチェックを行う。 レンダラはHTMLを生成す チェックエラーの場合は、 る(例えば、<h:button/> 各ページ間の画面遷移、 レスポンスのレンダリング ⇒<input type=”button”>) EJB呼出し、出入力値の フェーズに進む 管理 ※ XULとは、XML User Interface Languageの略で、“ずーる”と読む。10 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  11. 11. JSF技術概要 シンプルなJSFの作成simple.xhtml SimplePageBean.java<?xml version="1.0" encoding="windows-31j" ?> package managed;<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> import java.text.SimpleDateFormat;<html xmlns="http://www.w3.org/1999/xhtml" import java.util.Calendar; xmlns:f="http://java.sun.com/jsf/core" import javax.faces.bean.ManagedBean; xmlns:h="http://java.sun.com/jsf/html"><head> @ManagedBean <meta http-equiv="Content-Type" content="text/html; charset=windows-31j" /> public class SimplePageBean { <title>SimplePage</title></head> public void actionDisplay(){<body> display = new SimpleDateFormat("HH:mm:SS"). <f:view> format(Calendar.getInstance().getTime()); <h:form> } <h:commandButton value="Display" private String display = "まだボタンが押されていない"; action="#{simplePageBean.actionDisplay}" /> public String getDisplay() { <h:outputText value="#{simplePageBean.display}" /> return display; </h:form> } </f:view> }</body></html> 実行イメージ 11 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  12. 12. JSF技術概要 JSFのライフサイクル概要 検証NG ①ビューの復元 ②入力値の適用 イベントの処理 ③検証の処理 イベントの処理 ターゲットビューを復 クライアントからサー コンポネントツリーを 検証OKリクエスト 元し、ユーザの入力を バに対するリクエスト 操作しながら、型変換 適用します の値(フォーム、ヘッ 及び、値が有効か否か ダー等)をページの 検証する 様々なコンポネントに 適用します。 モデル(マネージド Bean)の更新はまだ行 わない ⑥レスポンスの ⑤アプリケーション ④モデル値 イベントの処理 イベントの処理 レンダリング の呼び出し の更新 レスポン ビジネスロジックを呼 コンポネントに設定さレスポンス スを作成 び出す れた値でマネージド する Beanを更新する12 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  13. 13. JSF技術概要 JSFのライフサイクル概要 検証NG ①ビューの復元 ②入力値の適用 イベントの処理 ③検証の処理 イベントの処理 検証OKリクエスト root root root input input “AAA” input “AAA” ユーザの入力値 検証(5文字以内か) output output output ⑥レスポンスの ⑤アプリケーション ④モデル値 イベントの処理 イベントの処理 レンダリング の呼び出し の更新 root rootレスポンス input “AAA” input “AAA” output output マネージドBean マネージドBean private String name; private String name; public void execute() 実行 public void execute()13 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  14. 14. JSF技術概要 コンポネント  HTMLで使用可能な画面コンポネントはほぼ使用可能 – 従来のHTMLで記述することも可能 ⇒ デザイナとプログラマの分離 <h:outputText> <h:inputText> <h:commandButton> INPUT : GO <h:commandLink> <h:selectBooleanCheckbox> *** Next Page CHECK<h:inputSecret> <h:selectOneListbox> ID NAME BD ID NAME 1 Akira 10/28 <h:column> BD 2 Shun 8/13 <h:selectOneRadio> MAN WOMAN <h:dataTable> 14 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  15. 15. JSF技術概要 Facelets のテンプレート  画面の共通部品化 <ui:define name=“content”> <ui:insert name=“header”> COMPANY News ! 2011. 10. 28 03:13:21 Update XXXX xxxxx HOME Welcome ! NEWS PRODUCT LINK <ui:insert name=“menu”> <ui:insert name=“content”> <ui:define name=“content”> テンプレートの定義 <ui:insert name=“footer”>15 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  16. 16. RIAなJSFの作成 (Ajaxサポート)16 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  17. 17. Ajaxサポート サンプル例  JavaScriptの知識がなくても、<f:ajax>タグで リッチなアプリケーションを作成可能 例 <h:outputText id="keystr" value="#{indexBean.keyword}"/><br/> <h:inputText id="keyword" value="#{indexBean.keyword}"> <f:ajax event="keyup" render="keystr"/> </h:inputText>17 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  18. 18. Ajaxサポート サンプル例  タグの属性 <f:ajax event="keyup" render="keystr"/> 属性 意味 event 何をきっかけとして非同期でリクエストを送出するか “keyup”の場合は、キーボードをタイプしたタイミング render Ajaxの呼び出し後にレンダリング(再描画)する画面の範 囲18 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  19. 19. まとめ  JSFは標準のWebアプリケーションフレームワーク  アノテーションベースのかんたん開発  Ajaxをサポートし簡単にRIA作成19 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  20. 20. 20 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.
  21. 21. 21 Copyright © 2012, Oracle and/or its affiliates. All rights reserved.

×