LitElement を Webpack でバンドルして IE11 で動かすための最適解
WebComponents の対応状況がだいぶいい感じになってきました。 WebComponents のブラウザ対応状況 - Can I use スマ ...
Adobe CCライブラリで管理しているアイコンをSVGで一括エクスポートしたい
ベクターアイコンのデータ管理方法 サービス上で使われるアイコンなどのデザインデータをみなさんはどのように管理していますか？ ベクターアイコンなどの元デ ...
CSS フレームワーク導入時に気をつけること
フロントエンドエンジニアと一口に言ってもその出自は様々で、バックエンドから入ってきた人たちは何となく CSS を目の敵にする傾向が強いような気がします ...
Web API の CSRF 対策まとめ
セキュリティ脆弱性診断などでたまに CSRF について指摘されることがあります。 今まではトークン発行して対応すれば良いんでしょ？ と思ってましたが、 ...
標準的なウェブページ作成用のボイラープレート最終版
まえがき ウェブページを構成する要素や機能は複雑化の一途をたどっていますが、フロントエンド視点からすると最終的には HTML/CSS/JavaScri ...
今更だけど gulp の Boilerplate 作った
実はだいぶ前に作ったあったものの、いろんなことにかまけてるうちにまとめる気力が減って途中で止まっていたのです。 ちょうどまとまった時間ができたので、乗 ...
Git の Push to Deploy 環境構築メモ
Hugo でサイトを生成してラクしてるとはいえ、FTPで直上げしてるのも今時どうなんよ、ということで、Git にプッシュしたら自動でビルド＆デプロイす ...
Mondo Rescue で Google Drive に定期バックアップ 環境構築メモ
サーバ自体はあまりクリティカルなものが動いてないので、いまだにサーバのバックアップ対策をしていなかったんですが、トラブルがあったときに同じ手順繰り返す ...
[Qiita] gulp & browserify で 汎用的に 複数のエントリーポイントを管理する
Web制作に gulp を使っていと、JavaScript の 連結処理には gulp-concat が王道ですが、最近は専ら browserify ...
[Qiita] gulp-pug v2.0 で JSON ファイルを変数に読み込む方法
jade は商標の問題から、pug に名前が変わりました。また、2016年6月23日時点で v2.0 がベータ版リリースされていますが、v1.11から ...
[Qiita] gulpで複数のスプライト画像やWebフォントを管理する
gulpでスプライト画像や Webフォントを生成する 今や CSSスプライト画像や Webフォントを、手動で作成・更新する機会は少なくなりました。タス ...
[Qiita] 画像ファイルの命名規則
命名規則の必要性 ボリュームの少ない単発のページや、1名の専任で済んでしまうようなプロジェクトでは自分の裁量でどうとでもなりますが、継続性のあるプロジ ...
[Qiita] Windows の Node.js 開発環境構築 最小手順
Node.js をの環境構築は Mac 環境だと割りとすんなり行くのですが、Windows 環境では npm install を行うとパッケージよって ...
[Qiita] gulp-jade で JSON ファイルを変数に読み込む方法
jade でサイトを作成していると、共通情報は外部ファイルにまとめて記述したくなります。やはり jade なので、外部ファイルは JSON 形式にまと ...
ウェブサイト制作ツールその2：パスワード生成
自宅のPCは1Passwordでパスワード管理してるので、通常はこれで事足りてるのですが、さすがに業務では使用できません。 ちょくちょくBasic認証 ...
ウェブサイト制作ツールその1：QRコード生成
スマホでサイトの動作検証するとき、スマホのブラウザにテスト用のURLをフリックで打ち込んで…とかやっているとメンドくさくて発狂しそうになります。 なの ...
[Qiita] CSS 設計における Modifier の記述ルールの最適化
みなさんは CSS 設計をするとき、どの設計方針を採用してますか？ 自分も SMACSS、BEM、FLOCSS と渡り歩いて来ましたが、どうにもしっく ...
PHP 7.0 & HTTP2 アップグレードへの道
PHP7 がリリースされ、nginx も HTTP2 に対応するようになり、ともにサイトの高速化が期待できるとのことで、早速導入してみました。 PHP ...
さくらVPS 監視環境構築
既にWebサーバ、メールサーバ、データベースなどのミドルウェアがインストール済みであることを前提に監視の環境の構築手順メモ。さくら VPS 契約後のほ ...
さくらVPS nginx 構築＆設定メモ
とりあえずサーバに Apache を入れたものの、せっかく勉強がてら借りているさくら VPS なので nginx に挑戦してみました。 さくら VPS ...
さくらVPS Apache+MySQL+PHP インストール＆設定メモ
さくら VPS 契約後のほぼ自分用セットアップメモ第二弾です。 過去のメモの整理がてらのまとめです。 今後、他にもサーバに手を加えた時にはメモを落とし ...
さくらVPS 初期セットアップメモ
さくら VPS 契約後の最初のセットアップ手順メモです。 ほぼ自分用にメモしていたものですが、整理も兼ねてブログにアップしておきます。 以下、手順は ...
Amber の Sublime Text 用 Syntax Highlight 作った
構文ファイル GitHub に公開しました。 使い方 Windows は %APPDATA%\Sublime Text 3\Packages\User ...
[Qiita] ディレクトリ名に記号を使いたいので調べてみた
ディレクトリ名に記号を使うメリット 制作上のガイドラインの中に、大抵の場合、画像は「img」、JavaScriptは「js」、CSSは「css」と名称 ...
[Qiita] さくらレンタルサーバでマルチドメイン毎にPHPの設定やバージョンを切り替える
さくらのビジネスプロ、マネージドプランはモジュール版PHPを利用することができます。 モジュール版はCGI版と比べて負荷が少なく動作が早いため、可能で ...
[Qiita] 修正差分ファイルのみで本番適用した状態をローカルで確認する方法
現行サイトのオリジナルデータを支給してもらえず、テスト環境も存在しない案件で、修正ファイルを差分で納品する必要に迫られるケースがあります。 こういう場 ...
初めのエントリ
実は一時期、WordPress でブログをやっていた時期があったのですが、2～3 エントリーを上げたところで3日坊主で終わってしまいました。 最近、Q ...