テンプレートエンジンを使ったコーディングで、以前EJSを試してみましたが、今回はJadeを使ってみたいと思います。
Jadeの公式サイトはこちらです。
Node.jsのインストール
公式サイトにアクセスし、INSTALLをクリックしてインストーラをダウンロードします。
Node.js
インストーラを実行してNode.jsをインストールします。
インストール完了後、Windowsキーを押して「cmd」で検索し、コマンド プロンプトを起動します。
node -v
と入力して、Node.jsのバージョンが表示されればOKです。
Jadeのインストール
コマンド プロンプトで
npm install -g jade
と入力して、Jadeインストールを行います。
インストール作業が完了したら、
jade --version
と入力して、インストールがきちんとできているか確認します。
バージョンが表示されればOKです。
Jadeを使ってみる
作業ディレクトリを作成して、そのディレクトリを移動しておきます。
cd 作業ディレクトリ
作業ディレクトリ内にindex.jadeというファイルを作成します。
内容は以下のように記述してみます。
index.jade
doctype html html(lang="ja") head meta(charset="utf-8") title タイトル body p テキストテキスト
Jadeの記述方法はざっくり言うとこんな感じらしいです。
- <>は無し
- インデントで構造を表す
- ()で属性を指定
index.jadeの記述が完了したらコマンド プロンプトで
jade index.jade
と入力します。うまくいくと、
rendered index.html
と表示され、作業ディレクトリにhtmlファイルが生成されます。
index.html
<!DOCTYPE html><html lang="ja"><head><meta charset="utf-8"><title>タイトル</title></head><body><p>テキストテキスト</p></body></html>
ただ、この状態だと改行がされていません。
改行させるには以下のように入力します。
jade -P index.jade
これで、改行された状態で出力されました。
index.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>タイトル</title>
</head>
<body>
<p>テキストテキスト</p>
</body>
</html>
今回はとりあえず触ってみた感じなので、次はもっと色々試してみたいと思います。
【参考サイト】
コメントが承認されるまで時間がかかります。