Challenge Engineer Life !

エンジニア人生を楽しみたい!仕事や趣味で学んだ技術的なことを書いていくブログです。

NetBeansで始める初めてのPrimeFaces

来週はいよいよ、初めて参加させて頂くJavaEE Advent Calendarの担当がまわって来ます。
私のようなJavaEE初心者が書いていいのか正直不安ですが、せっかくお声かけ頂いたので頑張りたいと思います(^^;

今日はその事前準備ネタです。

そういえば、そもそもPrimeFacesを使ったWebApplicationの作成手順を整理していないなと気づいたので、NetBeansを使ったやり方を書きたいと思います。今日はMavenを使わない通常の方法を書いて、明日はMavenを使った方法を書く予定です。

では早速開始です。なおNetBeansは7.2.1を利用しました。

1.NetBeansを起動し、ファイルメニューの新規プロジェクトを選択します

2.カテゴリ「Java Web」、プロジェクト「Webアプリケーション」を選択します

3.プロジェクト名を入力します(この例ではPrimeFacesSampleとしました)

4.管理対象BeanをCDIとする場合には「コンテキストと依存性の注入を有効にする」にチェックを入れます

ただし、今回の例では入力値を受け取って制御する等の処理までは書かないので、チェックは入れても入れなくても同じ挙動です。

5.フレームワークの「JavaServer Faces」にチェックを入れます

実はここで「コンポーネント」タブをみるとPrimeFacesがあり、チェックすればjarの追加ができますが、NetBeansのデフォルトでバンドルされたバージョンが参照されるため最新とは限りません。この例では最新を組み込む手順で進めます。

6.プロジェクトが生成され、以下のようになります

7.PrimeFacesのホームページにアクセスし(http://www.primefaces.org/)、DevelopmentsメニューのDownloadsを選びます

8.ダウンロード一覧(バージョン単位)が表示されるので、「Latest and Greatest」のBinaryを選択してダウンロードします

9.NetBeansのプロジェクトに戻り、ライブラリで右クリックして「JAR/フォルダの追加」を選択し、8でダウンロードしたjarを指定します

10.以下のようにライブラリへ追加されればOKです

11.「index.xhtml」のコードを表示し、bodyタグの中で以下のように打ちます

12.Ctrl+Spaceを押すとPrimeFacesの様々なコンポーネントのタグが確認できます。

12.例えば以下のようにテキストボックスとボタンを配置してみます

13.実行すると…でかっ、と反応しますがPrimeFacesのコンポーネントが表示されました

フォントサイズ等をCSSで調整する必要はありますが、とりあえず以上でPrimeFacesを利用可能なプロジェクトセットアップが完了です。
長々書いてますが、実際にやってみると簡単です。

にほんブログ村 IT技術ブログへ
にほんブログ村 にほんブログ村 IT技術ブログ Javaへ
にほんブログ村