JSFとは何か
JSFとは
JSFはJavaServer Facesの略で、JavaベースのWebアプリケーションフレームワークです。Javaの企業向けなど大規模システムに利用されるJava Platform, Enterprise Edition (Java EE) の仕様のひとつになっています。ベースになっている技術はJavaサーブレットです。
JSFは2004年にSun Microsystemsが開発したものですが、現在ではSunを買収したOracleが引き継いで推進しています。Facesという言葉からもわかるようにWebアプリケーションにおいてユーザーから見た”顔”、つまり使いやすくてデザインのよいユーザーインターフェースを簡単に作ることを主眼においたフレームワークです。
主なメリットはつぎのとおりです。
- HTMLタグと同様のタグが多数用意されている。
- タグを使って簡単にフォーム入力欄が作れる（UIコンポーネント）
- 入力値が適正な範囲かどうかなどチェックが簡単にできる（バリデーション機能）
- 入力値の型変換が簡単にできる（コンバータ機能）
- 入力値をプログラミング無しにJavaBeansに格納できる（バインディング機能）
- ページ移動を簡単に設定できる（ナビゲーション機能）
これらはどのフレームワークでも実現できますが少々プログラミングが必要でした。JSFはそのプログラミングをなるべく少なくして効率よく開発できるようになっています。
ここで解説するJSFのバージョンは最新の2.2（2013年5月リリース）です。
JSFのための開発環境
JSFを使ったWebアプリケーションを開発するためには次の環境が必要です。リンクをクリックすればサイトに飛びます。
- Java SE（Javaのコンパイラーと実行環境）
- NetBeans IDE（ソフト開発ツール、Webサーバー・サーブレットコンテナ）
なおNetBeansのパッケージは色々な種類がありますがJavaEEに対応したものをダウンロードします。このパッケージにはJSFを実行するためのサーバーであるGlassFishとTomcatが入っていて選べるようになっています。
NetBeansすべての必要なものがワンパッケージになっていますから環境構築でうまくいかなくて苦労するケースが極めて少ないと思います。Eclipseも昔よりはだいぶ楽になりましたが、EcliseやNetBeansをまったく使ったことがない人には私はNetBeansをお勧めします。NetBeansは特に難しい設定はなく、インストールのウィザードに従って進んでいけばOKです。それとJavaを推進しているお家元のOracleがサポートしているものだからです。
はじめてのJSF
NetBeansを起動すると次のような画面が出ます。
（１）プロジェクトの種類選択
新規プロジェクトを作成します。プロジェクトとは複数のJSFページやそのほかのプログラムから構成されているものです。新規作成するにはNetBeansの[ファイル]-[新規プロジェクト]を実行します。
次のようにどの種類のプロジェクトを作るか聞かれますので「Java Web」「Webアプリケーション」を選びます。
（２）名前と保存場所
次にプロジェクト名、プロジェクトの保存場所が聞かれます。ここではプロジェクト名として「MyFirst」を入力しました。プロジェクトの場所などは自動的に決めてくれますので確認だけすればよいでしょう。
（３）フレームワークの設定
JSFを使ったプロジェクトにするので、JavaServer Facesにチェックを入れます。下の欄にはJSF2.2のライブラリを使用すると自動的に表示されます。なお、フレームワークを選んでいないプロジェクトでもJSFを使うこともできます。
（４）完成
以上でNetBeansの画面には、左側「プロジェクト・ウィンドウ」に作成した「MyFirst」プロジェクトとその中に自動的に作成されたディレクトリやファイルが表示されます。右側「ファイル・ウィンドウ」にはindex.xhtmlファイルが編集できるように表示されています。
自動的に作られたindex.xhtmlは次のようになっています。単純に「Hello from Facelets」という文字が表示されるだけの機能ですがJSFで作られています。
<?xml version=’1.0′ encoding=’UTF-8′ ?>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”
xmlns:h=”http://xmlns.jcp.org/jsf/html”>
<h:head>
<title>Facelet Title</title>
</h:head>
<h:body>
Hello from Facelets
</h:body>
</html>
このファイルの拡張子はxhtmlです。JSFのタグを使ったページはこのファイル形式です。以前のJSFバージョン１ではJSP（JavaServer Pages）が使われていましたがバージョン2.0以降はこの形式です。これをFaceletsと呼びます。FaceletsはJSFのタグを使うための方式（技術）を意味しています。このファイルはJSFページと呼んでも結構です。
htmlタグの中にh=”http://xmlns…..と書いてありますがh:bodyタグなどhが付くタグを使うときにはこの宣言が必要です。NetBeansではこのタグを使うと自動的にこの宣言をhtmlタグに含めてくれます。
(5)実行
JSFを実行するには、実行するFaceletsのファイルを選択して右クリックして「実行」です。
なお、NetBeansの画面の上のほうに緑の三角で「実行」アイコンがありますが、これは現在選択されている「プロジェクト」を実行するものです。ここで新規作成したMyFirstプロジェクトを実行するという意味で、通常はプロジェクトの中のindex.xhtmlなどプロジェクトの入り口の代表ファイルを実行します。したがって例えばsample1.xhtmlなどといったJSFページを実行しようと思うと、このアイコンではできません。右クリックで実行してください。
あなたのPCのデフォルトのブラウザーが自動的に立ち上がって結果を表示してくれます。なんでもない結果ですが、これがあなたの作った最初のJSFです。アドレス欄にはlocalhostから始まる文字列が書いてありますが、これはあなたのPC内部のGlassFishサーバーが起動して、そのうえで実行されたものです。
ちょっと改造
さきほどはNetBeansが自動的に作ってくれたFaceletsを実行しただけで、あなたはほとんど何もしていません。もうひとつ、あなた独自のものを作ってみましょう。日本語を交えて。
NetBeansのプロジェクトウィンドウでMyFirstプロジェクトを選んで、[ファイル]-[新規ファイル]を実行します。次のようにファイルの種類を聞かれますので「JavaServer Faces」で「JSFページ」を選びます。
次にファイル名を聞かれますので「helloJP」としてみます。なお、ファイル名はNetBeansのプロジェクトウインドウでファイル名のところを直接編集して変更することが可能です。
JSFページが作られます。titleとbodyの中の文字を日本語に変えてみましょう。
<?xml version=’1.0′ encoding=’UTF-8′ ?>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”
xmlns:h=”http://xmlns.jcp.org/jsf/html”>
<h:head>
<title>JSFページ</title>
</h:head>
<h:body>
はじめてのJSF
</h:body>
</html>
実行すると次のようになります。
だいぶ長くなったので、はじめてのJSFはここまでにしょうましょう。
JSF2.2のすべてをまとめたkindle電子書籍 「JavaServer Faces2.2 入門」もぜひご覧ください。パソコン、iPhone、Androidどんな端末用にもamazonが無料のKindle電子書籍リーダーを用意しています。それをつかってKindle本を手軽にお楽しみください。あなたが今お使いの端末用Kidle電子書籍リーダーのご案内