パソコンを初期化するなどの機会で、外部メディアへ秘密鍵のバックアップをとることがあるのですが
こうして保存してあった鍵を、外部メディアからコピー＆ペーストで復元すると、鍵を認識してくれなくなることがあります。
この場合、permissionが不正で秘密鍵へのアクセスができないパターンが濃厚なので
まずは、秘密鍵id_rsaのpermissionを600に指定してみると良いです。
$ chmod 600 ~/.ssh/authorized_keys
webpackというタスクランナーが良いと教えてもらったので、さわりだけ試してみました。
挑戦はしましたが、私の中ではこのようなふんわりした認識しかないので、解説は省略！
webpack自体については、既出のしっかりした記事が検索すればたくさん見つかりますので、そちらを参考にしてください。
現状のクライアントワークは、HTML+CSSでのコンテンツ制作をベースにJavascriptでの機能実装がほとんどなので
まずはHTML+CSSの快適さが気になる。
使用頻度の高いSassのコンパイル環境を作る手順を調べてみました。
過去の苦い経験から、納品後にちょっと手を加えたいからCSSの触りかたと場所を教えて…という連絡がないこともないので
webpackを使用しますが、SassはJavascriptではなくCSSとして書き出せるようにします。
参考記事：
Webpackで Browsersync + Sassコンパイルを試す
webpackを使ってsassをコンパイルできるようにしよう！
なお、私の記事は覚書と感想のようなものなので
環境構築の手順やポイントは参考記事のほうがためになります。どうもありがとうございました。
最近知ってしまった真実…
一部のブラウザで、CSSの強制折り返しが効かないケースがあることがわかりました。
* {
word-bleak: break-all;
}
こうしときゃ万能だろうという神話を信じていたのに、:（コロン）や/(スラッシュ)が連続している場合は折り返してもらえません。
2016年11月2日現在ではこうなっていました。
定番ライブラリのUnderscore.jsに、今更ながら手をだしてみました。
この短い指定でエスケープもその逆（アンエスケープ）もできるのは助かる！
_.escape(値)
_.unescape(値)
カテゴリごとのテーマカラーとアイコンを一括指定する方法です。
classとアイコンのimgファイルで命名規則を揃えておけば
このように、Sassのリストとeachを利用して短いコードでスタイリングできます。
See the Pen @each set color & background-image by webdev (@webdev-jp-net) on CodePen.dark
2016年から、エディターをSublimeTextからAtomへ変えているのですが
その中でもすばらしいのが、プラグインのpigmentsです。
Atomで初期インストールするプラグインの記事をみても、軒並みエントリーされているプラグインなので
今更私がここで言うのもおこがましいのですが
とりあえず入れてみたら、これが便利でびっくり！
インストール方法や、機能説明については
既存ですばらしい紹介がたくさんあるので、割愛させていただき
クライアントワークで活用してみて、具体的にどんな場面で素晴らしいと感じたか簡単にまとめてみました。
そう、便利なんだけど、実際には全部の機能は使いこなしていないです。
Show Paletteも良さそうだけど、最初に「おー！」と開いたきりでした。
フォームにフォーカスしている間だけループで任意の処理を実行し続けるJavascriptを作りました。
スマートフォンの、日本語入力中リアルタイム文字カウントなどに使えます。
ver1.7以上のjQueryが必要です。
たとえば、ｊQueryでイベントを設定するとき、こんな書き方をしたことはありませんか？
// フォーカスが外れると改行を削除する
var deleteLinefeed = function(obj) {
var v = obj.val();
v = v.replace(/¥n/g, '');
obj.val(v);
};
$('textarea').on('blur', function(){
deleteLinefeed($(this));
});
この無名関数が冗長で気になる！
なにより、無名関数で紐付けたら、イベントリスナーを削除しにくいです。
そこで、イベントオブジェクトのcurrentTargetを活用すると
このようにスッキリさせられます。
// フォーカスが外れると改行を削除する
var deleteLinefeed = function(e) {
var obj = $(e.currentTarget),
v = obj.val();
v = v.replace(/¥n/g, '');
obj.val(v);
};
$('textarea').on('blur', deleteLinefeed);
currentTargetで取得するのは、イベントを紐付けてあるオブジェクトです。
これと似たtargetでは、イベントを発動させたオブジェクトを取得できます。
画像化された文字の見出し、カード型のサムネールや、かるたなど
同フォーマットで文字違いのSVG画像をIllustratorで大量に書き出す場合のコツを紹介します。
基本的には、SVG保存で選べる「アートボードごとに作成」での一斉出力なのですが
アートボードパレットの機能も活用すると、画像を複製してたくさん作る作業もかなり楽になることがわかったので、そちらのほうも紹介します。
サンプルとして、この47都道府県のカードを作ってみました。
コツをつかめば、だいたい20分で作ることができます。
HomeBrewでnodebrewをインストールし、そのnodebrewからNode.jsをインストールすると
nodebrew上ではインストールが成功しているのに、実際にはNode.jsとnpmがインストールされない不具合があります。
よし！インストールできた！
$ nodebrew list v6.1.0 current: v6.1.0
んん？！！
$ node -v -bash: node: command not found