webを生業にしている人にとっては当たり前の話です。 最近、pugでwebフォームを作る機会がありました。 webフォームでラジオボタンを操る時に、ラジオボタンのテキストでも選択できるようにする手段はいくつかあります。 その手段の一つが、下記のようにinpu…

静的ページで構成されるページであっても、なるべくならテンプレートエンジンを使用して作りたいものです。 今回は、Pugテンプレートについて取り上げます。 pugjs.org Pugについては別の機会にするとして、webpackでコンパイルするための設定について記載し…

テンプレートエンジンにpug(jade)を使う場合、テンプレートのタグ属性にPHPの処理を入れるのにコツがいります。 環境 pugテンプレートのコンパイルはwebpackに任せます。 Laravelのプロジェクトを作るとデフォルトでlaravel-mix.jsと言うwebpackの設定ファイ…

pugでは、テンプレート内で変数を指定できます。 Interpolation – Pug ページ毎に変わる要素（title,keyword等）を作る時は、変数に変わる要素を入れて切り替えると言う事をすると思います。 その際、phpをはじめとしたサーバーサイドの値も反映できるように…

htmlテンプレートにpugを選んだ場合、素のscriptを書こうとすると迷います。 今回は、pugでjavascriptを書く方法について記載します。 また、本記事で記述するコードは、以前投稿したコードです。 blog.websandbag.com 期待される出力結果 下記のように記述…

HTMLのテンプレートエンジンにpugを使用したのですが、初歩的な事でどハマりしました…。 github.com 私の場合、Laravelで作成したプロジェクトにデフォルト設定される、webpackにpugライブラリを追加していました。 症状 ソース block content block nav inc…