JPA + EJB + JSF による Web アプリケーション(その 4)

今回は JSF 側のプロジェクトを作っていきます。まずは JSF のプロジェクトを作ります。ファイル構成はこんな感じ。

WebContent/WEB-INF/faces-config.xml や WebContent/lib 内に初期に配置される各種 jar は必要ないので削除します。代わりに WebContent/lib 内に filter-1.0.jar を配置します。これは以下のものを jar にしたものです。
akaneko3/EncodingFilter · GitHub

者ども、Sass を使いたくはないか

何か scss とかいう謎のファイルがありますね。これは以前当ブログでも取り上げた Sass のファイルです。今回は Eclipse 上で Sass を使って CSS 周りを管理しようと思います。

必要なもの

Ant

Java 向けのビルドツール。Sass ファイル群を自動コンパイルするために必要。

Ruby + Sass + Compass

Sass も Compass も基本的に Ruby のライブラリなので、原則として Ruby が必須。他のもので代用できないこともないが、どうせなら Ruby をインストールしてしまおう(ステマ)。Ruby をインストールしたらコマンドプロンプトで

gem install compass

を実行すれば良い(Sass は Compass と同時にインストールされる)。

sass -v
compass -v

でバージョンがちゃんと表示されていれば O.K.

必要な設定

1. Ant の設定

組み込みの Ant を使っても良いのだけれど、できれば最新版を持ってきて適当なフォルダ(C:\Ant とか)に展開しておきたい。Eclipse の設定で Ant のホームを Ant を展開したフォルダにしておくこと。

2. build.xml の作成

JSF プロジェクトを作ると ant フォルダは最初から作られている。その中に以下の内容で build.xml を作成する。

<?xml version="1.0"?>
<project name="MajorCityJSF" default="all" basedir="../WebContent">

    <property name="ruby.bin" value="C:/Ruby/bin" />

    <target name="all" depends="init,compass" />

    <condition property="done.setup">
        <available file="./resources/config.rb" />
    </condition>

    <target name="init" unless="done.setup">
        <mkdir dir="resources" />
        <exec executable="${ruby.bin}/ruby" dir="resources">
            <arg value="${ruby.bin}/compass" />
            <arg value="create" />
            <arg value="--sass-dir" />
            <arg value="sass" />
            <arg value="--css-dir" />
            <arg value="css" />
        </exec>
    </target>

    <target name="compass">
        <exec executable="${ruby.bin}/ruby" dir="resources">
            <arg value="${ruby.bin}/compass" />
            <arg value="compile" />
            <arg value="-s" />
            <arg value="expanded" />
        </exec>
    </target>

</project>

大まかなものはネットからパクってきた(ぉぃ)

3. プロジェクトの設定

プロジェクトを右クリックして Properties → Builders でビルダーの一覧を開き、New → Ant Builder で新規ビルダーを作成する。設定は下図を参照。

これでプロジェクトに変更が加えられる度に Sass ファイル群がコンパイルされる。特に Sass ファイルを編集したときなど、手動ビルドだとコンパイルし忘れるという人にはこの設定お薦め。

各種ソースコードの作成は次回。